From 35e2fa68d3948c2989daa196152e7a09120a4cbe Mon Sep 17 00:00:00 2001 From: "nogafam.es Admin" Date: Mon, 18 Oct 2021 21:24:07 +0200 Subject: [PATCH] Refactoring home and base styles --- app/javascript/styles/contrast/variables.scss | 2 +- .../styles/mastodon-light/diff.scss | 8 ++++++- .../styles/mastodon-light/variables.scss | 4 ++-- app/javascript/styles/mastodon/about.scss | 22 ++++++------------- app/javascript/styles/mastodon/basics.scss | 2 +- .../styles/mastodon/components.scss | 3 +-- app/javascript/styles/mastodon/variables.scss | 2 +- app/views/about/show.html.haml | 4 ++-- 8 files changed, 22 insertions(+), 25 deletions(-) diff --git a/app/javascript/styles/contrast/variables.scss b/app/javascript/styles/contrast/variables.scss index cfe3b21db..97c655135 100644 --- a/app/javascript/styles/contrast/variables.scss +++ b/app/javascript/styles/contrast/variables.scss @@ -4,7 +4,7 @@ $black: #000000; $classic-base-color: #282c37; $classic-primary-color: #9baec8; $classic-secondary-color: #d9e1e8; -$classic-highlight-color: #2b90d9; +$classic-highlight-color: #f73699; $ui-base-color: $classic-base-color !default; $ui-primary-color: $classic-primary-color !default; diff --git a/app/javascript/styles/mastodon-light/diff.scss b/app/javascript/styles/mastodon-light/diff.scss index 8e6b0cdd5..287526250 100644 --- a/app/javascript/styles/mastodon-light/diff.scss +++ b/app/javascript/styles/mastodon-light/diff.scss @@ -14,6 +14,12 @@ html { } } +.button.left { margin-right: .5em } +.button.right { + filter: opacity(70%); + margin-left: .5em; +} + .status-card__actions button, .status-card__actions a { color: rgba($white, 0.8); @@ -510,7 +516,7 @@ html { .landing .hero-widget__text, .landing-page__information.contact-widget { background: $white; - border: 1px solid lighten($ui-base-color, 8%); + border-bottom: 1px solid lighten($ui-base-color, 8%); @media screen and (max-width: $no-gap-breakpoint) { border-left: 0; diff --git a/app/javascript/styles/mastodon-light/variables.scss b/app/javascript/styles/mastodon-light/variables.scss index bc039ff03..53274ca9f 100644 --- a/app/javascript/styles/mastodon-light/variables.scss +++ b/app/javascript/styles/mastodon-light/variables.scss @@ -5,7 +5,7 @@ $white: #ffffff; $classic-base-color: #282c37; $classic-primary-color: #9baec8; $classic-secondary-color: #d9e1e8; -$classic-highlight-color: #2b90d9; +$classic-highlight-color: #f73699; // Differences $success-green: lighten(#3c754d, 8%); @@ -17,7 +17,7 @@ $ui-base-color: $classic-secondary-color !default; $ui-base-lighter-color: #b0c0cf; $ui-primary-color: #9bcbed; $ui-secondary-color: $classic-base-color !default; -$ui-highlight-color: #2b90d9; +$ui-highlight-color: #f73699; $primary-text-color: $black !default; $darker-text-color: $classic-base-color !default; diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss index 46b88dae8..6f167145a 100644 --- a/app/javascript/styles/mastodon/about.scss +++ b/app/javascript/styles/mastodon/about.scss @@ -316,6 +316,10 @@ $small-breakpoint: 960px; } } +.landing__grid { + margin-top: 3em !important; +} + .landing-page { p, li { @@ -700,14 +704,12 @@ $small-breakpoint: 960px; } .directory { - margin-top: 30px; background: transparent; box-shadow: none; border-radius: 0; } .hero-widget { - margin-top: 30px; margin-bottom: 0; h4 { @@ -893,28 +895,18 @@ table.brand-img { .brand__tagline { display: block; position: relative; - font-size: 2em; + font-size: 1.6em; opacity: .8; padding-top: 2em; - width: 100%; + width: 100vw; left: 0; bottom: 0; - background: linear-gradient(to right, #d589ff4f, #a389ff4f, #89c8ff4f, #89ffcd4f, #cfff894f); + background: linear-gradient(to right, #d589ff9c, #a389ff94, #89c8ffa1, #89ffcda3, #cfff8999); color: #000 !important; margin-top: 1em; padding: .8em .4em; text-align: center; text-decoration: none; - border-radius: 0.3em; - border-left: 0.2em solid black; - border-right: 0.2em solid black; - - @media screen and (max-width: $no-gap-breakpoint) { - position: static; - width: auto; - margin-top: 20px; - color: $dark-text-color; - } } .rules-list { diff --git a/app/javascript/styles/mastodon/basics.scss b/app/javascript/styles/mastodon/basics.scss index 9e63b1d31..4d1246cda 100644 --- a/app/javascript/styles/mastodon/basics.scss +++ b/app/javascript/styles/mastodon/basics.scss @@ -8,7 +8,7 @@ body { font-family: $font-sans-serif, sans-serif; - background: darken($ui-base-color, 7%); + background: darken($ui-base-color, 50%); font-size: 13px; line-height: 18px; font-weight: 400; diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 29e2a4f42..605a1fcf9 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -50,7 +50,7 @@ cursor: pointer; display: inline-block; font-family: inherit; - font-size: 14px; + font-size: 1.3em; font-weight: 500; height: 36px; letter-spacing: 0; @@ -59,7 +59,6 @@ padding: 0 16px; position: relative; text-align: center; - text-transform: uppercase; text-decoration: none; text-overflow: ellipsis; transition: all 100ms ease-in; diff --git a/app/javascript/styles/mastodon/variables.scss b/app/javascript/styles/mastodon/variables.scss index f463419c8..8bbceb146 100644 --- a/app/javascript/styles/mastodon/variables.scss +++ b/app/javascript/styles/mastodon/variables.scss @@ -12,7 +12,7 @@ $red-bookmark: $warning-red; $classic-base-color: #282c37; // Midnight Express $classic-primary-color: #9baec8; // Echo Blue $classic-secondary-color: #d9e1e8; // Pattens Blue -$classic-highlight-color: #2b90d9; // Summer Sky +$classic-highlight-color: #f73699; // Summer Sky // Variables for defaults in UI $base-shadow-color: $black !default; diff --git a/app/views/about/show.html.haml b/app/views/about/show.html.haml index 1e3905f3a..3cb82033b 100644 --- a/app/views/about/show.html.haml +++ b/app/views/about/show.html.haml @@ -19,9 +19,9 @@ .landing__buttons .btn-container %a{ "href" => "/auth/sign_up" } - %div.btn-left=t 'about.register' + %div.button.left=t 'auth.register' %a{ "href" => "/auth/sign_in" } - %div.btn-right=t 'about.login' + %div.button.right=t 'auth.login' .landing__grid .landing__grid__column.landing__grid__column-registration