Skip to content

[mod] Dark Comfort for Stylus by void

Details

Authorvoid

LicenseNo License

Category.

Created

Updated

Size8.8 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

.

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name           Dark Comfort for Stylus
@namespace      USO Archive
@author         R3gi CZ
@description    `Dark UI theme for Stylus browser extension (Stylish alternative)`
@version        20200331.16.6
@license        CC-BY-NC-SA-4.0
@preprocessor   uso
==/UserStyle== */
@-moz-document regexp("chrome-extension://.*"), regexp("moz-extension://.*") {
/* Dark Comfort for Stylus by R3gi, Czech Republic
Version: 2020.03.21.15.05 */

/* ICONS INVERSION */
.svg-icon,
.svg-icon.info:hover {
    filter: brightness(0) invert(1);
}

.select-resizer > .svg-icon.select-arrow,
.sorter-selection > .svg-icon.select-arrow {
    filter: none;
    fill: #424242;
}


/* REGULAR TEXT COLOR */
body,
a,
#notes,
#advanced.collapsible.collapsed h1,
#advanced.collapsible h1,
#footer a,
.search-result-title,
.applies-to label,
#backup-buttons .dropdown-content a,
.CodeMirror-search-hint,
#hotkey-info mark{
    color: #E0E0E0;
}

/* LIGHT TEXT COLOR */
a:hover,
a:focus,
.style-name-link:hover,
#message-box-title,
.newUI .updater-icons > :not(.check-update):after,
#help-popup .title,
h1,
#confirm > div > b,
/*select[id^="manage."]:hover, select[id^="manage."]:focus, select[id^="manage."]:active,*/
select option,
#advanced.collapsible.collapsed:hover h1,
#advanced.collapsible:not(.collapsed) h1:hover,
#footer a:hover,
.newUI .entry.enabled .style-name:hover .style-name-link,
.disabled a:hover,
.search-result:hover .search-result-title,
#search-replace-dialog [data-action="case"],
#backup-buttons .dropdown-content a:hover {
    color: #FAFAFA;
    text-decoration: none;
}

/* GREY TEXT COLOR (disabled items) */
button:disabled,
select:disabled,
option:disabled,
select[disabled] > option {
    color: #BDBDBD;
}

/* GREEN TEXT COLOR */
.regexp-report details[data-type="full"],
.search-result-meta [data-type="rating"][data-class="good"] dd,
.search-result-meta [data-type="rating"][data-class="okay"] dd,
.colorpicker-title-action[data-active] {
    color: #4CAF50;
}

/* RED TEXT COLOR */
#disableAll-label:hover {
    color: #F44336;
}

/* BORDER COLOR */
.CodeMirror,
#extension-options-overlay-header,
.applies-to,
#installed,
.config-body label:not(:first-child),
.color-swatch,
.applies-value-wrapper,
#hotkey-info[data-active],
#hotkey-info div,
#hotkey-info mark,
#options-title {
    border-color: #37474F;
}

/**/
.entry,
.block,
.search-result,
body {
    border-color: #546E7A;
}

/* LIGHTER BORDER COLOR */
.newUI .updater-icons > :not(.check-update):after,
#sections > div:not(:first-of-type),
.search-result:hover {
    border-color: #78909C;
}

/* NO BORDER RADIUS */
.newUI .updater-icons > :not(.check-update):after,
#search,
.disabled h2::after,
.search-result,
#hotkey-info mark {
    border-radius: 0;
}

/* DARK BACKGROUND COLOR */
#stylus,
body,
#filters label:hover,
#filters .filter-selection:hover,
.applies-to {
    background-color: #37474F;
}

/* FRONT BACKGROUND COLOR */
#help-popup .title,
#message-box-title,
#message-box-buttons,
.newUI .updater-icons > :not(.check-update):after,
#confirm > div,
select option,
.search-result:hover,
#backup-buttons .dropdown-content,
#hotkey-info div,
.menu-items-wrapper,
#options-title {
    background-color: #607D8B;
}

/* FRONT BACKGROUND COLOR 2 */
#backup-buttons .dropdown-content a:hover {
    background-color: #546E7A;
}

/* TRANSPARENT FRONT BACKROUND COLOR */
.search-result:hover .search-result-meta {
    background-color: hsla(200, 18%, 46%, .7);
}

#header,
#help-popup,
#message-box-contents,
#notes,
.search-result,
#options {
    background-color: #455A64;
}

#hotkey-info mark {
    background: #455A64;
}

.colorpicker-theme-dark {
    --main-background-color: #455A64;
    --main-border-color: #455A64;
    --label-color: #E0E0E0;
    --label-color-hover: #FAFAFA;
    --input-background-color: #E0E0E0;
    --input-background-color-hover: #FAFAFA;
    --input-background-color-focus: #FAFAFA;
    --input-color: #424242;
    --input-color-focus: #000;
    --input-border-color: #37474F;
    --input-border-color-focus: #37474F;
    --input-border-color-hover: #37474F;
}

/* GREEN BACKGROUND AND BORDER COLOR */
.newUI .can-update:not([data-details$="locally edited"]) .update:after {
    background-color: #2E7D32;
    border: 1px solid #388E3C;
}

/* TRANSPARENT BACKGROUND */
.search-result-meta {
    background-color: rgba(69, 90, 100, .7);
}

#header {
    border-right: 1px solid #546E7A;
}

@media (max-width: 737px) {
    #header {
        border-bottom: 1px solid #546E7A;
        border-right: none;
    }
}

/* NO BOX SHADOW */
#actions button,
.search-result,
#hotkey-info mark {
    box-shadow: none;
}

/* BUTTON DEFAULT */
button,
#find-styles-link,
#actions button,
#search-results .search-result-actions button,
.beautify-options select {
    background: #546E7A;
    color: #FAFAFA;
    border-color: #607D8B;
    border-width: 1px;
    border-radius: 0;
    padding: 3px 8px;
    text-shadow: 0 0 0 #000000;
}

/* BUTTON HOVER and FOCUS */
button:not(:disabled):hover,
button:focus,
#message-box-buttons button:not(:disabled):hover,
#find-styles-link:hover,
#find-styles-link:focus,
#actions button:hover,
#actions button:focus,
input[type="checkbox"]:not(.slider):not(:disabled):hover,
.style-name:hover input[type="checkbox"]:checked,
#search-results .search-result-actions button:hover,
#search-results .search-result-actions button:focus,
.beautify-options select:hover,
.beautify-options select:focus,
#backup-buttons .dropdown:hover .dropbtn {
    background: #78909C;
    color: #FFFFFF;
    text-shadow: 0.5px 0.5px 0 #607D8B;
    border-color: #90A4AE;
    outline: none;
}

/* BUTTON ACTIVE */
button:active,
#find-styles-link:active,
#actions button:active,
#search-results .search-result-actions button:active,
.beautify-options select:active {
    background: #546E7A;
    color: #FFFFFF;
    border-color: #607D8B;
}

/* CHECKBOX */
input[type="checkbox"]:not(.slider) {
    border-color: #607D8B;
}

/* FORMS */
input:not([type]),
select,
textarea,
#search,
#search,
#manage\.newUI\.sort {
    background-color: #E0E0E0;
    color: #424242;
}

#search-replace-dialog textarea,
#search-replace-dialog textarea::placeholder {
    color: #424242 !important;
}

input,
select,
textarea,
input:not([type]),
#search,
#search,
#manage\.newUI\.sort {
    outline: none;
    border: 1px solid #37474F;
}

input:not([type]):hover,
select:hover,
textarea:hover,
input:not([type]):focus,
select:focus,
textarea:focus,
#search:hover,
#search:focus {
    background-color: #FAFAFA;
    color: #000000;
    transition-duration: 0.3s;
}

/* BUTTONS AND FORMS STYLE */
button,
input:not([type]),
select,
.applies-to li > *:not(button):not(.select-resizer),
#find-styles-link,
.filter-selection select,
#search {
    display: inline-block;
    padding: 0 .5rem;
    min-height: 1.6rem !important;
    line-height: 1.6rem !important;
    box-sizing: border-box;
    border-style: solid;
    border-radius: 0;
    border-width: 1px;
}

.aligned > select:not(svg) {
    padding: 0 .5rem;
    min-height: 1.6rem;
    line-height: 1.6rem;
    box-sizing: border-box;
}

#header .filter-selection label,
#newUIoptions input[type="number"],
#options [type="number"] {
    min-height: 1.6rem;
    line-height: 1.6rem;
}

button {
    margin: .1em 0;
}

.applies-to-list button {
    margin-left: .3em;
}

/* MISC FIXES */
fieldset {
    border: none;
    border-radius: 0;
}
.select-resizer select {
    padding-right: 15px;
}
.filter-selection .select-resizer {
    left: 25px;
}

a {
    text-decoration: none;
}

#options [type="number"] {
    height: 1.6rem;
}

:focus {
    outline: none;
}

.CodeMirror-focused {
    outline-color: #FFC107;
    outline-style: solid;
    outline-offset: 0;
    outline-width: 1px;
}

#search-replace-dialog [data-type="hover"] svg {
    filter: none;
}

/* SCROLLBAR Chromium */
*::-webkit-scrollbar {
    background: #1E272B !important;
}
*::-webkit-scrollbar-button {
    display: none !important;
}
*::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-track {
    border: 0 !important;
    box-shadow: none !important;
}
*::-webkit-scrollbar-thumb {
    background: #455A64 !important;
}
*::-webkit-scrollbar-thumb:hover {
    background: #607D8B !important;
}
*::-webkit-scrollbar-corner,
*::-webkit-scrollbar-track {
    background: #1E272B !important;
}



	/* ANNOYING "error" background */
	.cm-s-oceanic-next span.cm-error {
		background: inherit;
		font-style: italic;
	}
	/* Clearer comments */
x	.CodeMirror pre.CodeMirror-line  span.cm-comment,
x	.cm-s-oceanic-next.CodeMirror .CodeMirror-activeline pre.CodeMirror-line  span.cm-comment,
	.cm-s-oceanic-next.CodeMirror .CodeMirror-line  span.cm-comment {
		color: #788;
	}
	.cm-s-oceanic-next.CodeMirror .CodeMirror-activeline  span.cm-comment {
		color: #899;
	}

}

Reviews

No reviews yet.