mirror of
https://github.com/discourse/discourse.git
synced 2024-11-25 18:03:43 +08:00
DEV: Use CSS custom properties for colors in core plugins
This commit is contained in:
parent
b76731d722
commit
14eec43889
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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%;
|
||||
|
|
Loading…
Reference in New Issue
Block a user