Add follow button to detailed status, add gradient to mask bio cut-off (#7979)

* Add follow button to detailed status, add gradient to mask bio cut-off

* In landing strip, show sign up link even if closed (different href)

Point to joinmastodon.org
This commit is contained in:
Eugen Rochko 2018-07-07 22:20:14 +02:00 committed by GitHub
parent 6b9e03e002
commit 30e1da7668
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 65 additions and 48 deletions

View File

@ -440,6 +440,20 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
height: 5.5em; height: 5.5em;
position: relative;
&::after {
display: block;
content: "";
width: 100%;
height: 100px;
position: absolute;
bottom: 0;
background: linear-gradient(to bottom, rgba($simple-background-color, 0.01) 0%, rgba($simple-background-color, 1) 100%);
left: 0;
border-radius: 0 0 4px 4px;
pointer-events: none;
}
} }
} }
} }

View File

@ -18,3 +18,9 @@
background: url('../images/elephant_ui_plane.svg') no-repeat left bottom / contain; background: url('../images/elephant_ui_plane.svg') no-repeat left bottom / contain;
} }
} }
@media screen and (max-width: 600px) {
.account-header {
margin-top: 0;
}
}

View File

@ -307,58 +307,57 @@
.embed { .embed {
.activity-stream { .activity-stream {
box-shadow: none; box-shadow: none;
}
}
.entry { .entry {
.detailed-status.light {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
.detailed-status.light { .detailed-status__display-name {
display: flex; flex: 1;
flex-wrap: wrap; margin: 0 5px 15px 0;
justify-content: space-between; }
align-items: flex-start;
.detailed-status__display-name { .button.button-secondary.logo-button {
flex: 1; flex: 0 auto;
margin: 0 5px 15px 0; font-size: 14px;
background: $ui-highlight-color;
color: $primary-text-color;
border: 0;
svg {
width: 20px;
height: auto;
vertical-align: middle;
margin-right: 5px;
path:first-child {
fill: $primary-text-color;
} }
.button.button-secondary.logo-button { path:last-child {
flex: 0 auto; fill: $ui-highlight-color;
font-size: 14px;
background: $ui-highlight-color;
color: $primary-text-color;
border: 0;
svg {
width: 20px;
height: auto;
vertical-align: middle;
margin-right: 5px;
path:first-child {
fill: $primary-text-color;
}
path:last-child {
fill: $ui-highlight-color;
}
}
&:active,
&:focus,
&:hover {
background: lighten($ui-highlight-color, 10%);
svg path:last-child {
fill: lighten($ui-highlight-color, 10%);
}
}
} }
}
.status__content, &:active,
.detailed-status__meta { &:focus,
flex: 100%; &:hover {
background: lighten($ui-highlight-color, 10%);
svg path:last-child {
fill: lighten($ui-highlight-color, 10%);
} }
} }
} }
.status__content,
.detailed-status__meta {
flex: 100%;
}
} }
} }

View File

@ -16,4 +16,4 @@
.actions .actions
= f.button :button, t('remote_follow.proceed'), type: :submit = f.button :button, t('remote_follow.proceed'), type: :submit
%p.hint.subtle-hint= t('remote_follow.no_account_html', sign_up_path: open_registrations? ? new_user_registration_path : 'https://joinmastodon.org') %p.hint.subtle-hint= t('remote_follow.no_account_html', sign_up_path: open_registrations? ? new_user_registration_path : 'https://joinmastodon.org/#getting-started')

View File

@ -3,6 +3,4 @@
%div %div
= t('landing_strip_html', name: content_tag(:span, display_name(account, custom_emojify: true), class: :emojify), link_to_root_path: link_to(content_tag(:strong, site_hostname), root_path)) = t('landing_strip_html', name: content_tag(:span, display_name(account, custom_emojify: true), class: :emojify), link_to_root_path: link_to(content_tag(:strong, site_hostname), root_path))
= t('landing_strip_signup_html', sign_up_path: open_registrations? ? new_user_registration_path : 'https://joinmastodon.org/#getting-started')
- if open_registrations?
= t('landing_strip_signup_html', sign_up_path: new_user_registration_path)

View File

@ -7,7 +7,7 @@
%strong.p-name.emojify= display_name(status.account, custom_emojify: true) %strong.p-name.emojify= display_name(status.account, custom_emojify: true)
%span= acct(status.account) %span= acct(status.account)
- if embedded_view? - if !user_signed_in? || embedded_view?
= link_to account_remote_follow_path(status.account), class: 'button button-secondary logo-button', target: '_new' do = link_to account_remote_follow_path(status.account), class: 'button button-secondary logo-button', target: '_new' do
= render file: Rails.root.join('app', 'javascript', 'images', 'logo.svg') = render file: Rails.root.join('app', 'javascript', 'images', 'logo.svg')
= t('accounts.follow') = t('accounts.follow')