diff options
Diffstat (limited to 'app/javascript/styles')
-rw-r--r-- | app/javascript/styles/mastodon/components.scss | 113 |
1 files changed, 84 insertions, 29 deletions
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 712b6f813..a261b582b 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -251,7 +251,7 @@ .compose-form__warning { color: $inverted-text-color; - margin-bottom: 15px; + margin-bottom: 10px; background: $ui-primary-color; box-shadow: 0 2px 6px rgba($base-shadow-color, 0.3); padding: 8px 10px; @@ -298,6 +298,19 @@ position: relative; } + .spoiler-input { + height: 0; + transform-origin: bottom; + opacity: 0.0; + transition: all 0.4s ease; + + &.spoiler-input--visible { + height: 47px; + opacity: 1.0; + transition: all 0.4s ease; + } + } + .autosuggest-textarea__textarea, .spoiler-input__input { display: block; @@ -569,9 +582,8 @@ } .reply-indicator { - border-radius: 4px 4px 0 0; - position: relative; - bottom: -2px; + border-radius: 4px; + margin-bottom: 10px; background: $ui-primary-color; padding: 10px; } @@ -1663,24 +1675,6 @@ a.account__display-name { vertical-align: middle; } -.static-content { - padding: 10px; - padding-top: 20px; - color: $dark-text-color; - - h1 { - font-size: 16px; - font-weight: 500; - margin-bottom: 40px; - text-align: center; - } - - p { - font-size: 13px; - margin-bottom: 20px; - } -} - .columns-area { display: flex; flex: 1 1 auto; @@ -1772,6 +1766,8 @@ a.account__display-name { margin-bottom: 0; } + .getting-started__wrapper, + .getting-started__trends, .search { margin-bottom: 10px; } @@ -2175,25 +2171,82 @@ a.account__display-name { } .getting-started__wrapper, -.getting_started { +.getting-started, +.flex-spacer { background: $ui-base-color; } .getting-started__wrapper { - position: relative; - overflow-y: auto; + flex: 0 0 auto; +} + +.flex-spacer { + flex: 1 1 auto; } .getting-started { - background: $ui-base-color; - flex: 1 0 auto; + color: $dark-text-color; p { - color: $secondary-text-color; + color: $dark-text-color; + font-size: 13px; + margin-bottom: 20px; + + a { + color: $dark-text-color; + text-decoration: underline; + } } a { - color: $dark-text-color; + text-decoration: none; + color: $darker-text-color; + + &:hover, + &:focus, + &:active { + text-decoration: underline; + } + } + + &__footer { + flex: 0 0 auto; + padding: 10px; + padding-top: 20px; + + ul { + margin-bottom: 10px; + } + + ul li { + display: inline; + } + } + + &__trends { + background: $ui-base-color; + flex: 0 1 auto; + + @media screen and (max-height: 810px) { + .trends__item:nth-child(3) { + display: none; + } + } + + @media screen and (max-height: 720px) { + .trends__item:nth-child(2) { + display: none; + } + } + + @media screen and (max-height: 670px) { + display: none; + } + } + + &__scrollable { + max-height: 100%; + overflow-y: auto; } } @@ -2420,8 +2473,10 @@ a.status-card { line-height: inherit; margin: 0; padding: 15px; + box-sizing: border-box; width: 100%; clear: both; + text-decoration: none; &:hover { background: lighten($ui-base-color, 2%); |