diff options
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
5 files changed, 33 insertions, 59 deletions
diff --git a/app/javascript/flavours/glitch/styles/admin.scss b/app/javascript/flavours/glitch/styles/admin.scss index 40cd899b3..27be22f1b 100644 --- a/app/javascript/flavours/glitch/styles/admin.scss +++ b/app/javascript/flavours/glitch/styles/admin.scss @@ -1322,7 +1322,7 @@ a.sparkline { width: 50px; height: 21px; position: absolute; - bottom: 8px; + bottom: 0; right: 15px; background: linear-gradient(to left, $ui-base-color, transparent); pointer-events: none; diff --git a/app/javascript/flavours/glitch/styles/components/composer.scss b/app/javascript/flavours/glitch/styles/components/composer.scss index 937751d00..96ea096e1 100644 --- a/app/javascript/flavours/glitch/styles/components/composer.scss +++ b/app/javascript/flavours/glitch/styles/components/composer.scss @@ -425,54 +425,12 @@ background-repeat: no-repeat; overflow: hidden; - textarea { - display: block; - position: absolute; - box-sizing: border-box; - bottom: 0; - left: 0; - margin: 0; - border: 0; - padding: 10px; - width: 100%; - color: $secondary-text-color; - background: linear-gradient(0deg, rgba($base-shadow-color, 0.8) 0, rgba($base-shadow-color, 0.35) 80%, transparent); - font-size: 14px; - font-family: inherit; - font-weight: 500; - opacity: 0; - z-index: 2; - transition: opacity .1s ease; - - &:focus { color: $white } - - &::placeholder { - opacity: 0.54; - color: $secondary-text-color; - } - } - & > .close { mix-blend-mode: difference } } - &.active { - & > div { - textarea { opacity: 1 } - } - } -} - -.composer--upload_form--actions { - background: linear-gradient(180deg, rgba($base-shadow-color, 0.8) 0, rgba($base-shadow-color, 0.35) 80%, transparent); - display: flex; - align-items: flex-start; - justify-content: space-between; - opacity: 0; - transition: opacity .1s ease; - .icon-button { flex: 0 1 auto; - color: $ui-secondary-color; + color: $secondary-text-color; font-size: 14px; font-weight: 500; padding: 10px; @@ -481,15 +439,28 @@ &:hover, &:focus, &:active { - color: lighten($ui-secondary-color, 4%); + color: lighten($secondary-text-color, 7%); } } - &.active { - opacity: 1; + &__warning { + position: absolute; + z-index: 2; + bottom: 0; + left: 0; + right: 0; + box-sizing: border-box; + background: linear-gradient(0deg, rgba($base-shadow-color, 0.8) 0, rgba($base-shadow-color, 0.35) 80%, transparent); } } +.composer--upload_form--actions { + background: linear-gradient(180deg, rgba($base-shadow-color, 0.8) 0, rgba($base-shadow-color, 0.35) 80%, transparent); + display: flex; + align-items: flex-start; + justify-content: space-between; +} + .composer--upload_form--progress { display: flex; padding: 10px; diff --git a/app/javascript/flavours/glitch/styles/components/modal.scss b/app/javascript/flavours/glitch/styles/components/modal.scss index 7e6918356..61c292b19 100644 --- a/app/javascript/flavours/glitch/styles/components/modal.scss +++ b/app/javascript/flavours/glitch/styles/components/modal.scss @@ -609,6 +609,15 @@ color: $inverted-text-color; } + .status__content__spoiler-link { + color: $primary-text-color; + background: $ui-primary-color; + + &:hover { + background: lighten($ui-primary-color, 8%); + } + } + .dialog-option .poll__input { border-color: $inverted-text-color; color: $ui-secondary-color; diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index ad6c24ea6..0d7dfd64d 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -198,7 +198,8 @@ .status__content__spoiler-link { background: lighten($ui-base-color, 30%); - &:hover { + &:hover, + &:focus { background: lighten($ui-base-color, 33%); text-decoration: none; } @@ -222,13 +223,13 @@ background: lighten($ui-base-color, 30%); border: 0; color: $inverted-text-color; - font-weight: 500; + font-weight: 700; font-size: 11px; padding: 0 5px; text-transform: uppercase; line-height: inherit; cursor: pointer; - vertical-align: bottom; + vertical-align: top; &:hover { background: lighten($ui-base-color, 33%); @@ -760,7 +761,8 @@ a.status__display-name, background: $ui-base-lighter-color; color: $inverted-text-color; - &:hover { + &:hover, + &:focus { background: lighten($ui-base-color, 29%); text-decoration: none; } diff --git a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss index 020d39aff..bb91abdac 100644 --- a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss +++ b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss @@ -165,14 +165,6 @@ } } -.composer--upload_form--item > div input { - color: lighten($white, 7%); - - &::placeholder { - color: lighten($white, 10%); - } -} - .dropdown-menu__separator, .dropdown-menu__item.edited-timestamp__history__item, .dropdown-menu__container__header, |