forked from treehouse/mastodon
Use `<use />` to render transparent SVG logo instead of inserting it (#10845)
Eugen Rochko
GitHub
parent
3b9c02506d
commit
8d5dcc9301
|
|
@ -16,24 +16,28 @@ module StreamEntriesHelper
|
||||||
if user_signed_in?
|
if user_signed_in?
|
||||||
if account.id == current_user.account_id
|
if account.id == current_user.account_id
|
||||||
link_to settings_profile_url, class: 'button logo-button' do
|
link_to settings_profile_url, class: 'button logo-button' do
|
||||||
safe_join([render(file: Rails.root.join('app', 'javascript', 'images', 'logo.svg')), t('settings.edit_profile')])
|
safe_join([svg_logo, t('settings.edit_profile')])
|
||||||
end
|
end
|
||||||
elsif current_account.following?(account) || current_account.requested?(account)
|
elsif current_account.following?(account) || current_account.requested?(account)
|
||||||
link_to account_unfollow_path(account), class: 'button logo-button button--destructive', data: { method: :post } do
|
link_to account_unfollow_path(account), class: 'button logo-button button--destructive', data: { method: :post } do
|
||||||
safe_join([render(file: Rails.root.join('app', 'javascript', 'images', 'logo.svg')), t('accounts.unfollow')])
|
safe_join([svg_logo, t('accounts.unfollow')])
|
||||||
end
|
end
|
||||||
elsif !(account.memorial? || account.moved?)
|
elsif !(account.memorial? || account.moved?)
|
||||||
link_to account_follow_path(account), class: "button logo-button#{account.blocking?(current_account) ? ' disabled' : ''}", data: { method: :post } do
|
link_to account_follow_path(account), class: "button logo-button#{account.blocking?(current_account) ? ' disabled' : ''}", data: { method: :post } do
|
||||||
safe_join([render(file: Rails.root.join('app', 'javascript', 'images', 'logo.svg')), t('accounts.follow')])
|
safe_join([svg_logo, t('accounts.follow')])
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
elsif !(account.memorial? || account.moved?)
|
elsif !(account.memorial? || account.moved?)
|
||||||
link_to account_remote_follow_path(account), class: 'button logo-button modal-button', target: '_new' do
|
link_to account_remote_follow_path(account), class: 'button logo-button modal-button', target: '_new' do
|
||||||
safe_join([render(file: Rails.root.join('app', 'javascript', 'images', 'logo.svg')), t('accounts.follow')])
|
safe_join([svg_logo, t('accounts.follow')])
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
|
def svg_logo
|
||||||
|
content_tag(:svg, tag(:use, 'xlink:href' => '#mastodon-svg-logo'), 'viewBox' => '0 0 216.4144 232.00976')
|
||||||
|
end
|
||||||
|
|
||||||
def account_badge(account, all: false)
|
def account_badge(account, all: false)
|
||||||
if account.bot?
|
if account.bot?
|
||||||
content_tag(:div, content_tag(:div, t('accounts.roles.bot'), class: 'account-role bot'), class: 'roles')
|
content_tag(:div, content_tag(:div, t('accounts.roles.bot'), class: 'account-role bot'), class: 'roles')
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 216.4144 232.00976"><path d="M107.86523 0C78.203984.2425 49.672422 3.4535937 33.044922 11.089844c0 0-32.97656262 14.752031-32.97656262 65.082031 0 11.525-.224375 25.306175.140625 39.919925 1.19750002 49.22 9.02375002 97.72843 54.53124962 109.77343 20.9825 5.55375 38.99711 6.71547 53.505856 5.91797 26.31125-1.45875 41.08203-9.38867 41.08203-9.38867l-.86914-19.08984s-18.80171 5.92758-39.91796 5.20508c-20.921254-.7175-43.006879-2.25516-46.390629-27.94141-.3125-2.25625-.46875-4.66938-.46875-7.20313 0 0 20.536953 5.0204 46.564449 6.21289 15.915.73001 30.8393-.93343 45.99805-2.74218 29.07-3.47125 54.38125-21.3818 57.5625-37.74805 5.0125-25.78125 4.59961-62.916015 4.59961-62.916015 0-50.33-32.97461-65.082031-32.97461-65.082031C166.80539 3.4535938 138.255.2425 108.59375 0h-.72852zM74.296875 39.326172c12.355 0 21.710234 4.749297 27.896485 14.248047l6.01367 10.080078 6.01563-10.080078c6.185-9.49875 15.54023-14.248047 27.89648-14.248047 10.6775 0 19.28156 3.753672 25.85156 11.076172 6.36875 7.3225 9.53907 17.218828 9.53907 29.673828v60.941408h-24.14454V81.869141c0-12.46875-5.24453-18.798829-15.73828-18.798829-11.6025 0-17.41797 7.508516-17.41797 22.353516v32.375002H96.207031V85.423828c0-14.845-5.815468-22.353515-17.417969-22.353516-10.49375 0-15.740234 6.330079-15.740234 18.798829v59.148439H38.904297V80.076172c0-12.455 3.171016-22.351328 9.541015-29.673828 6.568751-7.3225 15.172813-11.076172 25.851563-11.076172z" fill="#fff"/></svg>
|
<svg xmlns="http://www.w3.org/2000/svg"><symbol id="mastodon-svg-logo" viewBox="0 0 216.4144 232.00976"><path d="M107.86523 0C78.203984.2425 49.672422 3.4535937 33.044922 11.089844c0 0-32.97656262 14.752031-32.97656262 65.082031 0 11.525-.224375 25.306175.140625 39.919925 1.19750002 49.22 9.02375002 97.72843 54.53124962 109.77343 20.9825 5.55375 38.99711 6.71547 53.505856 5.91797 26.31125-1.45875 41.08203-9.38867 41.08203-9.38867l-.86914-19.08984s-18.80171 5.92758-39.91796 5.20508c-20.921254-.7175-43.006879-2.25516-46.390629-27.94141-.3125-2.25625-.46875-4.66938-.46875-7.20313 0 0 20.536953 5.0204 46.564449 6.21289 15.915.73001 30.8393-.93343 45.99805-2.74218 29.07-3.47125 54.38125-21.3818 57.5625-37.74805 5.0125-25.78125 4.59961-62.916015 4.59961-62.916015 0-50.33-32.97461-65.082031-32.97461-65.082031C166.80539 3.4535938 138.255.2425 108.59375 0h-.72852zM74.296875 39.326172c12.355 0 21.710234 4.749297 27.896485 14.248047l6.01367 10.080078 6.01563-10.080078c6.185-9.49875 15.54023-14.248047 27.89648-14.248047 10.6775 0 19.28156 3.753672 25.85156 11.076172 6.36875 7.3225 9.53907 17.218828 9.53907 29.673828v60.941408h-24.14454V81.869141c0-12.46875-5.24453-18.798829-15.73828-18.798829-11.6025 0-17.41797 7.508516-17.41797 22.353516v32.375002H96.207031V85.423828c0-14.845-5.815468-22.353515-17.417969-22.353516-10.49375 0-15.740234 6.330079-15.740234 18.798829v59.148439H38.904297V80.076172c0-12.455 3.171016-22.351328 9.541015-29.673828 6.568751-7.3225 15.172813-11.076172 25.851563-11.076172z" /></symbol></svg>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
|
@ -306,7 +306,7 @@
|
||||||
.button.logo-button {
|
.button.logo-button {
|
||||||
color: $white;
|
color: $white;
|
||||||
|
|
||||||
svg path:first-child {
|
svg {
|
||||||
fill: $white;
|
fill: $white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -359,10 +359,6 @@
|
||||||
|
|
||||||
.logo-button {
|
.logo-button {
|
||||||
background-color: $secondary-text-color;
|
background-color: $secondary-text-color;
|
||||||
|
|
||||||
svg path:last-child {
|
|
||||||
fill: $secondary-text-color;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -122,11 +122,8 @@
|
||||||
height: 36px;
|
height: 36px;
|
||||||
width: auto;
|
width: auto;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|
||||||
path {
|
|
||||||
fill: lighten($ui-base-color, 34%);
|
fill: lighten($ui-base-color, 34%);
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
&:hover,
|
||||||
&:focus,
|
&:focus,
|
||||||
|
|
|
||||||
|
|
@ -89,40 +89,21 @@
|
||||||
height: auto;
|
height: auto;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
|
|
||||||
path:first-child {
|
|
||||||
fill: $primary-text-color;
|
fill: $primary-text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
path:last-child {
|
|
||||||
fill: $ui-highlight-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active,
|
&:active,
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover {
|
&:hover {
|
||||||
background: lighten($ui-highlight-color, 10%);
|
background: lighten($ui-highlight-color, 10%);
|
||||||
|
|
||||||
svg path:last-child {
|
|
||||||
fill: lighten($ui-highlight-color, 10%);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:disabled,
|
&:disabled,
|
||||||
&.disabled {
|
&.disabled {
|
||||||
svg path:last-child {
|
|
||||||
fill: $ui-primary-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active,
|
&:active,
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover {
|
&:hover {
|
||||||
background: $ui-primary-color;
|
background: $ui-primary-color;
|
||||||
|
|
||||||
svg path:last-child {
|
|
||||||
fill: $ui-primary-color;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -131,10 +112,6 @@
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover {
|
&:hover {
|
||||||
background: $error-red;
|
background: $error-red;
|
||||||
|
|
||||||
svg path:last-child {
|
|
||||||
fill: $error-red;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -33,3 +33,6 @@
|
||||||
|
|
||||||
%body{ class: body_classes }
|
%body{ class: body_classes }
|
||||||
= content_for?(:content) ? yield(:content) : yield
|
= content_for?(:content) ? yield(:content) : yield
|
||||||
|
|
||||||
|
%div{ style: 'display: none'}
|
||||||
|
= render file: Rails.root.join('app', 'javascript', 'images', 'logo_transparent.svg')
|
||||||
|
|
|
||||||
|
|
@ -38,9 +38,7 @@
|
||||||
%li= link_to t('about.api'), 'https://docs.joinmastodon.org/api/guidelines/'
|
%li= link_to t('about.api'), 'https://docs.joinmastodon.org/api/guidelines/'
|
||||||
.column-2
|
.column-2
|
||||||
%h4= link_to t('about.what_is_mastodon'), 'https://joinmastodon.org/'
|
%h4= link_to t('about.what_is_mastodon'), 'https://joinmastodon.org/'
|
||||||
|
= link_to svg_logo, root_url, class: 'brand'
|
||||||
= link_to root_url, class: 'brand' do
|
|
||||||
= render file: Rails.root.join('app', 'javascript', 'images', 'logo_transparent.svg')
|
|
||||||
.column-3
|
.column-3
|
||||||
%h4= site_hostname
|
%h4= site_hostname
|
||||||
%ul
|
%ul
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue