diff options
Diffstat (limited to 'app/assets/stylesheets')
-rw-r--r-- | app/assets/stylesheets/accounts.scss | 35 | ||||
-rw-r--r-- | app/assets/stylesheets/application.scss | 16 | ||||
-rw-r--r-- | app/assets/stylesheets/stream_entries.scss | 38 |
3 files changed, 50 insertions, 39 deletions
diff --git a/app/assets/stylesheets/accounts.scss b/app/assets/stylesheets/accounts.scss index a777633f1..89fa8f5bc 100644 --- a/app/assets/stylesheets/accounts.scss +++ b/app/assets/stylesheets/accounts.scss @@ -1,39 +1,40 @@ .card { - display: flex; - background: $primary-color; - box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.1); + background: $primary-color image-url('background-photo.jpeg'); + background-size: cover; + padding: 80px 0; + padding-bottom: 30px; + border-radius: 4px 4px 0 0; .bio { - flex-grow: 1; + } .name { + display: block; font-size: 20px; line-height: 18px * 1.5; - color: $quaternary-color; + color: #fff; + font-weight: 500; + text-align: center; small { display: block; font-size: 14px; - color: $quaternary-color; + color: #2b90d9; + font-weight: 400; } } .avatar { - width: 96px; - float: left; - margin-right: 10px; - padding: 10px; - padding-right: 0; - padding-left: 9px; - margin-top: -30px; + width: 120px; + margin: 0 auto; + margin-bottom: 15px; img { - width: 94px; - height: 94px; + width: 120px; + height: 120px; display: block; - border-radius: 5px; - box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.1); + border-radius: 120px; } } } diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index c7b8814f5..42fae02e1 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -69,12 +69,13 @@ table { body { font-family: 'Roboto', sans-serif; - background: $background-color image-url('background-photo.jpeg'); + background: #282c37 image-url('background-photo.jpeg'); background-size: cover; font-size: 13px; line-height: 18px; font-weight: 400; - color: $text-color; + color: #fff; + padding-bottom: 140px; } .container { @@ -221,6 +222,17 @@ body { } } +.footer { + text-align: center; + margin-top: 30px; + + .domain { + font-size: 12px; + font-weight: 400; + font-family: 'Roboto Mono', monospace; + } +} + @import 'home'; @import 'accounts'; @import 'stream_entries'; diff --git a/app/assets/stylesheets/stream_entries.scss b/app/assets/stylesheets/stream_entries.scss index 5689880ca..5fc6e66cd 100644 --- a/app/assets/stylesheets/stream_entries.scss +++ b/app/assets/stylesheets/stream_entries.scss @@ -4,9 +4,9 @@ box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.1); .entry { - border-bottom: 1px solid $darker-background-color; - background: $background-color; - border-left: 2px solid $primary-color; + border-bottom: 1px solid #d9e1e8; + background: #fff; + border-left: 2px solid #fff; &.entry-reblog { border-left: 2px solid $tertiary-color; @@ -19,12 +19,10 @@ } &.entry-predecessor, &.entry-successor { - border-left: 2px solid $lighter-text-color; - background: darken($background-color, 5%); .content { a { - color: $lighter-text-color; + } } } @@ -38,6 +36,7 @@ &:last-child { border-bottom: 0; + border-radius: 0 0 4px 0; } } @@ -47,16 +46,13 @@ .avatar { width: 48px; - padding: 10px; - padding-left: 8px; - padding-right: 0; - padding-top: 12px; + padding: 15px; img { width: 48px; height: 48px; display: block; - border-radius: 5px; + border-radius: 48px; } } @@ -66,16 +62,17 @@ .header { margin-bottom: 5px; - padding: 10px; + padding: 15px; padding-bottom: 0; padding-left: 8px; .name { text-decoration: none; - color: $lighter-text-color; + color: #9baec8; strong { - color: $text-color; + color: #282c37; + font-weight: 500; } &:hover { @@ -87,15 +84,15 @@ } .pre-header { - border-bottom: 1px solid darken($background-color, 5%); - color: $tertiary-color; + border-bottom: 1px solid #d9e1e8; + color: #2b90d9; padding: 5px 10px; padding-left: 8px; clear: both; .name { - color: $tertiary-color; - font-weight: bold; + color: #2b90d9; + font-weight: 500; text-decoration: none; &:hover { @@ -109,9 +106,10 @@ padding: 0 10px; padding-left: 8px; padding-bottom: 25px; + color: #282c37; a { - color: $primary-color; + color: #2b90d9; text-decoration: none; &:hover { @@ -122,7 +120,7 @@ .time { text-decoration: none; - color: $lighter-text-color; + color: #9baec8; &:hover { text-decoration: underline; |