IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-23 09:26:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

DEV: Add header colors to styleguide (#11421)

Browse Source
This commit is contained in:
Penar Musaraj 2020-12-07 14:50:45 -05:00 committed by GitHub
parent dd9ec827e5
commit 28feb7c2ff
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
plugins/styleguide/assets/javascripts/discourse/templates/styleguide/atoms/03-colors.hbs
View File

@ -68,3 +68,19 @@
{{color-example color="love"}}
</section>
{{/styleguide-example}}
{{#styleguide-example title="$header"}}
<section class="color-row">
{{color-example color="header_background"}}
</section>
<section class="color-row">
{{color-example color="header_primary"}}
{{color-example color="header_primary-very-high"}}
{{color-example color="header_primary-high"}}
</section>
<section class="color-row">
{{color-example color="header_primary-medium"}}
{{color-example color="header_primary-low-mid"}}
{{color-example color="header_primary-low"}}
</section>
{{/styleguide-example}}

31
plugins/styleguide/assets/stylesheets/colors.scss
View File

@ -86,4 +86,35 @@
.love {
background-color: var(--love, $love);
}
.header_primary {
background-color: var(--header_primary, $header_primary);
}
.header_background {
background-color: var(--header_background, $header_background);
}
.header_primary-low {
background-color: var(--header_primary-low, $header_primary-low);
}
.header_primary-low-mid {
background-color: var(--header_primary-low-mid, $header_primary-low-mid);
}
.header_primary-medium {
background-color: var(--header_primary-medium, $header_primary-medium);
}
.header_primary-high {
background-color: var(--header_primary-high, $header_primary-high);
}
.header_primary-very-high {
background-color: var(
--header_primary-very-high,
$header_primary-very-high
);
}
}