entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 12 Releases Wiki Activity

thonon-aggloreration-online: customize $primary-color via hobo var (#75528) #203

Merged
tjund merged 1 commits from wip/75528-tao-custom-primary-color into main 2023-03-27 15:22:31 +02:00
Conversation 0 Commits 1 Files Changed 3 +20 -11
3 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
static/thonon-agglomeration-online/_custom.scss
View File

@ -1,6 +1,9 @@
.color-cyan { .color-cyan {
color: $cyan; color: $cyan;
} }
.color-primary {
color: $primary-color;
}
.list-nude { .list-nude {
margin: 0; margin: 0;
@ -49,7 +52,7 @@
&::after { &::after {
content: "→"; content: "→";
color: white; color: white;
background-color: $cyan; background-color: $primary-color;
padding: 10px; padding: 10px;
font-weight: bold; font-weight: bold;
margin-left: 1em; margin-left: 1em;
@ -140,7 +143,7 @@ label {
color: white; color: white;
padding: .66em 1em; padding: .66em 1em;
&:hover { &:hover {
background-color: $cyan; background-color: $primary-color;
text-decoration: none; text-decoration: none;
} }
} }
@ -362,7 +365,7 @@ div.search-cell {
width: 3em; width: 3em;
height: 3em; height: 3em;
&:hover { &:hover {
background-color: $cyan; background-color: $primary-color;
color: white; color: white;
} }
} }
@ -424,7 +427,7 @@ div.search-cell {
&--link { &--link {
font-size: $fz-2; font-size: $fz-2;
&:hover { &:hover {
background-color: $cyan; background-color: $primary-color;
} }
} }
} }
@ -447,7 +450,7 @@ div.menu-cell ul {
margin-right: .33em; margin-right: .33em;
} }
&:hover { &:hover {
color: $cyan; color: $primary-color;
background-color: transparent; background-color: transparent;
} }
} }
@ -482,7 +485,7 @@ div.menu-cell ul {
text-decoration: none; text-decoration: none;
.tile--title { .tile--title {
color: $cyan; color: $primary-color;
} }
} }
} }
@ -642,7 +645,7 @@ div.menu-cell ul {
line-height: 1.4; line-height: 1.4;
} }
.actu--insert { .actu--insert {
border-left: .33em solid $cyan; border-left: .33em solid $primary-color;
padding: .66em; padding: .66em;
background-color: hsla(0, 0%, 0%, 0.05); background-color: hsla(0, 0%, 0%, 0.05);
} }

8
static/thonon-agglomeration-online/_vars.scss
View File

@ -22,6 +22,7 @@ $mobile-header-height: 75px;
// $desktop-header-height: ; // $desktop-header-height: ;
// Core vars // Core vars
$primary-color: var(--tao-primary-color, #{$cyan});
$width: 1400em / $base-font; $width: 1400em / $base-font;
$mobile-limit: 64em; $mobile-limit: 64em;
$very-small-limit: 35em; $very-small-limit: 35em;
@ -35,9 +36,8 @@ $columns-gutter: 2rem;
$font-family: Poppins, sans-serif; $font-family: Poppins, sans-serif;
$font-size: $base-font / 16 * 100%; $font-size: $base-font / 16 * 100%;
$font-color: $gray-dark; $font-color: $gray-dark;
$link-color: $cyan; $link-color: $primary-color;
$primary-color: $cyan;
$body-background: $gray-xlight; $body-background: $gray-xlight;
$header-background-color: white; $header-background-color: white;
@ -72,11 +72,11 @@ $cell-border: none;
$cell-title-cover-border: false; $cell-title-cover-border: false;
$cell-entry-border: 1px solid $body-background; $cell-entry-border: 1px solid $body-background;
$cell-entry-hover-color: white; $cell-entry-hover-color: white;
$cell-entry-hover-background: $cyan; $cell-entry-hover-background: $primary-color;
$cell-border-radius: 1rem; $cell-border-radius: 1rem;
$button-background: white; $button-background: white;
$button-hover-background: $cyan; $button-hover-background: $primary-color;
$button-color: $font-color; $button-color: $font-color;
$button-hover-color: white; $button-hover-color: white;
$button-border-radius: $cell-border-radius; $button-border-radius: $cell-border-radius;

6
templates/variants/thonon-agglomeration-online/theme.html
View File

@ -4,6 +4,12 @@
{# map menu icons #} {# map menu icons #}
{% block extra_css %} {% block extra_css %}
<style> <style>
html {
{% if tao_primary_color %}
--tao-primary-color: {{ tao_primary_color }};
{% endif %}
}
{% if menu_icons %} {% if menu_icons %}
{% for icon, slug in menu_icons.items %} {% for icon, slug in menu_icons.items %}
div.gru-nav > ul > li.menu-{{ slug }} > a { div.gru-nav > ul > li.menu-{{ slug }} > a {