From a5206f7617cf0876ade6c74417ebacf54368541e Mon Sep 17 00:00:00 2001 From: Harrison Hassig Date: Tue, 22 Oct 2024 13:21:33 +0200 Subject: [PATCH 1/4] Add branding-bar for desktop and mobile --- app/packs/images/bcn-logo-mobile.svg | 4 ++ app/packs/images/bcn-logo.svg | 6 +++ .../decidim/decidim_application.scss | 54 +++++++++++++++++++ .../layouts/decidim/header/_main.html.erb | 11 ++++ 4 files changed, 75 insertions(+) create mode 100644 app/packs/images/bcn-logo-mobile.svg create mode 100644 app/packs/images/bcn-logo.svg diff --git a/app/packs/images/bcn-logo-mobile.svg b/app/packs/images/bcn-logo-mobile.svg new file mode 100644 index 000000000..e8394d940 --- /dev/null +++ b/app/packs/images/bcn-logo-mobile.svg @@ -0,0 +1,4 @@ + + + + diff --git a/app/packs/images/bcn-logo.svg b/app/packs/images/bcn-logo.svg new file mode 100644 index 000000000..27e7a2c29 --- /dev/null +++ b/app/packs/images/bcn-logo.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/app/packs/stylesheets/decidim/decidim_application.scss b/app/packs/stylesheets/decidim/decidim_application.scss index d0561d3f3..a8d1d1977 100644 --- a/app/packs/stylesheets/decidim/decidim_application.scss +++ b/app/packs/stylesheets/decidim/decidim_application.scss @@ -74,6 +74,60 @@ padding-bottom: 12px; } +.brand-bar { + padding-top: 0.2rem !important; + padding-bottom: 0.2rem !important; +} + +.bcn-cat-link > a { + font-weight: 600; + font-size: 20px; + color: black; + line-height: 35px; + letter-spacing: -0.5px; + background-size: 0; + text-decoration: none; + font-family: "Source Sans Pro"; +} + +.logo-mobile { + display: none; +} + +.logo-desktop { + padding-right: 0rem; +} + +.bcn-cat-link > a:hover { + text-decoration: underline; +} + +body > div.layout-container > header > div.main-bar.brand-bar > div.bcn-logo > a > span { + display: none; +} + +@media screen and (max-width: 1279px) { + .brand-bar { + padding-right: 1rem !important; + } +} + +@media screen and (max-width: 1024px) { + .logo-desktop { + display: none; + } + + .logo-mobile { + display: block; + } +} + +@media screen and (max-width: 768px) { + .brand-bar { + grid-template-columns: repeat(2, minmax(0, 1fr)) !important; + } +} + @media (min-width: 768px) { .main-header__language-container > #trigger-dropdown-language-chooser { display: flex !important; diff --git a/app/views/layouts/decidim/header/_main.html.erb b/app/views/layouts/decidim/header/_main.html.erb index d46c69a7b..f546d654f 100644 --- a/app/views/layouts/decidim/header/_main.html.erb +++ b/app/views/layouts/decidim/header/_main.html.erb @@ -1,3 +1,14 @@ +
+ + +