/* General structure and fonts */
-body {
+body, #settings-menu #settings, #settings-menu #settings::before {
background-color: #0f1419;
color: #c5c5c5;
}
+.setting-line .radio-line input {
+ border-color: #c5c5c5;
+}
+.setting-line .radio-line input:checked {
+ box-shadow: inset 0 0 0 3px #0f1419;
+ background-color: #ffb454;
+}
+.setting-line .radio-line input:focus {
+ box-shadow: 0 0 1px 1px #ffb454;
+}
+/* In here we combine both `:focus` and `:checked` properties. */
+.setting-line .radio-line input:checked:focus {
+ box-shadow: inset 0 0 0 3px 0f1419,
+ 0 0 2px 2px #ffb454;
+}
+.setting-line .radio-line input:hover {
+ border-color: #ffb454 !important;
+}
+
+.slider {
+ background-color: #ccc;
+}
+.slider:before {
+ background-color: white;
+}
+input:checked + .slider {
+ background-color: #ffb454;
+}
+input:focus + .slider {
+ box-shadow: 0 0 0 2px #0a84ff, 0 0 0 6px rgba(10, 132, 255, 0.3);
+}
+
h1, h2, h3, h4 {
color: white;
}
#crate-search, .search-input {
background-color: #141920;
- border-color: #424c57;
- color: #c5c5c5;
+ /* Without the `!important`, the border-color is ignored for `<select>`... */
+ border-color: #424c57 !important;
}
.search-input {
color: #000;
}
+/* Created this empty rule to satisfy the theme checks. */
+.stab.empty-impl {}
+
.stab.unstable,
.stab.deprecated,
-.stab.portability {
+.stab.portability,
+.stab.empty-impl {
color: #c5c5c5;
background: #314559 !important;
border-style: none !important;
box-shadow: inset 0 -1px 0 #5c6773;
}
-#theme-picker, #settings-menu, #help-button {
+#settings-menu > a, #help-button {
border-color: #5c6773;
background-color: #0f1419;
color: #fff;
}
-#theme-picker > img, #settings-menu > img {
+#settings-menu > a img {
filter: invert(100);
}
+#settings-menu #settings, #settings-menu #settings::before {
+ border-color: #5c6773;
+}
+
#copy-path {
color: #fff;
}
filter: invert(100%);
}
-#theme-picker:hover, #theme-picker:focus,
-#settings-menu:hover, #settings-menu:focus,
+#settings-menu > a:hover, #settings-menu > a:focus,
#help-button:hover, #help-button:focus {
border-color: #e0e0e0;
}
background-color: rgba(110, 110, 110, 0.33);
}
-@media (max-width: 700px) {
- #theme-picker {
- background: #0f1419;
- }
-}
-
.search-results .result-name span.alias {
color: #c5c5c5;
}
background-color: #14191f;
color: #ffb44c;
}
-.setting-line > .title {
- border-bottom-color: #5c6773;
-}
-input:checked + .slider {
- background-color: #ffb454 !important;
-}
-
.scraped-example-list .scrape-help {
border-color: #aaa;