diff options
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
9 files changed, 101 insertions, 13 deletions
diff --git a/app/javascript/flavours/glitch/styles/about.scss b/app/javascript/flavours/glitch/styles/about.scss index 7c129674d..a38ca99b4 100644 --- a/app/javascript/flavours/glitch/styles/about.scss +++ b/app/javascript/flavours/glitch/styles/about.scss @@ -145,8 +145,6 @@ $small-breakpoint: 960px; thead tr, tbody tr { - break-after: auto; - break-inside: avoid; border-bottom: 1px solid lighten($ui-base-color, 4%); font-size: 1em; line-height: 1.625; @@ -167,12 +165,25 @@ $small-breakpoint: 960px; padding: 8px; align-self: start; align-items: start; + word-break: break-all; &.nowrap { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; width: 25%; + position: relative; + + &::before { + content: ' '; + visibility: hidden; + } + + span { + position: absolute; + left: 8px; + right: 8px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } } } } diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 848ef78df..6f0d4c0be 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -1454,7 +1454,6 @@ flex: 1 1 auto; padding: 10px 5px; padding-right: 15px; - word-break: break-all; overflow: hidden; &__info { @@ -1477,8 +1476,8 @@ overflow: hidden; text-overflow: ellipsis; margin-bottom: 4px; - flex-basis: 170px; - flex-shrink: 1000; + flex-basis: 90px; + flex-grow: 1; a { color: $primary-text-color; @@ -1525,6 +1524,10 @@ noscript { text-decoration: none; } } + + a { + word-break: break-word; + } } } diff --git a/app/javascript/flavours/glitch/styles/components/media.scss b/app/javascript/flavours/glitch/styles/components/media.scss index 85982d938..366759847 100644 --- a/app/javascript/flavours/glitch/styles/components/media.scss +++ b/app/javascript/flavours/glitch/styles/components/media.scss @@ -179,10 +179,13 @@ position: absolute; } -.video-modal { +.video-modal__container { max-width: 100vw; max-height: 100vh; - position: relative; +} + +.audio-modal__container { + width: 50vw; } .media-modal { @@ -282,6 +285,7 @@ } a { + pointer-events: auto; text-decoration: none; font-weight: 500; color: $ui-secondary-color; @@ -339,6 +343,7 @@ background: darken($ui-base-color, 8%); border-radius: 4px; padding-bottom: 44px; + direction: ltr; &.editable { border-radius: 0; @@ -386,6 +391,7 @@ max-width: 100%; border-radius: 4px; box-sizing: border-box; + direction: ltr; &.editable { border-radius: 0; diff --git a/app/javascript/flavours/glitch/styles/components/modal.scss b/app/javascript/flavours/glitch/styles/components/modal.scss index 4f3e5babf..716796af9 100644 --- a/app/javascript/flavours/glitch/styles/components/modal.scss +++ b/app/javascript/flavours/glitch/styles/components/modal.scss @@ -736,6 +736,7 @@ &:focus, &:active { color: darken($lighter-text-color, 4%); + background-color: transparent; } } @@ -804,6 +805,7 @@ } .embed-modal { + width: auto; max-width: 80vw; max-height: 80vh; @@ -834,6 +836,7 @@ font-size: 14px; margin: 0; margin-bottom: 15px; + border-radius: 4px; &::-moz-focus-inner { border: 0; @@ -859,6 +862,7 @@ max-width: 100%; overflow: hidden; border: 0; + border-radius: 4px; } } } diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index ae89ac0a8..ded423afa 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -640,6 +640,10 @@ a.status__display-name, color: inherit; } +.detailed-status .button.logo-button { + margin-bottom: 15px; +} + .detailed-status__display-name { color: $secondary-text-color; display: block; diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss index 6a48ff354..e2f291b69 100644 --- a/app/javascript/flavours/glitch/styles/containers.scss +++ b/app/javascript/flavours/glitch/styles/containers.scss @@ -414,6 +414,20 @@ } } + .directory__card { + border-radius: 4px; + + @media screen and (max-width: $no-gap-breakpoint) { + border-radius: 0; + } + } + + .page-header { + @media screen and (max-width: $no-gap-breakpoint) { + border-bottom: 0; + } + } + .public-account-header { overflow: hidden; margin-bottom: 10px; diff --git a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss index 5c7fa87da..3b4ffdf3c 100644 --- a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss +++ b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss @@ -230,8 +230,19 @@ .report-modal, .embed-modal, .error-modal, -.onboarding-modal { - background: $ui-base-color; +.onboarding-modal, +.report-modal__comment .setting-text__wrapper, +.report-modal__comment .setting-text { + background: $white; + border: 1px solid lighten($ui-base-color, 8%); +} + +.report-modal__comment { + border-right-color: lighten($ui-base-color, 8%); +} + +.report-modal__container { + border-top-color: lighten($ui-base-color, 8%); } .boost-modal__action-bar, diff --git a/app/javascript/flavours/glitch/styles/mastodon-light/variables.scss b/app/javascript/flavours/glitch/styles/mastodon-light/variables.scss index 1b060b58d..312f5e314 100644 --- a/app/javascript/flavours/glitch/styles/mastodon-light/variables.scss +++ b/app/javascript/flavours/glitch/styles/mastodon-light/variables.scss @@ -18,6 +18,8 @@ $darker-text-color: $classic-base-color !default; $dark-text-color: #444b5d; $action-button-color: #606984; +$success-green: lighten(#3c754d, 8%); + $base-overlay-background: $white !default; $inverted-text-color: $black !default; diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss index 8a275d82f..2375bac90 100644 --- a/app/javascript/flavours/glitch/styles/rtl.scss +++ b/app/javascript/flavours/glitch/styles/rtl.scss @@ -7,6 +7,34 @@ body.rtl { padding-right: 15px; } + .radio-button__input { + margin-right: 0; + margin-left: 10px; + } + + .directory__card__bar .display-name { + margin-left: 0; + margin-right: 15px; + } + + .display-name { + text-align: right; + } + + .notification__message { + margin-left: 0; + margin-right: 68px; + } + + .drawer__inner__mastodon > img { + transform: scaleX(-1); + } + + .notification__favourite-icon-wrapper { + left: auto; + right: -26px; + } + .landing-page__logo { margin-right: 0; margin-left: 20px; @@ -152,7 +180,6 @@ body.rtl { } .status__action-bar { - &__counter { margin-right: 0; margin-left: 11px; @@ -345,6 +372,12 @@ body.rtl { } } + .columns-area--mobile .column, + .columns-area--mobile .drawer { + padding-left: 0; + padding-right: 0; + } + .public-layout { .header { .nav-button { |