1
0
Fork 0

DEV: Switch to CSS custom properties for colors (#127)

Dieser Commit ist enthalten in:
Penar Musaraj 2021-06-29 03:49:28 -04:00 committet von GitHub
Ursprung 262f2d5628
Commit 0bd4dbd08b
Es konnte kein GPG-Schlüssel zu dieser Signatur gefunden werden
GPG-Schlüssel-ID: 4AEE18F83AFDEB23
6 geänderte Dateien mit 40 neuen und 40 gelöschten Zeilen

Datei anzeigen

@ -15,7 +15,7 @@
} }
.wizard-message { .wizard-message {
background-color: $primary-low; background-color: var(--primary-low);
width: 100%; width: 100%;
padding: 10px; padding: 10px;
box-sizing: border-box; box-sizing: border-box;
@ -37,7 +37,7 @@
} }
a + a { a + a {
border-left: 1px solid $primary-medium; border-left: 1px solid var(--primary-medium);
padding-left: 5px; padding-left: 5px;
margin-left: 5px; margin-left: 5px;
} }
@ -89,7 +89,7 @@
.wizard-settings-parent { .wizard-settings-parent {
padding: 20px; padding: 20px;
border: 1px solid $primary-low; border: 1px solid var(--primary-low);
} }
.wizard-settings-group { .wizard-settings-group {
@ -115,7 +115,7 @@
.wizard-custom-field { .wizard-custom-field {
background: transparent; background: transparent;
background-color: dark-light-diff($primary, $secondary, 96%, -65%); background-color: var(--primary-very-low);
padding: 20px; padding: 20px;
} }
@ -182,7 +182,7 @@
a { a {
padding: 6px 12px; padding: 6px 12px;
font-size: 1rem; font-size: 1rem;
background-color: $primary-low; background-color: var(--primary-low);
} }
button { button {
@ -263,7 +263,7 @@
} }
input[disabled] { input[disabled] {
background-color: $primary-low; background-color: var(--primary-low);
cursor: not-allowed; cursor: not-allowed;
} }
@ -434,8 +434,8 @@
display: none; display: none;
margin: 0 0 10px 0; margin: 0 0 10px 0;
padding: 10px; padding: 10px;
background-color: $secondary; background-color: var(--secondary);
border: 1px solid $primary-medium; border: 1px solid var(--primary-medium);
max-width: 100%; max-width: 100%;
&.force-preview { &.force-preview {
@ -454,17 +454,17 @@
.btn { .btn {
margin-right: 10px; margin-right: 10px;
color: $primary; color: var(--primary);
&:hover { &:hover {
color: $secondary; color: var(--secondary);
} }
} }
.wizard-editor-gutter-popover { .wizard-editor-gutter-popover {
position: absolute; position: absolute;
padding: 10px; padding: 10px;
background-color: $secondary; background-color: var(--secondary);
box-shadow: shadow("card"); box-shadow: shadow("card");
z-index: 200; z-index: 200;
top: 40px; top: 40px;
@ -502,7 +502,7 @@
width: 100px; width: 100px;
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
background-color: $primary-low; background-color: var(--primary-low);
margin-right: 10px; margin-right: 10px;
margin-left: 3px; margin-left: 3px;
} }
@ -587,8 +587,8 @@
.add-mapper-input .btn, .add-mapper-input .btn,
.btn-after-time, .btn-after-time,
.wizard-editor-gutter .btn { .wizard-editor-gutter .btn {
background-color: $secondary; background-color: var(--secondary);
border: 1px solid $primary-medium; border: 1px solid var(--primary-medium);
} }
.admin-wizards-custom-fields { .admin-wizards-custom-fields {

Datei anzeigen

@ -48,7 +48,7 @@
.wizard-api-authentication { .wizard-api-authentication {
display: flex; display: flex;
background-color: $primary-very-low; background-color: var(--primary-very-low);
padding: 20px; padding: 20px;
margin-bottom: 20px; margin-bottom: 20px;
@ -68,7 +68,7 @@
} }
.status { .status {
border-left: 1px solid $primary; border-left: 1px solid var(--primary);
margin-left: 20px; margin-left: 20px;
padding-left: 20px; padding-left: 20px;
width: 50%; width: 50%;
@ -89,7 +89,7 @@
} }
.wizard-api-endpoints { .wizard-api-endpoints {
background-color: $primary-very-low; background-color: var(--primary-very-low);
padding: 20px; padding: 20px;
margin-bottom: 20px; margin-bottom: 20px;

Datei anzeigen

@ -16,13 +16,13 @@
#import-button:enabled, #import-button:enabled,
#export-button:enabled { #export-button:enabled {
background-color: $tertiary; background-color: var(--tertiary);
color: $secondary; color: var(--secondary);
} }
#destroy-button:enabled { #destroy-button:enabled {
background-color: $danger; background-color: var(--danger);
color: $secondary; color: var(--secondary);
} }
} }
@ -32,13 +32,13 @@
.filename { .filename {
padding: 0 10px; padding: 0 10px;
border: 1px solid $primary; border: 1px solid var(--primary);
display: inline-flex; display: inline-flex;
height: 28px; height: 28px;
line-height: 28px; line-height: 28px;
a { a {
color: $primary; color: var(--primary);
margin-right: 5px; margin-right: 5px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;

Datei anzeigen

@ -22,7 +22,7 @@
width: min-content; width: min-content;
margin-bottom: 10px; margin-bottom: 10px;
height: 20px; height: 20px;
border: 2px solid $primary-low; border: 2px solid var(--primary-low);
} }
} }
@ -33,8 +33,8 @@
position: relative; position: relative;
padding: 25px 7px 7px 7px; padding: 25px 7px 7px 7px;
margin-bottom: 10px; margin-bottom: 10px;
background: rgba($secondary, 0.5); background: rgba(var(--secondary-rgb), 0.5);
border: 2px solid $primary-low; border: 2px solid var(--primary-low);
.d-icon { .d-icon {
text-align: center; text-align: center;
@ -45,7 +45,7 @@
} }
input[disabled] { input[disabled] {
background-color: $primary-low; background-color: var(--primary-low);
border-color: #ddd; border-color: #ddd;
} }
@ -62,10 +62,10 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
transform: translateY(-50%); transform: translateY(-50%);
background: $secondary; background: var(--secondary);
border-radius: 50%; border-radius: 50%;
font-size: 0.8em; font-size: 0.8em;
border: 2px solid $primary-low; border: 2px solid var(--primary-low);
} }
&.association, &.association,
@ -89,8 +89,8 @@
&.single { &.single {
height: 28px; height: 28px;
background: $secondary; background: var(--secondary);
border: 1px solid $primary-medium; border: 1px solid var(--primary-medium);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -126,7 +126,7 @@
} }
.type-selector a { .type-selector a {
color: $primary; color: var(--primary);
margin-right: 4px; margin-right: 4px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -150,11 +150,11 @@
box-shadow: shadow("dropdown"); box-shadow: shadow("dropdown");
position: absolute; position: absolute;
display: flex; display: flex;
background: $secondary; background: var(--secondary);
z-index: 200; z-index: 200;
padding: 5px 7px; padding: 5px 7px;
flex-direction: column; flex-direction: column;
border: 1px solid $primary-low; border: 1px solid var(--primary-low);
} }
.value-list .remove-value-btn { .value-list .remove-value-btn {
@ -162,7 +162,7 @@
border: none; border: none;
.d-icon { .d-icon {
color: $primary; color: var(--primary);
} }
} }

Datei anzeigen

@ -31,7 +31,7 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
.extra-info-wrapper & { .extra-info-wrapper & {
color: $header-primary; color: var(--header_primary);
} }
} }
@ -108,7 +108,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
.extra-info-wrapper & { .extra-info-wrapper & {
color: $header-primary; color: var(--header_primary);
} }
} }

Datei anzeigen

@ -199,11 +199,11 @@
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: rgba($primary, 0.8); background-color: rgba(var(--primary-rgb), 0.8);
} }
.wizard-composer-hyperlink-contents { .wizard-composer-hyperlink-contents {
background-color: $secondary; background-color: var(--secondary);
padding: 20px; padding: 20px;
h3 { h3 {
@ -227,7 +227,7 @@
bottom: 1px; bottom: 1px;
right: 1px; right: 1px;
padding: 10px; padding: 10px;
background-color: $secondary; background-color: var(--secondary);
} }
.bottom-bar { .bottom-bar {