Use photon-like styling for dark widgets

This commit is contained in:
hensm
2020-02-17 10:07:36 +00:00
parent eebafa656f
commit 652fd21f77

View File

@@ -1,20 +1,20 @@
button, button,
.select-wrapper, input,
input { textarea,
background-color: var(--grey-60); .select-wrapper {
border: 1px solid rgba(255, 255, 255, 0.25); background-color: #474749;
border-radius: 3px; border: initial;
border-radius: 2px;
overflow: hidden;
color: white; color: white;
} }
button:not(:disabled):hover, button:not(:disabled):hover,
.select-wrapper:not(:disabled):hover, .select-wrapper:not(:disabled):hover {
input[type="checkbox"]:not(:disabled):hover { background-color: #505054;
background-color: var(--grey-50);
} }
button:not(:disabled):hover:active, button:not(:disabled):hover:active,
.select-wrapper:not(:disabled):hover:active, .select-wrapper:not(:disabled):hover:active {
input[type="checkbox"]:not(:disabled):hover:active { background-color: #5c5c5e;
background-color: rgb(94, 94, 99);
} }
button:disabled, button:disabled,
@@ -22,36 +22,20 @@ input:disabled {
opacity: 0.35; opacity: 0.35;
} }
input[type="text"], input,
input[type="number"] { textarea {
padding: 2px; padding: 2px 4px;
}
input[type="checkbox"] {
-moz-appearance: none;
}
input[type="checkbox"]:checked {
background-color: var(--blue-60);
padding: 2px;
background-clip: content-box;
}
input[type="checkbox"]:not(:disabled):checked:hover {
background-color: var(--blue-50);
}
input[type="checkbox"]:not(:disabled):checked:hover:active {
background-color: var(--blue-70);
} }
button:default { button:default {
background-color: var(--blue-60); background-color: var(--blue-60);
color: white !important; color: white !important;
} }
button:default:hover { button:default:hover {
background-color: var(--blue-50); background-color: var(--blue-70);
} }
button:default:hover:active { button:default:hover:active {
background-color: var(--blue-70); background-color: var(--blue-80);
} }
.select-wrapper { .select-wrapper {
@@ -83,4 +67,4 @@ option {
} }
option:disabled { option:disabled {
color: rgba(255, 255, 255, 0.25) !important; color: rgba(255, 255, 255, 0.25) !important;
} }