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

DEV: Use CSS custom properties for colors in core plugins

This commit is contained in:
Penar Musaraj 2020-08-04 11:14:33 -04:00
parent b76731d722
commit 14eec43889
No known key found for this signature in database
GPG Key ID: E390435D881FF0F7
5 changed files with 40 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
plugins/discourse-details/assets/stylesheets/details.scss
View File

@ -57,16 +57,16 @@ summary::-webkit-details-marker {
box-sizing: border-box;
margin: 0;
padding: 0;
color: $primary-medium;
background: $primary-low;
border: 1px solid $primary-low-mid;
color: var(--primary-medium);
background: var(--primary-low);
border: 1px solid var(--primary-low-mid);
width: 1.5em;
line-height: 1;
}
summary:hover {
color: $primary;
background: $primary-low-mid;
color: var(--primary);
background: var(--primary-low-mid);
border-color: currentColor;
}
}

46
plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss
View File

@ -1,20 +1,20 @@
.discourse-local-date {
&.cooked-date {
color: $primary;
color: var(--primary);
cursor: pointer;
border-bottom: 1px dashed $primary-medium;
border-bottom: 1px dashed var(--primary-medium);
white-space: nowrap;
.d-icon {
color: $primary;
color: var(--primary);
}
&.past {
border-bottom-color: $primary-low-mid;
border-bottom-color: var(--primary-low-mid);
}
&.past[data-countdown] {
color: $primary-medium;
color: var(--primary-medium);
}
}
}
@ -32,7 +32,7 @@
}
&.current {
background: $tertiary-low;
background: var(--tertiary-low);
}
}
}
@ -70,7 +70,7 @@
.picker-panel {
padding: 5px;
border: 1px solid $primary-low;
border: 1px solid var(--primary-low);
}
.date-picker {
@ -106,13 +106,13 @@
&.is-expanded {
.select-kit-header {
border: 1px solid $primary-medium;
border: 1px solid var(--primary-medium);
}
}
.select-kit-header {
padding: 0.5em 0.5em;
border: 1px solid $primary-low;
border: 1px solid var(--primary-low);
.d-icon {
margin-right: 1em;
@ -127,17 +127,17 @@
.date-time-control {
position: relative;
display: flex;
border: 1px solid $primary-low;
border: 1px solid var(--primary-low);
&.is-filled,
&.is-selected {
.date-time {
color: $primary;
background: $secondary;
color: var(--primary);
background: var(--secondary);
}
.d-icon {
color: $primary-high;
color: var(--primary-high);
}
}
@ -149,7 +149,7 @@
}
&.is-selected {
border-color: $tertiary;
border-color: var(--tertiary);
}
}
@ -163,13 +163,13 @@
}
&.is-selected {
border-color: $tertiary;
border-color: var(--tertiary);
}
}
.date-time {
color: $primary-medium;
background: $primary-very-low;
color: var(--primary-medium);
background: var(--primary-very-low);
}
.d-icon {
@ -179,7 +179,7 @@
left: 0.5em;
top: 0;
bottom: 0;
color: $primary-medium;
color: var(--primary-medium);
}
.delete-to-date {
@ -190,7 +190,7 @@
width: 30px;
top: 0;
bottom: 0;
color: $primary-high;
color: var(--primary-high);
border-radius: 0 0 5px 0;
}
@ -211,7 +211,7 @@
.picker-panel {
z-index: 1;
background: $secondary;
background: var(--secondary);
width: 200px;
box-sizing: border-box;
margin-left: 1em;
@ -224,11 +224,11 @@
margin-top: 1em;
align-items: center;
padding: 0.25em;
border-top: 1px solid $primary-low-mid;
border-top: 1px solid var(--primary-low-mid);
box-sizing: border-box;
.d-icon {
color: $primary-medium;
color: var(--primary-medium);
}
.time-picker {
@ -284,7 +284,7 @@
margin: 0;
.format {
.previewed-format {
color: $primary-medium;
color: var(--primary-medium);
}
}
}

16
plugins/poll/assets/stylesheets/common/poll.scss
View File

@ -1,6 +1,6 @@
div.poll {
margin: 1em 0;
border: 1px solid $primary-low;
border: 1px solid var(--primary-low);
@include unselectable;
@ -19,7 +19,7 @@ div.poll {
}
li[data-poll-option-id] {
color: $primary;
color: var(--primary);
padding: 0.5em 0;
word-break: break-word;
}
@ -31,7 +31,7 @@ div.poll {
}
.poll-info {
color: $primary-medium;
color: var(--primary-medium);
vertical-align: middle;
padding: 1em 0;
@ -58,7 +58,7 @@ div.poll {
.poll-buttons {
.info-text {
margin: 0.25em 0;
color: $primary-medium;
color: var(--primary-medium);
}
.info-text + .info-text,
button + .info-text {
@ -100,21 +100,21 @@ div.poll {
.percentage {
float: right;
color: $primary-medium;
color: var(--primary-medium);
margin-left: 0.25em;
}
.bar-back {
background: $primary-low;
background: var(--primary-low);
}
.bar {
height: 0.75em;
background: $primary-medium;
background: var(--primary-medium);
}
.chosen .bar {
background: $tertiary;
background: var(--tertiary);
}
}

6
plugins/poll/assets/stylesheets/desktop/poll.scss
View File

@ -25,11 +25,11 @@ div.poll {
.poll-container {
display: table-cell;
width: 100%;
border-right: 1px solid $primary-low;
border-right: 1px solid var(--primary-low);
}
.poll-buttons {
border-top: 1px solid $primary-low;
border-top: 1px solid var(--primary-low);
padding: 1em;
.info-text {
@ -71,7 +71,7 @@ div.poll.pie {
li[data-poll-option-id]:before {
position: relative;
vertical-align: baseline;
border: 2px solid $primary;
border: 2px solid var(--primary);
border-radius: 50%;
display: inline-block;
margin-right: 0.5em;

2
plugins/poll/assets/stylesheets/mobile/poll.scss
View File

@ -33,7 +33,7 @@ div.poll {
div.poll.pie {
.poll-container {
width: calc(100% - 30px);
border-bottom: 1px solid $primary-low;
border-bottom: 1px solid var(--primary-low);
.poll-grouped-pie-container {
width: 100%;