diff options
Diffstat (limited to 'app/javascript/flavours/glitch')
7 files changed, 74 insertions, 13 deletions
diff --git a/app/javascript/flavours/glitch/components/display_name.js b/app/javascript/flavours/glitch/components/display_name.js index 4c65aaefa..d6ac4907d 100644 --- a/app/javascript/flavours/glitch/components/display_name.js +++ b/app/javascript/flavours/glitch/components/display_name.js @@ -15,7 +15,7 @@ export default function DisplayName ({ // The result. return account ? ( <span className={computedClass}> - <strong className='display-name__html' dangerouslySetInnerHTML={{ __html: account.get('display_name_html') }} /> + <bdi><strong className='display-name__html' dangerouslySetInnerHTML={{ __html: account.get('display_name_html') }} /></bdi> {inline ? ' ' : null} <span className='display-name__account'>@{account.get('acct')}</span> </span> diff --git a/app/javascript/flavours/glitch/features/account_timeline/components/moved_note.js b/app/javascript/flavours/glitch/features/account_timeline/components/moved_note.js index 1c0e081cc..280389bba 100644 --- a/app/javascript/flavours/glitch/features/account_timeline/components/moved_note.js +++ b/app/javascript/flavours/glitch/features/account_timeline/components/moved_note.js @@ -34,7 +34,7 @@ export default class MovedNote extends ImmutablePureComponent { <div className='account__moved-note'> <div className='account__moved-note__message'> <div className='account__moved-note__icon-wrapper'><i className='fa fa-fw fa-suitcase account__moved-note__icon' /></div> - <FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <strong dangerouslySetInnerHTML={displayNameHtml} /> }} /> + <FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <bdi><strong dangerouslySetInnerHTML={displayNameHtml} /></bdi> }} /> </div> <a href={to.get('url')} onClick={this.handleAccountClick} className='detailed-status__display-name'> diff --git a/app/javascript/flavours/glitch/features/composer/options/dropdown/index.js b/app/javascript/flavours/glitch/features/composer/options/dropdown/index.js index 8cfbac1bb..7817cc964 100644 --- a/app/javascript/flavours/glitch/features/composer/options/dropdown/index.js +++ b/app/javascript/flavours/glitch/features/composer/options/dropdown/index.js @@ -131,7 +131,7 @@ export default class ComposerOptionsDropdown extends React.PureComponent { this.state = { needsModalUpdate: false, open: false, - placement: null, + placement: 'bottom', }; } diff --git a/app/javascript/flavours/glitch/features/notifications/components/follow.js b/app/javascript/flavours/glitch/features/notifications/components/follow.js index 54506f67c..ea81d9ab4 100644 --- a/app/javascript/flavours/glitch/features/notifications/components/follow.js +++ b/app/javascript/flavours/glitch/features/notifications/components/follow.js @@ -63,13 +63,13 @@ export default class NotificationFollow extends ImmutablePureComponent { // Links to the display name. const displayName = account.get('display_name_html') || account.get('username'); const link = ( - <Permalink + <bdi><Permalink className='notification__display-name' href={account.get('url')} title={account.get('acct')} to={`/accounts/${account.get('id')}`} dangerouslySetInnerHTML={{ __html: displayName }} - /> + /></bdi> ); // Renders. diff --git a/app/javascript/flavours/glitch/styles/forms.scss b/app/javascript/flavours/glitch/styles/forms.scss index be2bf7cea..8c4c934ea 100644 --- a/app/javascript/flavours/glitch/styles/forms.scss +++ b/app/javascript/flavours/glitch/styles/forms.scss @@ -427,7 +427,7 @@ code { &__append { position: absolute; - right: 1px; + right: 3px; top: 1px; padding: 10px; padding-bottom: 9px; @@ -460,9 +460,20 @@ code { border-radius: 4px; padding: 15px 10px; margin-bottom: 30px; - box-shadow: 0 0 5px rgba($base-shadow-color, 0.2); text-align: center; + &.notice { + border: 1px solid rgba($valid-value-color, 0.5); + background: rgba($valid-value-color, 0.25); + color: $valid-value-color; + } + + &.alert { + border: 1px solid rgba($error-value-color, 0.5); + background: rgba($error-value-color, 0.25); + color: $error-value-color; + } + p { margin-bottom: 15px; } @@ -551,12 +562,12 @@ code { .oauth-prompt, .follow-prompt { margin-bottom: 30px; - text-align: center; color: $darker-text-color; h2 { font-size: 16px; margin-bottom: 30px; + text-align: center; } strong { diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss index 70aaa5bb1..3c775618e 100644 --- a/app/javascript/flavours/glitch/styles/rtl.scss +++ b/app/javascript/flavours/glitch/styles/rtl.scss @@ -73,7 +73,7 @@ body.rtl { float: left; } - .setting-toggle { + .setting-toggle__label { margin-left: 0; margin-right: 8px; } @@ -200,6 +200,10 @@ body.rtl { right: -2.14285714em; } + .admin-wrapper { + direction: rtl; + } + .admin-wrapper .sidebar ul a i.fa, a.table-action-link i.fa { margin-right: 0; @@ -218,22 +222,47 @@ body.rtl { right: 0; } + .simple_form .input.radio_buttons .radio { + left: auto; + right: 0; + } + + .simple_form .input.radio_buttons .radio > label { + padding-right: 28px; + padding-left: 0; + } + .simple_form .input-with-append .input input { padding-left: 142px; padding-right: 0; } - .simple_form .input-with-append .append { + .simple_form .input.boolean label.checkbox { + left: auto; + right: 0; + } + + .simple_form .input.boolean .label_input, + .simple_form .input.boolean .hint { + padding-left: 0; + padding-right: 28px; + } + + .simple_form .label_input__append { right: auto; - left: 0; + left: 3px; &::after { right: auto; left: 0; - background-image: linear-gradient(to left, rgba($ui-base-color, 0), $ui-base-color); + background-image: linear-gradient(to left, rgba(darken($ui-base-color, 10%), 0), darken($ui-base-color, 10%)); } } + .simple_form select { + background: darken($ui-base-color, 10%) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 12%))}'/></svg>") no-repeat left 8px center / auto 16px; + } + .table th, .table td { text-align: right; @@ -249,6 +278,10 @@ body.rtl { left: auto; } + .landing-page__call-to-action .row__information-board { + direction: rtl; + } + .landing-page .header .hero .floats .float-1 { left: -120px; right: auto; @@ -312,4 +345,22 @@ body.rtl { margin-right: 20px; } } + + .landing-page__information { + .account__display-name { + margin-right: 0; + margin-left: 5px; + } + + .account__avatar-wrapper { + margin-left: 12px; + margin-right: 0; + } + } + + .card__bar .display-name { + margin-left: 0; + margin-right: 15px; + text-align: right; + } } diff --git a/app/javascript/flavours/glitch/styles/stream_entries.scss b/app/javascript/flavours/glitch/styles/stream_entries.scss index c458fcb79..80e2d0ca0 100644 --- a/app/javascript/flavours/glitch/styles/stream_entries.scss +++ b/app/javascript/flavours/glitch/styles/stream_entries.scss @@ -3,7 +3,6 @@ border-radius: 4px; overflow: hidden; margin-bottom: 10px; - text-align: left; @media screen and (max-width: $no-gap-breakpoint) { margin-bottom: 0; |