discourse
/
discourse-docs
mirror of https://github.com/discourse/discourse-docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Use CSS custom properties for colors in SCSS 

Prepares the plugin for an upcoming change in core while maintaining
backwards compatiblity.
This commit is contained in:
Penar Musaraj 2020-08-03 21:27:43 -04:00
parent 04cc06de87
commit 6f78ea2bb2
No known key found for this signature in database
GPG Key ID: E390435D881FF0F7
2 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
assets/stylesheets/common/knowledge-explorer.scss
View File

@ -6,7 +6,7 @@
right: 0.75em; right: 0.75em;
top: 25%; top: 25%;
font-size: 1.5em; font-size: 1.5em;
color: $primary-low-mid; color: var(--primary-low-mid, $primary-low-mid);
pointer-events: none; pointer-events: none;
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {
// Just decoration, remove on small screens // Just decoration, remove on small screens
@ -17,7 +17,7 @@
.knowledge-explorer-search { .knowledge-explorer-search {
align-items: center; align-items: center;
background-color: $primary-very-low; background-color: var(--primary-very-low, $primary-very-low);
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 1.5em 1em; padding: 1.5em 1em;
@ -61,7 +61,7 @@
padding: 0.57em 1em 1em 0; padding: 0.57em 1em 1em 0;
a { a {
color: $primary; color: var(--primary, $primary);
white-space: nowrap; white-space: nowrap;
} }
@ -72,7 +72,7 @@
.knowledge-explorer-item-count { .knowledge-explorer-item-count {
margin-left: auto; margin-left: auto;
color: $primary-high; color: var(--primary-high, $primary-high);
font-size: $font-down-1; font-size: $font-down-1;
} }
@ -86,19 +86,19 @@
height: 1em; height: 1em;
padding-bottom: 0.15em; padding-bottom: 0.15em;
margin-right: 0.25em; margin-right: 0.25em;
color: $primary-high; color: var(--primary-high, $primary-high);
&.d-icon-plus { &.d-icon-plus {
height: 0.75em; height: 0.75em;
margin-right: 0.25em; margin-right: 0.25em;
} }
} }
&:hover { &:hover {
background: $highlight-medium; background: var(--highlight-medium, $highlight-medium);
} }
&.selected:hover { &.selected:hover {
background: $danger-low; background: var(--danger-low, $danger-low);
.d-icon { .d-icon {
color: $danger; color: var(--danger, $danger);
} }
} }
.tag-id, .tag-id,
@ -119,7 +119,7 @@
min-width: 5em; min-width: 5em;
&:hover { &:hover {
background-color: $primary-low; background-color: var(--primary-low, $primary-low);
} }
.d-icon { .d-icon {
@ -137,7 +137,7 @@
font-size: $font-down-1; font-size: $font-down-1;
} }
.knowledge-explorer-topic-link { .knowledge-explorer-topic-link {
color: $tertiary; color: var(--tertiary, $tertiary);
cursor: pointer; cursor: pointer;
} }
} }

2
assets/stylesheets/mobile/knowledge-explorer.scss
View File

@ -38,7 +38,7 @@
.knowledge-explorer-filters { .knowledge-explorer-filters {
margin-top: 0; margin-top: 0;
background: $primary-very-low; background: var(--primary-very-low, $primary-very-low);
padding: 0 0.5em; padding: 0 0.5em;
.knowledge-explorer-items:first-of-type { .knowledge-explorer-items:first-of-type {
margin-top: 1em; margin-top: 1em;