From 9d317538b71f2f8c89398520369f7419ee504915 Mon Sep 17 00:00:00 2001 From: itismadness Date: Mon, 8 Sep 2025 00:30:40 +0000 Subject: [PATCH] Update stylelint configuration and lint scss --- misc/stylelint.json | 17 +- package-lock.json | 147 +++++++++++++++ package.json | 4 +- sass/80char/style.scss | 68 ++++--- sass/apollostage/_base.scss | 16 +- sass/apollostage/_variables.scss | 21 +-- sass/apollostage_coffee/style.scss | 7 +- sass/apollostage_sunset/style.scss | 5 +- sass/dark_ambient/style.scss | 48 ++--- sass/dark_cake/style.scss | 4 +- sass/global.scss | 4 +- sass/kuro/style.scss | 3 +- sass/layer_cake/style.scss | 4 +- sass/linohaze/style.scss | 283 ++++++++++++++--------------- sass/minimal_mod_alt.scss | 26 +-- sass/orpheus_paper/style.scss | 18 +- sass/post_office/style.scss | 128 ++++++------- sass/postmod/style.scss | 28 +-- sass/proton/style.scss | 12 +- sass/reportauto/style.scss | 6 +- sass/tooltipster/style.scss | 2 +- sass/xanax_cake/style.scss | 5 +- 22 files changed, 497 insertions(+), 359 deletions(-) diff --git a/misc/stylelint.json b/misc/stylelint.json index 312957ff4..188987a96 100644 --- a/misc/stylelint.json +++ b/misc/stylelint.json @@ -1,25 +1,26 @@ { - "extends": "stylelint-config-standard", - "plugins": [ - "stylelint-scss" - ], + "extends": "stylelint-config-standard-scss", "rules": { "at-rule-no-unknown": null, - "color-hex-case": null, "color-hex-length": null, "comment-empty-line-before": null, "declaration-block-no-duplicate-properties": [true, { "ignore": ["consecutive-duplicates-with-different-values"] }], - "function-parentheses-newline-inside": null, - "function-whitespace-after": null, + "function-url-quotes": null, "no-descending-specificity": null, "no-duplicate-selectors": null, "no-unknown-animations": true, "property-no-unknown": null, + "property-no-vendor-prefix": null, "rule-empty-line-before": null, + "selector-class-pattern": "[a-z-_]+", + "selector-id-pattern": "[a-z-_]+", "shorthand-property-no-redundant-values": null, "unit-allowed-list": ["ch", "deg", "em", "ex", "ms", "rem", "%", "s", "px", "vw", "vh", "rad", "dppx", "dpi", "dpcm", "in", "pt", "fr"], - "scss/at-rule-no-unknown": true + "scss/at-rule-no-unknown": true, + "scss/comment-no-empty": null, + "scss/dollar-variable-pattern": "[a-z-_]+", + "scss/load-no-partial-leading-underscore": null } } diff --git a/package-lock.json b/package-lock.json index 96fa24e58..e99147e08 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,6 +25,7 @@ "stylelint-checkstyle-formatter": "^0.1.2", "stylelint-config-recommended": "^14.0.1", "stylelint-config-standard": "^36.0.1", + "stylelint-config-standard-scss": "^15.0.1", "stylelint-scss": "^6.11.1", "update-browserslist-db": "1.1" } @@ -4509,6 +4510,33 @@ "postcss": "^8.4.31" } }, + "node_modules/postcss-scss": { + "version": "4.0.9", + "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz", + "integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss-scss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "engines": { + "node": ">=12.0" + }, + "peerDependencies": { + "postcss": "^8.4.29" + } + }, "node_modules/postcss-selector-parser": { "version": "7.1.0", "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz", @@ -5324,6 +5352,53 @@ "stylelint": "^16.1.0" } }, + "node_modules/stylelint-config-recommended-scss": { + "version": "15.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-15.0.1.tgz", + "integrity": "sha512-V24bxkNkFGggqPVJlP9iXaBabwSGEG7QTz+PyxrRtjPkcF+/NsWtB3tKYvFYEmczRkWiIEfuFMhGpJFj9Fxe6Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "postcss-scss": "^4.0.9", + "stylelint-config-recommended": "^16.0.0", + "stylelint-scss": "^6.12.0" + }, + "engines": { + "node": ">=20" + }, + "peerDependencies": { + "postcss": "^8.3.3", + "stylelint": "^16.16.0" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } + } + }, + "node_modules/stylelint-config-recommended-scss/node_modules/stylelint-config-recommended": { + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-16.0.0.tgz", + "integrity": "sha512-4RSmPjQegF34wNcK1e1O3Uz91HN8P1aFdFzio90wNK9mjgAI19u5vsU868cVZboKzCaa5XbpvtTzAAGQAxpcXA==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "engines": { + "node": ">=18.12.0" + }, + "peerDependencies": { + "stylelint": "^16.16.0" + } + }, "node_modules/stylelint-config-standard": { "version": "36.0.1", "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-36.0.1.tgz", @@ -5350,6 +5425,78 @@ "stylelint": "^16.1.0" } }, + "node_modules/stylelint-config-standard-scss": { + "version": "15.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-15.0.1.tgz", + "integrity": "sha512-8pmmfutrMlPHukLp+Th9asmk21tBXMVGxskZCzkRVWt1d8Z0SrXjUUQ3vn9KcBj1bJRd5msk6yfEFM0UYHBRdg==", + "dev": true, + "license": "MIT", + "dependencies": { + "stylelint-config-recommended-scss": "^15.0.1", + "stylelint-config-standard": "^38.0.0" + }, + "engines": { + "node": ">=20" + }, + "peerDependencies": { + "postcss": "^8.3.3", + "stylelint": "^16.18.0" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } + } + }, + "node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-recommended": { + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-16.0.0.tgz", + "integrity": "sha512-4RSmPjQegF34wNcK1e1O3Uz91HN8P1aFdFzio90wNK9mjgAI19u5vsU868cVZboKzCaa5XbpvtTzAAGQAxpcXA==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "engines": { + "node": ">=18.12.0" + }, + "peerDependencies": { + "stylelint": "^16.16.0" + } + }, + "node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-standard": { + "version": "38.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-38.0.0.tgz", + "integrity": "sha512-uj3JIX+dpFseqd/DJx8Gy3PcRAJhlEZ2IrlFOc4LUxBX/PNMEQ198x7LCOE2Q5oT9Vw8nyc4CIL78xSqPr6iag==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "dependencies": { + "stylelint-config-recommended": "^16.0.0" + }, + "engines": { + "node": ">=18.12.0" + }, + "peerDependencies": { + "stylelint": "^16.18.0" + } + }, "node_modules/stylelint-scss": { "version": "6.12.1", "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.12.1.tgz", diff --git a/package.json b/package.json index 82ef425a7..50a1944c8 100644 --- a/package.json +++ b/package.json @@ -20,9 +20,7 @@ "globals": "^15.12", "stylelint": "^16.18", "stylelint-checkstyle-formatter": "^0.1.2", - "stylelint-config-recommended": "^14.0.1", - "stylelint-config-standard": "^36.0.1", - "stylelint-scss": "^6.11.1", + "stylelint-config-standard-scss": "^15.0.1", "update-browserslist-db": "1.1" }, "dependencies": { diff --git a/sass/80char/style.scss b/sass/80char/style.scss index e1e007496..24223b325 100644 --- a/sass/80char/style.scss +++ b/sass/80char/style.scss @@ -481,10 +481,7 @@ ul.thin li { width: 114px; position: absolute; background: #eaeaea; - padding-left: 40px; - padding-right: 33px; - padding-top: 18px; - padding-bottom: 65px; + padding: 18px 33px 65px 40px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; @@ -596,7 +593,7 @@ ul.thin li { border-width: 1px; } -input[type=search] { +input[type="search"] { -webkit-appearance: none; border-style: solid; border-width: 1px; @@ -868,10 +865,7 @@ th { .colhead, .colhead_dark, .head { - padding-left: 4px; - padding-right: 4px; - padding-top: 4px; - padding-bottom: 20px; + padding: 4px 4px 20px 4px; font-size: 14px; } @@ -1287,8 +1281,8 @@ ul .invitetree { z-index: -1; } -input[type=button], -input[type=submit] { +input[type="button"], +input[type="submit"] { background: #FFFFFF; display: inline-block; padding: 3px 6px 4px; @@ -1305,7 +1299,7 @@ input[type=submit] { border-radius: 4px; } -input[type=text], +input[type="text"], input[type="password"] { background: #FFFFFF; display: inline-block; @@ -1317,46 +1311,46 @@ input[type="password"] { border-width: 1px; } -#quickpost input[type=text], -.box_search input[type=text], -#AddArtists input[type=text], -.add_torrent_container input[type=text], -.add_torrent_container input[type=text], -.box_addtag input[type=text], -.pad .search_form input[type=text], -.edit_form input[type=text], -.rename_form input[type=text], -.merge_form input[type=text], -#compose input[type=text], -.add_form input[type=text] { +#quickpost input[type="text"], +.box_search input[type="text"], +#AddArtists input[type="text"], +.add_torrent_container input[type="text"], +.add_torrent_container input[type="text"], +.box_addtag input[type="text"], +.pad .search_form input[type="text"], +.edit_form input[type="text"], +.rename_form input[type="text"], +.merge_form input[type="text"], +#compose input[type="text"], +.add_form input[type="text"] { background: #fff; border: 1px solid #bbbbbb; color: #000000; } -input[type=text]:active, +input[type="text"]:active, input[type="search"]:active, input[type="password"]:active { top: 1px; } -input[disabled=disabled] { +input[disabled="disabled"] { background: #eaeaea; } -input[disabled=disabled]:hover, -input[disabled=disabled]:focus, -input[disabled=disabled]:active { +input[disabled="disabled"]:hover, +input[disabled="disabled"]:focus, +input[disabled="disabled"]:active { background-color: #eaeaea; } -select[disabled=disabled] { +select[disabled="disabled"] { background: #eaeaea; } -select[disabled=disabled]:hover, -select[disabled=disabled]:focus, -select[disabled=disabled]:active { +select[disabled="disabled"]:hover, +select[disabled="disabled"]:focus, +select[disabled="disabled"]:active { background-color: #eaeaea; } @@ -1445,12 +1439,12 @@ tr.torrent .bookmark > a::after { color: #355D6C; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #ECECEC; color: #444; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #0A84AF; } @@ -1477,8 +1471,8 @@ div[class~=tooltipster-content] > a { color: red; } -#collage #search_terms input[type=search], -#torrents .layout input[type=search] { +#collage #search_terms input[type="search"], +#torrents .layout input[type="search"] { background: #FFFFFF; display: inline-block; padding: 3px; diff --git a/sass/apollostage/_base.scss b/sass/apollostage/_base.scss index b0da4bc66..7e812c4eb 100644 --- a/sass/apollostage/_base.scss +++ b/sass/apollostage/_base.scss @@ -212,7 +212,6 @@ /* ## 0.1 Housekeeping */ @charset "UTF-8"; - @namespace url("http://www.w3.org/1999/xhtml"); @namespace svg url("http://www.w3.org/2000/svg"); @@ -1558,6 +1557,7 @@ blockquote { /* wrap overflow word-wrap handling */ .wrap_overflow { + /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */ word-break: break-word !important; } @@ -2163,7 +2163,7 @@ body#collage .cats_music { ) !important; color: variables.$color-text-notification-words !important; font-weight: 700; - padding: 0.6rem !important; //overriding site html + padding: 0.6rem !important; // overriding site html } /* first row words */ @@ -2641,13 +2641,13 @@ ul#check::after { .autocomplete-suggestions { margin-top: 5px; background: variables.$color-background-autocompletes !important; - color: #888; //does nothing + color: #888; // does nothing width: auto !important; text-align: left; cursor: default; - border: 1px solid variables.$midtone-300; //midtone-300 - border-top: 1px dashed variables.$midtone-300; //midtone-300 - box-shadow: 3px 3px 9px rgba(0, 0, 0, 0.8) !important; + border: 1px solid variables.$midtone-300; // midtone-300 + border-top: 1px dashed variables.$midtone-300; // midtone-300 + box-shadow: 3px 3px 9px rgb(0 0 0 / 80%) !important; /* core styles should not be changed */ position: absolute; @@ -2668,7 +2668,7 @@ ul#check::after { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - color: variables.$color-text-input !important; //$color-text-input + color: variables.$color-text-input !important; // $color-text-input } /* Portion that matches */ @@ -3144,7 +3144,7 @@ Documentation of mobile classes: margin-left: 1rem; &::before { - content: "📁 "; //\1F4C1 + content: "📁 "; // \1F4C1 } } diff --git a/sass/apollostage/_variables.scss b/sass/apollostage/_variables.scss index 57bbeca8a..13903a36a 100644 --- a/sass/apollostage/_variables.scss +++ b/sass/apollostage/_variables.scss @@ -11,7 +11,7 @@ $build-slug: "Apollostage build 240906"; // must include quotes // physical_layout -> token, and token -> raw value. -//Backgrounds -- 100-600 are used +// Backgrounds -- 100-600 are used $back-100: #121616; $back-200: #181d1d; $back-300: #1d2424; @@ -22,11 +22,11 @@ $back-700: #324041; $back-800: #384749; $back-900: #3c4d50; $back-1000: #405256; -$back-500-low: rgba(110.7, 149, 169, 0.15); +$back-500-low: rgb(110.7 149 169 / 15%); $back-600-low: #2d393a54; $back-600-mid: #2d393a88; -//Mids +// Mids $midtone-100: #093a2e; $midtone-200: #0c4a3b; $midtone-300: #0f5b49; @@ -38,8 +38,8 @@ $midtone-800: #1daf8b; $midtone-900: #20c098; $midtone-1000: #23d1a5; -//Menu theme -//can be same as "midtone" above. +// Menu theme +// can be same as "midtone" above. $menutheme-100: #003d2d; $menutheme-200: #004b38; @@ -52,7 +52,7 @@ $menutheme-800: #009777; $menutheme-900: #00a280; $menutheme-1000: #00ad89; -//Fores -- 400-1000 are used +// Fores -- 400-1000 are used $fore-100: #6e7968; $fore-200: #7e887b; $fore-300: #8c978a; @@ -64,7 +64,7 @@ $fore-800: #d5e0d9; $fore-900: #e5efe9; $fore-1000: #fdfffd; -//Direct-Specialty +// Direct-Specialty $ds-neutral-300: #dcdfe4; $ds-neutral-400: #b8b8b8; $ds-neutral-500: #8591a2; @@ -124,7 +124,7 @@ $color-menu-fx-selection: $ds-fx-menutheme; $color-mobilemenu-userinfo-1: $menutheme-400; // mobile pulldown menu gradient 1 $color-mobilemenu-userinfo-2: $menutheme-900; // mobile pulldown menu gradient 2 $color-mobilemenu-closed: $menutheme-700; // rules, also mobile menu header -$color-mobilemenu-shadow: $menutheme-500; //mobile menu +$color-mobilemenu-shadow: $menutheme-500; // mobile menu $color-mobilemenu-closed-overlays: $menutheme-100; // bg for icons on the hedaer $color-text-anchor-hover: $midtone-1000; @@ -178,7 +178,6 @@ $color-background-autocompletes: $color-background-searchbars; $color-accent-border-autocompletes: $midtone-300; $color-text-autocomplete: $color-text-input; $color-text-autocomplete-highlight-match: $fore-1000; - $color-accent-border-blockquote: $back-900; // Dotted $color-accent-border-box: $back-900; $color-accent-border-input: $ds-fx-low; @@ -206,7 +205,6 @@ $color-accent-border-alert: $midtone-500; $color-background-alert: $back-600; $color-text-alert: $fore-700; $color-anchor-alert: $fore-1000; - $ds-shadow-heavy: 0 10px 18px rgb(0 0 0 / 55%), 0 7px 7px rgb(0 0 0 / 52%), @@ -217,12 +215,10 @@ $ds-shadow-raised: $ds-shadow-raised-hover: 0 14px 28px rgb(0 0 0 / 25%), 0 10px 10px rgb(0 0 0 / 22%); - $color-accent-border-error: $ds-goldenrod; $color-background-error: $ds-gray-92; $color-text-error: $ds-black; $color-text-anchor-error: $ds-red; - $color-accent-border-warning-1: hsl(348deg 99% 77%); $color-accent-border-warning-2: hsl(348deg 84% 51%); $color-background-warning: #633; @@ -262,6 +258,7 @@ $icon-number-leechers: url(config('STATIC_SERVER') + "/svg/std/arrow-down-round- // // standard: $icon-mobile-rotate: url(config('STATIC_SERVER') + "/svg/std/notify-rotate-darkmode-ccc.svg"); + // and // $icon-notification: url(config('STATIC_SERVER') + "/svg/std/notification-bell-333xccc.svg"); // $icon-warning: url(config('STATIC_SERVER') + "/svg/std/x-c33.svg") diff --git a/sass/apollostage_coffee/style.scss b/sass/apollostage_coffee/style.scss index 9737eab74..c1dd75ae3 100644 --- a/sass/apollostage_coffee/style.scss +++ b/sass/apollostage_coffee/style.scss @@ -29,7 +29,7 @@ variables.$back-700: #443B3A; variables.$back-800: #4A3E3C; variables.$back-900: #51413F; variables.$back-1000: #574340; -variables.$back-500-low: rgba(140.7, 125.3, 112, 0.15); +variables.$back-500-low: rgb(140.7 125.3 112 / 15%); // Mids variables.$midtone-100: #3D2C29; @@ -83,6 +83,7 @@ variables.$color-background-table: variables.$back-200; // tables/forms without variables.$color-background-table-row-th: variables.$back-700; variables.$color-background-table-row-odd: variables.$back-500; variables.$color-background-table-row-even: variables.$back-300; + $color-background-table-secondary: orangered; // no longer used variables.$color-background-table-torrenttable: variables.$back-300; // also form field in focus variables.$color-background-table-details: variables.$back-400; // equal to blockquote @@ -110,7 +111,7 @@ variables.$color-menu-fx-selection: variables.$ds-fx-menutheme; variables.$color-mobilemenu-userinfo-1: variables.$menutheme-400; // mobile pulldown menu gradient 1 variables.$color-mobilemenu-userinfo-2: variables.$menutheme-900; // mobile pulldown menu gradient 2 variables.$color-mobilemenu-closed: variables.$menutheme-700; // rules, also mobile menu header -variables.$color-mobilemenu-shadow: variables.$menutheme-500; //mobile menu +variables.$color-mobilemenu-shadow: variables.$menutheme-500; // mobile menu variables.$color-mobilemenu-closed-overlays: variables.$menutheme-100; // bg for icons on the hedaer variables.$color-text-anchor-hover: variables.$midtone-1000; @@ -119,7 +120,7 @@ variables.$color-text-base: variables.$fore-700; variables.$color-text-bold: variables.$fore-800; variables.$color-text-button: variables.$ds-gray-05; variables.$color-text-footer: variables.$ds-neutral-300; -variables.$color-text-heading-anchor: variables.$fore-400; //uniqueue +variables.$color-text-heading-anchor: variables.$fore-400; // uniqueue variables.$color-text-heading: variables.$fore-700; variables.$color-text-important-alt: variables.$ds-green; variables.$color-text-important: variables.$ds-red; diff --git a/sass/apollostage_sunset/style.scss b/sass/apollostage_sunset/style.scss index 4b2eaf4a6..2ee1140be 100644 --- a/sass/apollostage_sunset/style.scss +++ b/sass/apollostage_sunset/style.scss @@ -29,7 +29,7 @@ variables.$back-700: #4A3A3F; variables.$back-800: #514048; variables.$back-900: #594653; variables.$back-1000: #5B4B60; -variables.$back-500-low: rgba(230, 149, 164.3, 0.15); +variables.$back-500-low: rgb(230 149 164.3 / 15%); variables.$fore-400: #8D869D; variables.$fore-500: #A595AF; @@ -70,6 +70,7 @@ $ds-fiji: #b43477; $ds-bali: #9c4366; variables.$ds-neutral-300: #a4a4a4; variables.$ds-black: #000; + $ds-menu-white: #fff8f8; // // Standard except where marked: @@ -184,7 +185,7 @@ variables.$color-accent-cats_music: darkslategray; variables.$color-accent-forum-inline-last-read: $ds-fiji; // changed variables.$color-accent-forum-unread: $ds-fiji; // changed -variables.$color-accent-selection-background: rgb(217 130 111 / 60%); //changed +variables.$color-accent-selection-background: rgb(217 130 111 / 60%); // changed variables.$color-accent-selection-text: #fff; // changed // popup notifications diff --git a/sass/dark_ambient/style.scss b/sass/dark_ambient/style.scss index 059f3cbd0..af27e1386 100644 --- a/sass/dark_ambient/style.scss +++ b/sass/dark_ambient/style.scss @@ -150,13 +150,13 @@ input { cursor: pointer; } -input[type=text], -input[type=search] { +input[type="text"], +input[type="search"] { cursor: text; } input, -input[type=search], +input[type="search"], select, textarea { font-family: Arial, sans-serif; @@ -170,7 +170,7 @@ textarea { } input, -input[type=search], +input[type="search"], textarea { color: #878787; padding: 3px; @@ -198,8 +198,8 @@ textarea:focus, color: #878787; } -input[type=submit], -input[type=button] { +input[type="submit"], +input[type="button"] { background-color: #2e2e2e; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAWCAIAAACOpGH9AAAAKklEQVR4AWPS0tJiYmBgYGJkZMSBQXJMYDYQgGgYG1kfSAbIB7JBkIERADyGAOpVj1wuAAAAAElFTkSuQmCC"); border-top: 1px solid #323232; @@ -209,8 +209,8 @@ input[type=button] { font-weight: bold; } -input[type=submit]:active, -input[type=button]:active { +input[type="submit"]:active, +input[type="button"]:active { color: #007dc7 !important; } @@ -447,7 +447,7 @@ ul#userinfo_username { /* SEARCH BARS */ #searchbars input, -#searchbars input[type=search] { +#searchbars input[type="search"] { background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJ0AAAAXCAIAAACeb9o/AAAGeklEQVR4AcSRV2KAMAxDLTkJ8MsF4P5nbO0qo3v+VVnPkxHc921vBOBLfuvBEEnYGEt00t21CAhmUmbQKIwMS0to2awiQQn+0jYFqXBSek6VQ7WpRvGo3cQjYJBHlKkigTbljcSp7oTFcFlXDulYgly2NEk12gGbaSaIVTgP+w+9vYs/vgau65p0HMd5nrXWeSXa69CEUkprTfu+79vWWm1t25wsXr14qRoFYOnpRUOmO0hhKxQzLUkzryIXOR4isH52SG4e4/75RCNZHAAIwDCw7D8wEjk8fdUt4BH3ky9/7zAGpk3nApJZiC8pqWLSUB3bsSmODjXuEFvWcUhvdNI2dVI6ad/WQxNelATm5cdn+uNg4Jrq5dXZnlnoSJIrUbTqvcXmYWZGwfD/S+ofWGbeZmY+tbc6lHJIVxorhydW67HDTme1T95wpJOeWO7c9BbjVaqZTQMKourKdBcXF9fX1/tcL168yD8wO3LkyNra2tbWluYqpit0XJYy1eU8bCI8Kiq6KuijkFgaFjN0JKWQE048NFRgUqwWnn7dNRSGs6FM+lSVKOWCqjwxW9ZCWtY3b02+esjiJ3/++ecDAwOrq6sQpNm9cOECKhwcHNzd3d3e3tZ1e4cWgMFDJfgFicIYJr9wYtEUZEr5g3pGqwp3bz6hvWYfiYgGPeTf2UVjO0DtijtC7DHkCoZ3/gdqTaq9oDltQVOW/XlMlV8y8MPqAzVo0efm5ubOzk73/PnzY2NjGxsb3IBVJuReu3aNCtgZoUEYC6eFjl+zvLysuhCaCpZhY816TBXzawD3pdTeKbcYB5iiGU+Dw5M8ambTbLLW6bYOGHaUbISw63EdHR0lLqvj9u3byBdmsJRkWdki+suPuOfn55kleBi66i2GFSxliqsKmVlbzRCCGagxReaneoYX/ggYPhR6p+kKrn5YxQAkCz5U2j137py4crPr16+TFuEFeAiU8tmzZ6qPj48zr2Dz/8rqKnX9ykxXdVnuzZL1f0bAa4bocIZlqAae0auJwBUy1T5dPDc5cWl6/HPjufZohl5BdeXKFVYcITaX7Pnz57/99htOYJ88efLrr78WV7rIs6hEUpexFU6Tc5nkXkgy40BSYCsknmfw8Dwq05VQ1UyVdwGTu+VpeakB7crKSk+vw8PD4gpj4mpzjV68ePHrr7+SWy2tLP3x2x8EZwQ9MTEhrrpKIzPLZjMH3lwvcOZoGV2ZgceZwfsN1eQmVdptga7H2dQrRlbc4zo0NCTlIUewxThx/emnn/BLshgPwcS/E0Rhcc13Df1lbJFXN7VblzTmVc44/bbqg231JtcWePO8eq4Q7On17Nmz4ooWjx8/jpAZxzGC0hd21h9++IHMmISY3BiuIyMjk5OTmoXngkU0ryu+Sek3G3VlvVLSTLHaAHNE41pv7VP0Tv/85WbmyssrymP7PHbsGO+2xXKTIROKBZU3IqBGCsrTUAArKrnXj/GqzQP8pmh6za78Bulmv3c6rsRhuEIIchw5wVVLxkHi08ePOZr6/ttvj588iZrhOjMzs3doDOEq9mOj1MKPGWwecGap+suuix7KYkKsmqXx1AHzGvWZPFD7XMmJYIleMRJj6oqrDx8+3Fhbm12cn/x3Eo9ee7QoUSJxXnk9DKby5IzTzBw81PTrIpzZ6RVQB7hFuvhfFjz4Sq68tpITsb/Sff/+fTyIdWpqimuU/caLf3jgyiwda3CtZ2n9QpsHiGKFsPSUWKHUR9QKkBW3AF8/H+Z7js4iaJAT4d3r9L6sEZNnZ2dZIJ3hYUGUikq4ai3aYlZBt0JhZs7Wz/pf83sREZcIyv7Y+/4KZNSJeOlAstoydyGqiZIOQrtxgmGW3uyU2elX3PTWc/UL967RJbHtnzddvXqVOAzhpaUl/algjq83xYxBkTSKPCuHWb/i7W+0r/h7tbT7DgEmyvbPh/l6E++vHPcLVSSNfusukuF3l26m6MG/nXThyJbKD0Zy3Rs3boCH73YEVTiDtsXnlHnao1vhb//3v7VbLxsocZfNVYe73Vu3btFBm/CrLzmd99IgpJxIrX6hdJqC51htmm3CaxG2N/BhyBJ90uzeuXMnjipg/h5xlNTEquxSqYJ9h3//d/jZnxI/1f869V95ucZR0ohROWjT1Ju+aKmgVJOOOPaKEk/gpYiHTz4cXIVD5/NxiXZP3kuV9GDde/fuvX/i/GgH7TORxwuaApcAAAAASUVORK5CYII=") top left no-repeat; border: 0 !important; height: 24px; @@ -751,8 +751,8 @@ ul#userinfo_username { padding: 0; } -#forums #content .thin .box form .box input[type=text], -#forums #content .thin .box form .box input[type=search] { +#forums #content .thin .box form .box input[type="text"], +#forums #content .thin .box form .box input[type="search"] { font-size: 20px; width: 500px; } @@ -979,12 +979,12 @@ strong.quoteheader { color: #47a9ef; } -#torrents #content .center .box form div input[type=text], -#torrents #content .center .box form div input[type=search], -#wiki #content .center .box form div input[type=text], -#wiki #content .center .box form div input[type=search], -#artist #content .center .box form div input[type=text], -#artist #content .center .box form div input[type=search] { +#torrents #content .center .box form div input[type="text"], +#torrents #content .center .box form div input[type="search"], +#wiki #content .center .box form div input[type="text"], +#wiki #content .center .box form div input[type="search"], +#artist #content .center .box form div input[type="text"], +#artist #content .center .box form div input[type="search"] { width: 500px !important; margin-bottom: 10px; } @@ -1140,7 +1140,7 @@ h3 { div#flip_view_1 div#similar-artist .name { border: 1px solid #1a1a1a; - background: rgba(46, 46, 46, 0.5); + background: rgb(46 46 46 / 50%); padding: 2px 4px; } @@ -1409,9 +1409,9 @@ ul.collage_images li a:hover img { color: #575757; } -.colhead_dark img[alt=Donor], -.colhead_dark img[alt=Warned], -.colhead_dark img[alt=Banned] { +.colhead_dark img[alt="Donor"], +.colhead_dark img[alt="Warned"], +.colhead_dark img[alt="Banned"] { margin: 0 !important; position: relative; top: 2px; @@ -1493,7 +1493,7 @@ h3 { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAApCAIAAAB7iNSFAAAASUlEQVR4AWLScksCdDEGGAADMAw8+f97Z6ZNRrDZcKLJqUIEaM5DSQpQ4u2O3d62wIrz2bMrYjkW0LuZrfv/Q5ovrv/0nqsucAPmG1SOQwjZIwAAAABJRU5ErkJggg==") !important; } -#forums td[value=unread] { +#forums td[value="unread"] { color: red !important; } @@ -2126,13 +2126,13 @@ tr.torrent .bookmark > a::after { color: #878787; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #1E1E1E; border-color: #A0A0A0; color: #878787; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #007DC6; } diff --git a/sass/dark_cake/style.scss b/sass/dark_cake/style.scss index e68a3b8e8..de2702464 100644 --- a/sass/dark_cake/style.scss +++ b/sass/dark_cake/style.scss @@ -585,7 +585,7 @@ table.slice { div#flip_view_1 div#similar-artist .name { border: 1px solid #5294e2; - background: rgba(75, 81, 98, 0.5); + background: rgb(75 81 98 / 50%); padding: 2px 4px; } @@ -1006,7 +1006,7 @@ tr.torrent .bookmark > a::after { font-weight: normal; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #aaa; } diff --git a/sass/global.scss b/sass/global.scss index 00db4d5d2..7035d471d 100644 --- a/sass/global.scss +++ b/sass/global.scss @@ -532,11 +532,13 @@ tr.torrent .bookmark > a::after { .reportinfo_table, .torrentdetails blockquote { word-break: normal; + /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */ word-wrap: break-word; hyphens: auto; } /* Non-web-standard for webkit */ .torrentdetails blockquote { + /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */ word-break: break-word; } /* Fix long filename tables overflowing (Chrome only). */ @@ -988,7 +990,7 @@ td.forum-post-head a.username { background-repeat: no-repeat; background-position: 8px 1rem; background-size: 32px; - box-shadow: 0 10px 18px rgba(0, 0, 0, 0.55), 0 7px 7px rgba(0, 0, 0, 0.52), 0 -5px 9px rgba(0, 0, 0, 0.32); + box-shadow: 0 10px 18px rgb(0 0 0 / 55%), 0 7px 7px rgb(0 0 0 / 52%), 0 -5px 9px rgb(0 0 0 / 32%); font-weight: 700; font-size: medium; color: #000; diff --git a/sass/kuro/style.scss b/sass/kuro/style.scss index 6942a836e..cc6254c2c 100644 --- a/sass/kuro/style.scss +++ b/sass/kuro/style.scss @@ -108,7 +108,7 @@ a.similar_artist:hover { div#flip_view_1 div#similar-artist .name { border: 1px solid #999999; - background: rgba(68, 68, 68, 0.5); + background: rgb(68 68 68 / 50%); padding: 2px 4px; } @@ -445,6 +445,7 @@ ul.thin li { #cat-selector ul li { display: inline; + // width: 12em; // height: 1em; // float: left; diff --git a/sass/layer_cake/style.scss b/sass/layer_cake/style.scss index aa34170ec..ec8e6dab3 100644 --- a/sass/layer_cake/style.scss +++ b/sass/layer_cake/style.scss @@ -370,7 +370,7 @@ ul.thin li { div#flip_view_1 div#similar-artist .name { border: 1px solid #666666; - background: rgba(226, 226, 226, 0.5); + background: rgb(226 226 226 / 50%); padding: 2px 4px; } @@ -918,7 +918,7 @@ tr.torrent .bookmark > a::after { font-weight: normal; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #AAAAAA; } diff --git a/sass/linohaze/style.scss b/sass/linohaze/style.scss index 32830e871..67054bcec 100644 --- a/sass/linohaze/style.scss +++ b/sass/linohaze/style.scss @@ -6,10 +6,10 @@ LinoHaze: linotype Style derived from Gazelle Postmod *********************************************************/ +@import "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,bold"; @namespace url(http://www.w3.org/1999/xhtml); @namespace svg url(http://www.w3.org/2000/svg); -@import "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,bold"; * { padding: 0; margin: 0; @@ -22,7 +22,7 @@ html { body { background: #424242 no-repeat fixed center center; background-size: cover; - font-family: Source Sans Pro, sans-serif; + font-family: "Source Sans Pro", sans-serif; font-size: 12px; font-weight: 300; color: #fff; @@ -54,18 +54,18 @@ h4 { h2 { font-size: 20px !important; - text-shadow: 0 0 15px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.8); + text-shadow: 0 0 15px rgb(0 0 0 / 10%), 0 0 1px rgb(0 0 0 / 80%); } h2 a { - color: rgba(255, 255, 255, 0.6); - text-shadow: 0 0 15px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.8); + color: rgb(255 255 255 / 60%); + text-shadow: 0 0 15px rgb(0 0 0 / 10%), 0 0 1px rgb(0 0 0 / 80%); } a { text-decoration: none; border: none; - color: rgba(255, 255, 255, 0.6); + color: rgb(255 255 255 / 60%); } a:hover { @@ -89,7 +89,7 @@ table tbody a, .sidebar a, .box a { font-weight: 400; - color: rgba(255, 255, 255, 0.6); + color: rgb(255 255 255 / 60%); } table tbody a:hover, @@ -142,18 +142,18 @@ input { textarea { padding: 2px 3px; - font-family: Source Sans Pro, Helvetica, Arial, sans-serif; + font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; font-size: 13px; - background: rgba(33, 33, 33, 0.32); - border: 1px solid rgba(255, 255, 255, 0.08); + background: rgb(33 33 33 / 32%); + border: 1px solid rgb(255 255 255 / 8%); color: #fff; } textarea:hover, textarea:active, textarea:focus { - background: rgba(33, 33, 33, 0.42); - border: 1px solid rgba(255, 255, 255, 0.1); + background: rgb(33 33 33 / 42%); + border: 1px solid rgb(255 255 255 / 10%); outline: none; } @@ -168,11 +168,11 @@ b { .head .time { margin-left: 5px; - color: rgba(255, 255, 255, 0.5); + color: rgb(255 255 255 / 50%); } ::selection { - background: rgba(255, 255, 255, 0.4); + background: rgb(255 255 255 / 40%); } span.size1 { @@ -303,13 +303,13 @@ ul.thin li { width: 900px; text-align: center; padding: 1em 0; - color: rgba(255, 255, 255, 0.6); + color: rgb(255 255 255 / 60%); font-size: 10px; } #disclaimer_container { font-size: 9px; - color: rgba(255, 255, 255, 0.6); + color: rgb(255 255 255 / 60%); } #logo { @@ -359,7 +359,7 @@ ul.thin li { #menu a:hover { color: #212121; background: #fff !important; - border: solid rgba(0, 0, 0, 0) !important; + border: solid rgb(0 0 0 / 0%) !important; border-width: 1px 0 !important; font-weight: 400; } @@ -369,58 +369,58 @@ ul.thin li { } #menu li:nth-child(2) a { - background: linear-gradient(rgba(33, 33, 33, 0.7), rgba(33, 33, 33, 0.72)); + background: linear-gradient(rgb(33 33 33 / 70%), rgb(33 33 33 / 72%)); width: 100px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0 1px 1px; } #menu li:nth-child(3) a { - background: linear-gradient(rgba(33, 33, 33, 0.64), rgba(33, 33, 33, 0.66)); + background: linear-gradient(rgb(33 33 33 / 64%), rgb(33 33 33 / 66%)); width: 100px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0; } #menu li:nth-child(4) a { - background: linear-gradient(rgba(33, 33, 33, 0.58), rgba(33, 33, 33, 0.6)); + background: linear-gradient(rgb(33 33 33 / 58%), rgb(33 33 33 / 60%)); width: 100px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0; } #menu li:nth-child(5) a { - background: linear-gradient(rgba(33, 33, 33, 0.52), rgba(33, 33, 33, 0.54)); + background: linear-gradient(rgb(33 33 33 / 52%), rgb(33 33 33 / 54%)); width: 92px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0; } #menu li:nth-child(6) a { - background: linear-gradient(rgba(33, 33, 33, 0.46), rgba(33, 33, 33, 0.48)); + background: linear-gradient(rgb(33 33 33 / 46%), rgb(33 33 33 / 48%)); width: 66px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0; } #menu li:nth-child(7) a { - background: linear-gradient(rgba(33, 33, 33, 0.4), rgba(33, 33, 33, 0.42)); + background: linear-gradient(rgb(33 33 33 / 40%), rgb(33 33 33 / 42%)); width: 88px; - border: solid rgba(0, 0, 0, 0.1); + border: solid rgb(0 0 0 / 10%); border-width: 1px 0; } #menu li:nth-child(8) a { - background: linear-gradient(rgba(33, 33, 33, 0.34), rgba(33, 33, 33, 0.36)); + background: linear-gradient(rgb(33 33 33 / 34%), rgb(33 33 33 / 36%)); width: 88px; - border: solid rgba(0, 0, 0, 0.08); + border: solid rgb(0 0 0 / 8%); border-width: 1px 0; } #menu li:nth-child(9) a { - background: linear-gradient(rgba(33, 33, 33, 0.28), rgba(33, 33, 33, 0.3)); + background: linear-gradient(rgb(33 33 33 / 28%), rgb(33 33 33 / 30%)); width: 88px; - border: solid rgba(0, 0, 0, 0.08); + border: solid rgb(0 0 0 / 8%); border-width: 1px 0; } @@ -457,7 +457,7 @@ ul.thin li { #nav_staff a:hover { font-weight: 400 !important; - color: rgba(255, 255, 255, 0.8) !important; + color: rgb(255 255 255 / 80%) !important; background-color: transparent !important; margin-top: 10px !important; } @@ -500,7 +500,7 @@ ul.thin li { } #userinfo_major #nav_upload a:hover { - color: rgba(255, 255, 255, 0.8); + color: rgb(255 255 255 / 80%); } #userinfo_major #nav_upload a:active { @@ -512,7 +512,7 @@ ul.thin li { } #userinfo_major #nav_invite a:hover { - color: rgba(255, 255, 255, 0.8); + color: rgb(255 255 255 / 80%); } #userinfo_major #nav_invite a:active { @@ -525,7 +525,7 @@ ul.thin li { } #userinfo_major #nav_store a:hover { - color: rgba(255, 255, 255, 0.8); + color: rgb(255 255 255 / 80%); } #userinfo_major #nav_store a:active { @@ -537,7 +537,7 @@ ul.thin li { } #userinfo_major #nav_bonus a:hover { - color: rgba(255, 255, 255, 0.8); + color: rgb(255 255 255 / 80%); } #userinfo_major #nav_bonus a:active { @@ -549,7 +549,7 @@ ul.thin li { } #userinfo_major #nav_donate a:hover { - color: rgba(255, 255, 255, 0.8); + color: rgb(255 255 255 / 80%); } #userinfo_major #nav_donate a:active { @@ -559,7 +559,7 @@ ul.thin li { #userinfo_stats { color: #fff; font-weight: 400; - text-shadow: 0 0 15px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.2); + text-shadow: 0 0 15px rgb(0 0 0 / 10%), 0 0 1px rgb(0 0 0 / 20%); line-height: 58px; vertical-align: middle; float: right; @@ -570,7 +570,7 @@ ul.thin li { } #userinfo_stats a { - color: rgba(255, 255, 255, 0.8) !important; + color: rgb(255 255 255 / 80%) !important; } #userinfo_stats a:hover { @@ -595,9 +595,9 @@ ul.thin li { vertical-align: middle; color: #fff; text-align: center; - border: solid rgba(0, 0, 0, 0.08); + border: solid rgb(0 0 0 / 8%); border-width: 1px 0; - background: linear-gradient(rgba(33, 33, 33, 0.22), rgba(33, 33, 33, 0.24)); + background: linear-gradient(rgb(33 33 33 / 22%), rgb(33 33 33 / 24%)); padding: 0 !important; display: block; position: relative; @@ -616,11 +616,11 @@ ul.thin li { #userinfo_username li:first-child a:hover { background: #fff; color: #4b494c; - border: 1px solid rgba(0, 0, 0, 0) !important; + border: 1px solid rgb(0 0 0 / 0%) !important; } #userinfo_username:hover li:first-child a { - border: 1px solid rgba(0, 0, 0, 0) !important; + border: 1px solid rgb(0 0 0 / 0%) !important; } #userinfo_username li:first-child a:active { @@ -698,13 +698,13 @@ ul.thin li { width: 48px !important; height: 50px !important; line-height: 50px !important; - border: solid rgba(0, 0, 0, 0.08); + border: solid rgb(0 0 0 / 8%); border-width: 1px 1px 1px 0; vertical-align: middle; display: block; position: relative; right: -9999px; - background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAwCAYAAACBpyPiAAAAgUlEQVR42uzYMQqDQBBAUTcHFBTSmvN6A3OMpEhhM5kFK5FUsVh8A59lt9lXT4mIrtW5dQ0PPDw8PDw8PDw8PDw8PPyV8c8sDlpawE/ZZ/f2yh4t4Oesz9btXs9xe//v1KXTSd2zdzac9UexMYOHh4eHh4eHh4eHh4eHh/85XwEGAKiTodgNT7fcAAAAAElFTkSuQmCC'), linear-gradient(rgba(33, 33, 33, 0.16), rgba(33, 33, 33, 0.18)); + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAwCAYAAACBpyPiAAAAgUlEQVR42uzYMQqDQBBAUTcHFBTSmvN6A3OMpEhhM5kFK5FUsVh8A59lt9lXT4mIrtW5dQ0PPDw8PDw8PDw8PDw8PPyV8c8sDlpawE/ZZ/f2yh4t4Oesz9btXs9xe//v1KXTSd2zdzac9UexMYOHh4eHh4eHh4eHh4eHh/85XwEGAKiTodgNT7fcAAAAAElFTkSuQmCC'), linear-gradient(rgb(33 33 33 / 16%), rgb(33 33 33 / 18%)); background-repeat: no-repeat, repeat; } @@ -779,8 +779,8 @@ ul.thin li { width: 898px; height: 34px; padding: 8px 0; - border: 1px solid rgba(0, 0, 0, 0.07); - background: rgba(33, 33, 33, 0.1); + border: 1px solid rgb(0 0 0 / 7%); + background: rgb(33 33 33 / 10%); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAYAAAA4E5OyAAADpklEQVR4AezZA5ScSQBF4Vrbtm3btm3bthHbNno6tm3btm3dOHmNYVfVpPLO+Xbjv86daZv169fnhBNwHd7HbyiKfPgSj+E8HADju+z85btRFP2xCjrdbNTHxzh5VwlyMD7DCGRna1EXN+fmIG9jFnJ6dXBsbgpyMGoj2eahNSqjIH7CXyiBKAYg2ebjZe+D4DJMQrzNQlHcgUNghLoAH6ATEq2Yz0EeRrytwDcSIbNuQhPEW5qPQa5CvDXGWTA55CPEWwWfghyHFdD9BJMCl2IcdCV9CTIIujdhUuggdIfuGddBvoXuexgL9sY0ufYq7OMqyOnQ1YWx6BzoyroK0kwOMgHGgQ+hO8l2kLOguwnGkSFylvK2g/wvB+gD49BDcp5ltoNMkAM8AeOYPtq9YyvIpXLhBdgDRjm+L2lsK8j7cuEojAf0fm029rURpJhc+EMYD+yJyXK2c20E6SIXfRDGE2lytrtsBBksF70ExhOl5Wyv2ggyElu3GsfBeKKgBPnSRpDR2LqVOArGEwUkyLc2guizwnNgPFHCynMRCdJHLnonjCeqy9kethFEL/oyjCf0zenLbAT5yuk7VYkdI+daicNtBLnLk5f96kk5V0dbT933wdLE35rONJIz/Wvz1W4NuXhtGIfOg+54m0FudXKAxJrKWdq4eAtxtIuX21BXQnebiyAPQvcejGWTXb57p78Qge4WGEui0J3nMsihWCMHWoszLRwmP3QFfPjk7kHoFuAamBQpB11znz7s/hbx9nEKPpjqjnhrj72cBhH5EG/dcAVMNn2LNUi2kdjLaRDxHRKtFu7L5GevZ+JHDEe8rYauD/Z2GkQ8iNlItGmogW/wDK7EuTgP9+B95EFXJFtlnILK0PXDQU6DiKNRDanYJDwl12sA3Wgc7DyIeBxtkBObi3+SfOUj0A3Evl4EETeiCEYhM1uKZngPR8AoUQe6AdjPqyDiSjyPgoiiBTqiLZqhCr7F/TgGJpPqQjcQ+7sP4k5r6AbjgKCCiAh0Q3BgUEFENeiG4qCggoja0A3DPkEFEU2h64+DggoiItCNwCFBBRFVoBuJA4MKIhpDNxB7BxVENISuL/YPKoiIQDcchzsI4n2UfYMKItKg64/9ggoiItANwP5BBRHRxPcpAQURTaAbiQOCCiLqQDcUB3ofxMELwgODCiKaJXxBKEFC0gi64ThYggSlWoIoh0mQoEShG6RBdt98JEiIGgYfRGwYbJXDHdhOMgAN+4dPVDXW7gAAAABJRU5ErkJggg=='); background-size: 20px; background-repeat: no-repeat; @@ -794,24 +794,24 @@ ul.thin li { height: 34px; margin: 0; padding: 11px; - background: rgba(33, 33, 33, 0.3); - border: 1px solid rgba(33, 33, 33, 0.3); + background: rgb(33 33 33 / 30%); + border: 1px solid rgb(33 33 33 / 30%); border-radius: 1px; color: #fff; - font-family: Source Sans Pro, Helvetica, Arial, sans-serif; + font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; font-weight: 300; font-size: 12px !important; } ::placeholder { - color: rgba(255, 255, 255, 0.5); + color: rgb(255 255 255 / 50%); } #searchbars input:hover, #searchbars input:active, #searchbars input:focus { - background: rgba(33, 33, 33, 0.5); - border: 1px solid rgba(33, 33, 33, 0.63); + background: rgb(33 33 33 / 50%); + border: 1px solid rgb(33 33 33 / 63%); outline: none; } @@ -847,7 +847,7 @@ ul.thin li { max-height: 720px !important; margin-top: 0; border: none; - background: rgba(59, 59, 59, 0.9); + background: rgb(59 59 59 / 90%); color: #fff; } @@ -862,7 +862,7 @@ ul.thin li { .autocomplete-selected strong { font-weight: 300; - color: rgba(59, 59, 59, 0.9) !important; + color: rgb(59 59 59 / 90%) !important; } .autocomplete-suggestions strong { @@ -878,13 +878,13 @@ ul.thin li { #alerts .alertbar { box-sizing: border-box; - border: 1px solid rgba(0, 0, 0, 0.1); + border: 1px solid rgb(0 0 0 / 10%); height: 36px; line-height: 36px; vertical-align: center; margin-bottom: 2px; color: transparent; - background: linear-gradient(rgba(33, 33, 33, 0.4), rgba(33, 33, 33, 0.42)); + background: linear-gradient(rgb(33 33 33 / 40%), rgb(33 33 33 / 42%)); } #alerts .alertbar a { @@ -957,8 +957,8 @@ table.no_grouping > tbody > tr.colhead > td:first-child + td { } .linkbox a { - color: rgba(255, 255, 255, 0.7); - text-shadow: 0 0 15px rgba(0, 0, 0, 0.2), 0 0 1px rgba(0, 0, 0, 0.8); + color: rgb(255 255 255 / 70%); + text-shadow: 0 0 15px rgb(0 0 0 / 20%), 0 0 1px rgb(0 0 0 / 80%); } .linkbox a:hover { @@ -975,7 +975,7 @@ table.no_grouping > tbody > tr.colhead > td:first-child + td { } .donation_info_title { - text-shadow: 0 0 15px rgba(0, 0, 0, 0.2); + text-shadow: 0 0 15px rgb(0 0 0 / 20%); } .center { @@ -1060,7 +1060,7 @@ p.min_padding { } .tags a { - color: rgba(255, 255, 255, 0.6) !important; + color: rgb(255 255 255 / 60%) !important; } .tags a:hover { @@ -1082,7 +1082,7 @@ table { } tr { - border: solid rgba(33, 33, 33, 0.1); + border: solid rgb(33 33 33 / 10%); border-width: 0 0 1px; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAE0lEQVR4AWPw9vaOJwbTWeGoQgAUvn0BfEWeHwAAAABJRU5ErkJggg==') repeat; } @@ -1144,12 +1144,12 @@ th { .colhead, .colhead_dark { padding: 12px; - background: linear-gradient(rgba(33, 33, 33, 0.5), rgba(33, 33, 33, 0.58)); + background: linear-gradient(rgb(33 33 33 / 50%), rgb(33 33 33 / 58%)); color: #fff !important; text-transform: uppercase; - border: 1px rgba(0, 0, 0, 0.1); + border: 1px rgb(0 0 0 / 10%); border-radius: 1px; - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05); + box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%); font-size: 12px; font-weight: 400 !important; } @@ -1164,14 +1164,14 @@ th { } .head .brackets { - color: rgba(255, 255, 255, 0.5); + color: rgb(255 255 255 / 50%); } .colhead a, .colhead_dark a, .head a, #discog_table > .box.center a { - color: rgba(255, 255, 255, 0.5) !important; + color: rgb(255 255 255 / 50%) !important; } .colhead_dark a img:active, @@ -1232,9 +1232,9 @@ tr.peer_list td { } .save_message { - border: 1px solid rgba(255, 255, 255, 0.4); + border: 1px solid rgb(255 255 255 / 40%); padding: 3px 0; - background-color: rgba(255, 255, 255, 0.6); + background-color: rgb(255 255 255 / 60%); font-weight: 400; text-align: center; color: #212121; @@ -1341,16 +1341,16 @@ ul.poll li.graph { } .collage_table tr { - background-color: rgba(255, 255, 255, 0.05); + background-color: rgb(255 255 255 / 5%); } .torrent_table tr.group { - background-color: rgba(33, 33, 33, 0.1); + background-color: rgb(33 33 33 / 10%); border: none; } .torrent_table tr.group_torrent { - background-color: rgba(255, 255, 255, 0.05); + background-color: rgb(255 255 255 / 5%); } tr.group_torrent td, @@ -1542,7 +1542,7 @@ blockquote, code { margin: 10px; padding: 10px; - border: 1px solid rgba(255, 255, 255, 0.36); + border: 1px solid rgb(255 255 255 / 36%); background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAE0lEQVR4AWPw9vaOJwbTWeGoQgAUvn0BfEWeHwAAAABJRU5ErkJggg==') repeat; } @@ -1763,11 +1763,11 @@ ul .invitetree { .poll .graph .left_poll { width: 9px; - background: rgba(255, 255, 255, 0.4); + background: rgb(255 255 255 / 40%); } .poll .graph .center_poll { - background: rgba(255, 255, 255, 0.4); + background: rgb(255 255 255 / 40%); max-width: 800px; } @@ -1777,7 +1777,7 @@ ul .invitetree { .poll .graph .right_poll { width: 11px; - background: rgba(255, 255, 255, 0.4); + background: rgb(255 255 255 / 40%); } .breadcrumbs { @@ -1818,69 +1818,69 @@ ul .invitetree { button { padding: 5px; color: #212121; - background: linear-gradient(rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.78)); - border: solid rgba(255, 255, 255, 0.2); + background: linear-gradient(rgb(255 255 255 / 95%), rgb(255 255 255 / 78%)); + border: solid rgb(255 255 255 / 20%); border-radius: 1px; border-width: 0 0 1px; } button:hover { - border: solid rgba(255, 255, 255, 0.2); + border: solid rgb(255 255 255 / 20%); border-width: 0 0 1px; - background: linear-gradient(rgba(255, 255, 255, 0.83), rgba(255, 255, 255, 0.68)); + background: linear-gradient(rgb(255 255 255 / 83%), rgb(255 255 255 / 68%)); outline: none; } button:active { - background: linear-gradient(rgba(255, 255, 255, 0.69), rgba(255, 255, 255, 0.79)); - border: solid rgba(255, 255, 255, 0.2); + background: linear-gradient(rgb(255 255 255 / 69%), rgb(255 255 255 / 79%)); + border: solid rgb(255 255 255 / 20%); border-width: 0 0 1px; outline: none; } -input[type=button], -input[type=submit] { +input[type="button"], +input[type="submit"] { box-sizing: border-box; font-size: 10px; height: 30px; - background: linear-gradient(rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.78)); + background: linear-gradient(rgb(255 255 255 / 95%), rgb(255 255 255 / 78%)); display: inline-block; padding: 9px 12px; text-transform: uppercase; color: #212121; text-decoration: none; - border: solid rgba(255, 255, 255, 0.2); + border: solid rgb(255 255 255 / 20%); border-radius: 1px; border-width: 0 0 1px; cursor: pointer; outline: none; } -input[type=button]:hover, -input[type=submit]:hover { - border: solid rgba(255, 255, 255, 0.2); +input[type="button"]:hover, +input[type="submit"]:hover { + border: solid rgb(255 255 255 / 20%); border-width: 0 0 1px; - background: linear-gradient(rgba(255, 255, 255, 0.83), rgba(255, 255, 255, 0.68)); + background: linear-gradient(rgb(255 255 255 / 83%), rgb(255 255 255 / 68%)); outline: none; } -input[type=button]:active, -input[type=submit]:active { - background: linear-gradient(rgba(255, 255, 255, 0.69), rgba(255, 255, 255, 0.79)); - border: solid rgba(255, 255, 255, 0.2); +input[type="button"]:active, +input[type="submit"]:active { + background: linear-gradient(rgb(255 255 255 / 69%), rgb(255 255 255 / 79%)); + border: solid rgb(255 255 255 / 20%); border-width: 0 0 1px; outline: none; } -input[type=text], +input[type="text"], input[type="password"], input[type="search"], input[type="email"] { box-sizing: border-box; height: 34px; padding: 11px 9px; - background: rgba(33, 33, 33, 0.3); - border: 1px solid rgba(255, 255, 255, 0.1); + background: rgb(33 33 33 / 30%); + border: 1px solid rgb(255 255 255 / 10%); display: inline-block; margin: 2px; color: #fff; @@ -1889,16 +1889,16 @@ input[type="email"] { outline: none; } -input[type=text]:hover, -input[type=text]:focus, +input[type="text"]:hover, +input[type="text"]:focus, input[type="search"]:hover, input[type="search"]:focus, input[type="password"]:hover, input[type="password"]:focus, input[type="email"]:hover, input[type="email"]:focus { - background: rgba(33, 33, 33, 0.5); - border: 1px solid rgba(255, 255, 255, 0.3); + background: rgb(33 33 33 / 50%); + border: 1px solid rgb(255 255 255 / 30%); outline: none; } @@ -1917,28 +1917,28 @@ input[type="email"]:focus { background-position: top left; } -select[disabled=disabled] { +select[disabled="disabled"] { background: #4f4f4f; color: #dfdfdf; } -select[disabled=disabled]:hover, -select[disabled=disabled]:focus, -select[disabled=disabled]:active { +select[disabled="disabled"]:hover, +select[disabled="disabled"]:focus, +select[disabled="disabled"]:active { background-color: #4f4f4f; color: #dfdfdf; } select { - background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAEFCu8CAAABWUlEQVR42mL8////RgYGBjMGKGAECjxkQAIsQPwDXeAXsgBAAIG0PMcqywTS+/XbN5DAD7AMNxcXWAYggEB6njDgACCVP2EcSUUtJRD9/P61ezCd13DpBAggFKdgM/YvWZIgf/wBYWMrJymgg+RgfBCGS549tu+egZ7Od2RJvK7FaydAAIF0PmMgA7BA7SZL419yNDIh+xgZA4NKAYSb2nv4sMmD/HiD7n7kAOKvpGoECCC8KQsPOEVRPP6ju8b/A+9UWI4HATFRkT8XTx16hC3J/UPHKYmx72EKgJoeYFMDio6b2Jzi4R8mu3b5gqfAEuofrgRwYzQesQJugAAjO5GTC8j2IiUW/hv14ciwcMny1bylVfViGGUAIyNDT3vjq6jwkM/EVhq3iHUdUC1jbFKmxN4Dh3hAfE83589zZ0x6CbSU6HSAs3QbTTSjGR+fhR+B2IZO9h0FAG58tEp9ISvFAAAAAElFTkSuQmCC'), rgba(33, 33, 33, 0.3); + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAEFCu8CAAABWUlEQVR42mL8////RgYGBjMGKGAECjxkQAIsQPwDXeAXsgBAAIG0PMcqywTS+/XbN5DAD7AMNxcXWAYggEB6njDgACCVP2EcSUUtJRD9/P61ezCd13DpBAggFKdgM/YvWZIgf/wBYWMrJymgg+RgfBCGS549tu+egZ7Od2RJvK7FaydAAIF0PmMgA7BA7SZL419yNDIh+xgZA4NKAYSb2nv4sMmD/HiD7n7kAOKvpGoECCC8KQsPOEVRPP6ju8b/A+9UWI4HATFRkT8XTx16hC3J/UPHKYmx72EKgJoeYFMDio6b2Jzi4R8mu3b5gqfAEuofrgRwYzQesQJugAAjO5GTC8j2IiUW/hv14ciwcMny1bylVfViGGUAIyNDT3vjq6jwkM/EVhq3iHUdUC1jbFKmxN4Dh3hAfE83589zZ0x6CbSU6HSAs3QbTTSjGR+fhR+B2IZO9h0FAG58tEp9ISvFAAAAAElFTkSuQmCC'), rgb(33 33 33 / 30%); background-repeat: no-repeat, repeat; background-position: right 2px top 2px, 0 0; - border: 1px solid rgba(255, 255, 255, 0.1); + border: 1px solid rgb(255 255 255 / 10%); border-radius: 1px; display: inline-block; color: #fff; appearance: none; - font-family: Source Sans Pro, sans-serif; + font-family: "Source Sans Pro", sans-serif; box-sizing: border-box; margin: 2px; height: 34px; @@ -1947,25 +1947,25 @@ select { } option { - background: rgba(33, 33, 33, 0.5); - border: 1px solid rgba(255, 255, 255, 0.3); + background: rgb(33 33 33 / 50%); + border: 1px solid rgb(255 255 255 / 30%); border-radius: 1px; color: #fff; text-decoration: none; - font-family: Source Sans Pro, sans-serif; + font-family: "Source Sans Pro", sans-serif; } select:hover { - border: 1px solid rgba(255, 255, 255, 0.3); - background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAA4klEQVR4AcTNNwEAQAgAMfzLQdH3ooJi4hgyR/a5Gj5EM/ykDB8pw0sqCQ8pw00qCRdJop0kiXaQMuwkF9EW6pvZ/ZZQ0PyPDWsbW/8hxcIHxODJ02e/xmaZpKLW/6kz574m1hyQhfeJxYVlNR/QLSyrbnhPihkgC+8Rix8/eXovJCrhC8yyyPjULyAxUswAWXiXFHz7zt37Tp4B3509A7+D2KTqBxQ3xwQAwjAUBeNfDZgBCGxA6NZIaL+Jl+HmU3iTSsKLZM/7OUnhSSoJD5LCnaRwI1n8zalMl/XMZQrIOgBlRLOwefNxHgAAAABJRU5ErkJggg=='), rgba(33, 33, 33, 0.5); + border: 1px solid rgb(255 255 255 / 30%); + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAA4klEQVR4AcTNNwEAQAgAMfzLQdH3ooJi4hgyR/a5Gj5EM/ykDB8pw0sqCQ8pw00qCRdJop0kiXaQMuwkF9EW6pvZ/ZZQ0PyPDWsbW/8hxcIHxODJ02e/xmaZpKLW/6kz574m1hyQhfeJxYVlNR/QLSyrbnhPihkgC+8Rix8/eXovJCrhC8yyyPjULyAxUswAWXiXFHz7zt37Tp4B3509A7+D2KTqBxQ3xwQAwjAUBeNfDZgBCGxA6NZIaL+Jl+HmU3iTSsKLZM/7OUnhSSoJD5LCnaRwI1n8zalMl/XMZQrIOgBlRLOwefNxHgAAAABJRU5ErkJggg=='), rgb(33 33 33 / 50%); background-repeat: no-repeat, repeat; background-position: right 2px top 2px, 0 0; border-radius: 1px; } option:hover { - border: 1px solid rgba(255, 255, 255, 0.3); - background: rgba(33, 33, 33, 0.5); + border: 1px solid rgb(255 255 255 / 30%); + background: rgb(33 33 33 / 50%); background-repeat: no-repeat, repeat; background-position: right 2px top 2px, 0 0; border-radius: 1px; @@ -1973,13 +1973,13 @@ option:hover { select:active, select:focus { - border: 1px solid rgba(255, 255, 255, 0.3); - background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAA2ElEQVR4AcXNM2IEUQDG8XeMpEu62LaqrWI1cfrYOkOsdu+QnGR3bMe2bX6v+M08/4mq6f4rQRD/dZBBugoaDBLRdINFohLkkK6DPBKVoIBEJSgiXQclpC8H49PyTkLCIi/eEp2cffqdoPwVU7NL3lux0PCoi+n5Ze+r71wHla/q7BveehnsG5rY+s4b3wpeq6pv2r+P1Te27333PtF1Q/0Ojhe0Yl/ZUYmv/PB6/N37RDdMDYlKUEe6DhpIVIImEpWghYQPWrbjXg1shOsW2dzaWrmyDbJ6CR4huxJO5AowAAAAAElFTkSuQmCC'), rgba(33, 33, 33, 0.5); + border: 1px solid rgb(255 255 255 / 30%); + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAA2ElEQVR4AcXNM2IEUQDG8XeMpEu62LaqrWI1cfrYOkOsdu+QnGR3bMe2bX6v+M08/4mq6f4rQRD/dZBBugoaDBLRdINFohLkkK6DPBKVoIBEJSgiXQclpC8H49PyTkLCIi/eEp2cffqdoPwVU7NL3lux0PCoi+n5Ze+r71wHla/q7BveehnsG5rY+s4b3wpeq6pv2r+P1Te27333PtF1Q/0Ojhe0Yl/ZUYmv/PB6/N37RDdMDYlKUEe6DhpIVIImEpWghYQPWrbjXg1shOsW2dzaWrmyDbJ6CR4huxJO5AowAAAAAElFTkSuQmCC'), rgb(33 33 33 / 50%); background-repeat: no-repeat, repeat; background-position: right 2px top 2px, 0 0; outline: none; color: #fff; - font-family: Source Sans Pro, sans-serif; + font-family: "Source Sans Pro", sans-serif; } #logchecker .thin, @@ -2027,13 +2027,13 @@ tr.torrent .bookmark > a::after { width: 600px; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #ececec; color: #fff; } -div[class~=tooltipster-content] > a { - color: rgba(255, 255, 255, 0.6); +div[class~="tooltipster-content"] > a { + color: rgb(255 255 255 / 60%); } #settings_sections #settings_search { @@ -2186,18 +2186,18 @@ strong.important_text, .new { color: #fff !important; font-weight: 600 !important; - text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); + text-shadow: 0 0 2px rgb(255 255 255 / 80%); } strong.important_text_alt { color: #82ff6e !important; - text-shadow: 0 0 2px rgba(130, 255, 110, 0.8); + text-shadow: 0 0 2px rgb(130 255 110 / 80%); } span[style="color: red;"] { color: #fff !important; font-weight: 600 !important; - text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); + text-shadow: 0 0 2px rgb(255 255 255 / 80%); } #rules .box.pad.rule_table { @@ -2243,7 +2243,7 @@ body#userhistory table.forum_post td.body > div { div#flip_view_1 div#similar-artist .name { border: 1px solid #999999; - background: rgba(68, 68, 68, 0.5); + background: rgb(68 68 68 / 50%); padding: 2px 4px; } @@ -2304,32 +2304,29 @@ input[type="search"] { .tooltipster-default { border-radius: 0; - border: 1px solid rgba(255, 255, 255, 0.15) !important; - background: rgba(59, 62, 66, 0.9) !important; + border: 1px solid rgb(255 255 255 / 15%) !important; + background: rgb(59 62 66 / 90%) !important; color: #fff !important; } #noty_bottomRight_layout_container li { - border-top-left-radius: 1px !important; - border-top-right-radius: 1px !important; - border-bottom-right-radius: 1px !important; - border-bottom-left-radius: 1px !important; + border-radius: 1px 1px 1px 1px !important; color: #fff !important; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAE0lEQVR4AWPw9vaOJwbTWeGoQgAUvn0BfEWeHwAAAABJRU5ErkJggg==') !important; background-image: none !important; - border: 1px solid rgba(33, 33, 33, 0.4) !important; + border: 1px solid rgb(33 33 33 / 40%) !important; margin: initial !important; box-shadow: none !important; } .noty_buttons { - background: linear-gradient(rgba(33, 33, 33, 0.5), rgba(33, 33, 33, 0.58)) !important; + background: linear-gradient(rgb(33 33 33 / 50%), rgb(33 33 33 / 58%)) !important; background-image: none !important; border: none !important; } .noty_buttons a { - color: rgba(255, 255, 255, 0.6); + color: rgb(255 255 255 / 60%); } .noty_buttons a:hover { @@ -2342,7 +2339,7 @@ input[type="search"] { } #musicbrainz_popup { - background: rgba(44, 44, 44, 0.9) !important; + background: rgb(44 44 44 / 90%) !important; z-index: 10000 !important; } @@ -2463,10 +2460,7 @@ body { display: block; height: 100%; width: 984px; - top: 0; - bottom: 0; - left: 0; - right: 0; + inset: 0 0 0 0; margin: 0 auto; z-index: -2; filter: blur(12px); @@ -2477,16 +2471,13 @@ body { position: fixed; background-repeat: repeat; width: 984px; - top: 0; - bottom: 0; - left: 0; - right: 0; + inset: 0 0 0 0; margin: 0 auto; z-index: -2; } #extra1 { - background-color: rgba(255, 255, 255, 1); + background-color: rgb(255 255 255 / 100%); } body { diff --git a/sass/minimal_mod_alt.scss b/sass/minimal_mod_alt.scss index f842d744f..61b4b56fe 100644 --- a/sass/minimal_mod_alt.scss +++ b/sass/minimal_mod_alt.scss @@ -4,7 +4,7 @@ body { background: url(/static/styles/minimal/images/minimal_mod_header.png) repeat-x, url(/static/styles/minimal/images/minimal_mod_pattern.png) fixed 50% 0 repeat; background-color: #262626; color: #F1F1F1; - font-family: Helvetica, Segoe UI, Arial, sans-serif; + font-family: Helvetica, "Segoe UI", Arial, sans-serif; font-size: 11px; margin: 0; } @@ -59,13 +59,13 @@ blockquote { padding: 5px; } -input[type=submit]:focus, -input[type=button]:focus { +input[type="submit"]:focus, +input[type="button"]:focus { background: #333; } -input[type=submit]:active, -input[type=button]:active { +input[type="submit"]:active, +input[type="button"]:active { background: #5AF; } @@ -925,7 +925,7 @@ div.thin form div.submit input.submit { padding: 0; } -#forums #content .thin .box form .box input[type=Text] { +#forums #content .thin .box form .box input[type="Text"] { font-size: 20px; width: 500px; } @@ -1070,9 +1070,9 @@ div.thin form div.submit input.submit { font-weight: 400; } -#torrents #content .center .box form div input[type=text], -#wiki #content .center .box form div input[type=text], -#artist #content .center .box form div input[type=text] { +#torrents #content .center .box form div input[type="text"], +#wiki #content .center .box form div input[type="text"], +#artist #content .center .box form div input[type="text"] { margin-bottom: 10px; width: 500px; } @@ -1455,10 +1455,10 @@ td p, } input#file, -input[type=file], +input[type="file"], #userinfo, #userinfo a, -#logchecker input[type=file] { +#logchecker input[type="file"] { color: #fff; } @@ -1554,8 +1554,8 @@ table.recent tr, border-right: 1px #757575 solid; } -#artist #content table.torrent_table tr[class~=discog], -#collage #content table.torrent_table tr[class~=discog], +#artist #content table.torrent_table tr[class~="discog"], +#collage #content table.torrent_table tr[class~="discog"], table.border tr { border-left: 1px #757575 solid; border-right: 1px #757575 solid; diff --git a/sass/orpheus_paper/style.scss b/sass/orpheus_paper/style.scss index 48ada772f..ee6d2f57a 100644 --- a/sass/orpheus_paper/style.scss +++ b/sass/orpheus_paper/style.scss @@ -34,6 +34,7 @@ variables.$back-700: #9A9E9F; variables.$back-800: #8D9091; variables.$back-900: #808384; variables.$back-1000: #727576; + $back-800-low: #8D909155; // Mids @@ -106,12 +107,15 @@ variables.$ds-neutral-000: #000; variables.$ds-red: #a41610; variables.$ds-green: #11890e; variables.$ds-yellow: #c9a612; + $ds-orange: #ff8c00; variables.$ds-fx-low: rgb(0 0 0 / 15%); variables.$ds-fx-mid: rgb(0 0 0 / 22.5%); + $ds-fx-blue: hsl(215deg 90% 56% / 30%); variables.$ds-gray-05: hsl(178deg 100% 5.1%); -$ds-gray-13: hsl(180deg 11% 13%); //goes nowhere does nothing; + +$ds-gray-13: hsl(180deg 11% 13%); // goes nowhere does nothing; $ds-gray-52: hsl(181deg 3.5% 52%); $ds-gray-72: hsl(183deg 4% 72%); $ds-gray-99: hsl(120deg 100% 99.6%); @@ -147,9 +151,9 @@ variables.$color-text-anchor-hover: $blue-800; variables.$color-text-anchor: $blue-700; variables.$color-text-base: $neutral-1000; variables.$color-text-bold: $neutral-1100; -variables.$color-text-button: variables.$ds-gray-05; //xx checkme +variables.$color-text-button: variables.$ds-gray-05; // xx checkme variables.$color-text-footer: variables.$ds-neutral-300; -variables.$color-text-heading-anchor: $blue-700; //x +variables.$color-text-heading-anchor: $blue-700; // x variables.$color-text-heading: variables.$fore-700; variables.$color-text-important-alt: variables.$ds-green; variables.$color-text-important: variables.$ds-red; @@ -157,7 +161,7 @@ variables.$color-text-input: variables.$fore-600; // for pre-populated inputs variables.$color-text-input-active: variables.$fore-900; variables.$color-text-linkbox: $blue-700; // links in linkbox variables.$color-text-menu: $ds-gray-99; // new -variables.$color-text-menu-hover: $ds-gray-99; //new // during pulldown +variables.$color-text-menu-hover: $ds-gray-99; // new // during pulldown variables.$color-text-mono: variables.$fore-500; variables.$color-text-popup-anchor-hover: $blue-800; variables.$color-text-popup-anchor: $blue-700; @@ -165,8 +169,8 @@ variables.$color-text-popup: $neutral-1000; variables.$color-text-ratio-greenzone: variables.$ds-green; variables.$color-text-ratio-redzone: variables.$ds-red; variables.$color-text-ratio-yellowzone: variables.$ds-yellow; -variables.$color-text-span-blue: hsl(235deg 90% 55%); //x lower -variables.$color-text-span-green: hsl(145deg 90% 35%); //x lower +variables.$color-text-span-blue: hsl(235deg 90% 55%); // x lower +variables.$color-text-span-green: hsl(145deg 90% 35%); // x lower variables.$color-text-span-red: variables.$ds-red; variables.$color-text-table-discog-titles: variables.$fore-300; variables.$color-text-tooltipster: variables.$fore-700; @@ -191,7 +195,7 @@ variables.$color-menu-fx-selection: variables.$ds-fx-menutheme; variables.$color-mobilemenu-userinfo-1: variables.$menutheme-400; // mobile pulldown menu gradient 1 variables.$color-mobilemenu-userinfo-2: variables.$menutheme-900; // mobile pulldown menu gradient 2 variables.$color-mobilemenu-closed: $mid-700; // rules, also mobile menu header -variables.$color-mobilemenu-shadow: $mid-500; //mobile menu +variables.$color-mobilemenu-shadow: $mid-500; // mobile menu variables.$color-obj-button-base-1: $ds-gray-72; variables.$color-obj-button-base-2: $ds-gray-52; diff --git a/sass/post_office/style.scss b/sass/post_office/style.scss index 10247889b..c55aa448c 100644 --- a/sass/post_office/style.scss +++ b/sass/post_office/style.scss @@ -1,4 +1,4 @@ -@import url(https://fonts.googleapis.com/css?family=Lato:400,900italic,900,700italic,700,400italic,300italic,300,100italic,100); +@import "https://fonts.googleapis.com/css?family=Lato:400,900italic,900,700italic,700,400italic,300italic,300,100italic,100"; /* apollo-theme-post-office: A continuation of the original wcd-theme-post-office by dannymichel, with various fixes and updated image resources for apollo.rip. @@ -108,61 +108,61 @@ a[onclick]:active { outline: 0; } -a[onclick^=AddArtistField]:focus, -a[onclick^=AddArtistField]:active { +a[onclick^="AddArtistField"]:focus, +a[onclick^="AddArtistField"]:active { outline: 0; background: transparent !important; padding: 0 !important; } -.main_column a[href^=http], -.main_column a[href^=https] { +.main_column a[href^="http"], +.main_column a[href^="https"] { padding: 0 10px 0 0; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABaSURBVHjaYtw8veA/A3bAiMTGpYaBiYE4wIhLgoUYRUjy/8l1AQOlXsAZDkxkaGZE9i4TGZpR2ExkaoaLMREZfYyUBCLe6GWhIAb/0z0d0MYAFmJyHE1dABgAgSsK5KjVfSUAAAAASUVORK5CYII=") 100% 4px no-repeat; background-size: 8px 8px; } -.main_column a[href^=http]:hover, -.main_column a[href^=https]:hover { +.main_column a[href^="http"]:hover, +.main_column a[href^="https"]:hover { padding: 0 10px 0 0; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABaSURBVHjaYtw8veA/A3bAiMTGpYaBiYE4wIhLgoUYRUjy/8l1AQOlXsAZDkxkaGZE9i4TGZpR2ExkaoaLMREZfYyUBCLe6GWhIAb/0z0d0MYAFmJyHE1dABgAgSsK5KjVfSUAAAAASUVORK5CYII=") 100% 4px no-repeat !important; background-size: 8px 8px !important; } -.forum_post a[href^=http], -.forum_post a[href^=https] { +.forum_post a[href^="http"], +.forum_post a[href^="https"] { padding: 0 10px 0 0; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABaSURBVHjaYtw8veA/A3bAiMTGpYaBiYE4wIhLgoUYRUjy/8l1AQOlXsAZDkxkaGZE9i4TGZpR2ExkaoaLMREZfYyUBCLe6GWhIAb/0z0d0MYAFmJyHE1dABgAgSsK5KjVfSUAAAAASUVORK5CYII=") 100% 4px no-repeat; background-size: 8px 8px; } -.forum_post a[href^=http]:hover, -.forum_post a[href^=https]:hover { +.forum_post a[href^="http"]:hover, +.forum_post a[href^="https"]:hover { padding: 0 10px 0 0; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABaSURBVHjaYtw8veA/A3bAiMTGpYaBiYE4wIhLgoUYRUjy/8l1AQOlXsAZDkxkaGZE9i4TGZpR2ExkaoaLMREZfYyUBCLe6GWhIAb/0z0d0MYAFmJyHE1dABgAgSsK5KjVfSUAAAAASUVORK5CYII=") 100% 4px no-repeat; background-size: 8px 8px; } -.head a[href^=http]:hover, -.head a[href^=https]:hover, -.colhead a[href^=http]:hover, -.colhead a[href^=https]:hover, -.colhead_dark a[href^=http]:hover, -.colhead_dark a[href^=https]:hover { +.head a[href^="http"]:hover, +.head a[href^="https"]:hover, +.colhead a[href^="http"]:hover, +.colhead a[href^="https"]:hover, +.colhead_dark a[href^="http"]:hover, +.colhead_dark a[href^="https"]:hover { padding: 0 10px 0 0; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABaSURBVHjaYtw8veA/A3bAiMTGpYaBiYE4wIhLgoUYRUjy/8l1AQOlXsAZDkxkaGZE9i4TGZpR2ExkaoaLMREZfYyUBCLe6GWhIAb/0z0d0MYAFmJyHE1dABgAgSsK5KjVfSUAAAAASUVORK5CYII=") 100% 4px no-repeat; background-size: 8px 8px; } -.forum_post a[href^=http] img, -.forum_post a[href^=https] img { +.forum_post a[href^="http"] img, +.forum_post a[href^="https"] img { padding: 0; background: transparent !important; border: none; } -.forum_post a[href^=http] img:hover, -.forum_post a[href^=https] img:hover { +.forum_post a[href^="http"] img:hover, +.forum_post a[href^="https"] img:hover { padding: 0; background: transparent !important; border: none; @@ -300,7 +300,7 @@ ul.thin li { } #alerts { - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); + box-shadow: 0 1px 3px rgb(0 0 0 / 50%); position: absolute; top: 10px; width: 372px; @@ -368,7 +368,7 @@ div#wrapper div#content td.label { font-size: 11pt; background: #262626; width: 100%; - box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.25); + box-shadow: 0 -1px 3px 0 rgb(0 0 0 / 25%); text-align: center; margin-top: 8px; } @@ -610,7 +610,7 @@ table.no_grouping > tbody > tr.colhead > td:first-child + td { div#flip_view_1 div#similar-artist .name { border: 1px solid #999999; - background: rgba(68, 68, 68, 0.5); + background: rgb(68 68 68 / 50%); padding: 2px 4px; } @@ -1303,8 +1303,8 @@ ul .invitetree { z-index: -1; } -input[type=button], -input[type=submit] { +input[type="button"], +input[type="submit"] { background: #373737; display: inline-block; padding: 8px; @@ -1317,24 +1317,24 @@ input[type=submit] { transition: background-color 0.2s; } -input[type=button]:hover, -input[type=submit]:hover { +input[type="button"]:hover, +input[type="submit"]:hover { background-color: #444; } -input[type=button]:active, -input[type=button]:focus, -input[type=submit]:active, -input[type=submit]:focus { +input[type="button"]:active, +input[type="button"]:focus, +input[type="submit"]:active, +input[type="submit"]:focus { background-color: #333; - box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15); + box-shadow: inset 0 2px 4px rgb(0 0 0 / 15%); outline: 0; } -input[type=text], -input[type=email], -input[type=password], -input[type=search] { +input[type="text"], +input[type="email"], +input[type="password"], +input[type="search"] { background: #373737; display: inline-block; padding: 8px; @@ -1347,39 +1347,39 @@ input[type=search] { transition: all 0.2s; } -input[type=text]:hover, -input[type=email]:hover, -input[type=password]:hover, -input[type=search]:hover { +input[type="text"]:hover, +input[type="email"]:hover, +input[type="password"]:hover, +input[type="search"]:hover { color: #f7f7f7; } -input[type=text]:focus, -input[type=email]:focus, -input[type=password]:focus, -input[type=search]:focus { +input[type="text"]:focus, +input[type="email"]:focus, +input[type="password"]:focus, +input[type="search"]:focus { color: #f7f7f7; box-shadow: inset 0 -1px 0 #b39770; outline: 0; } -input[type=search] { +input[type="search"] { font-size: 13px; } -input[disabled=disabled] { +input[disabled="disabled"] { color: #5d5d5d; } -input[disabled=disabled]:hover, -input[disabled=disabled]:active, -input[disabled=disabled]:focus { +input[disabled="disabled"]:hover, +input[disabled="disabled"]:active, +input[disabled="disabled"]:focus { color: #5d5d5d; background: #373737; } -input[type=checkbox], -input[type=radio] { +input[type="checkbox"], +input[type="radio"] { vertical-align: middle; position: relative; bottom: 1px; @@ -1408,18 +1408,18 @@ textarea:focus { outline: 0; } -textarea[disabled=disabled] { +textarea[disabled="disabled"] { color: #5d5d5d; } -textarea[disabled=disabled]:hover, -textarea[disabled=disabled]:active, -textarea[disabled=disabled]:focus { +textarea[disabled="disabled"]:hover, +textarea[disabled="disabled"]:active, +textarea[disabled="disabled"]:focus { color: #5d5d5d; background: #373737; } -table.forum_post input[type=button] { +table.forum_post input[type="button"] { padding: 4px; margin: 0; } @@ -1443,17 +1443,17 @@ select:hover { select:active, select:focus { background-color: #333; - box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15); + box-shadow: inset 0 2px 4px rgb(0 0 0 / 15%); outline: 0; } -select[disabled=disabled] { +select[disabled="disabled"] { color: #5d5d5d; } -select[disabled=disabled]:hover, -select[disabled=disabled]:active, -select[disabled=disabled]:focus { +select[disabled="disabled"]:hover, +select[disabled="disabled"]:active, +select[disabled="disabled"]:focus { background: #373737; } @@ -1535,12 +1535,12 @@ tr.torrent .bookmark > a::after { background: #444; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #ECECEC; color: #444; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #0A84AF; } diff --git a/sass/postmod/style.scss b/sass/postmod/style.scss index ce9c6c031..41f50557a 100644 --- a/sass/postmod/style.scss +++ b/sass/postmod/style.scss @@ -466,7 +466,7 @@ ul.thin li { background: url('images/content_light.png') transparent; color: #FFF; border-radius: 4px; - box-shadow: 0 2px rgba(0, 0, 0, 0.5); + box-shadow: 0 2px rgb(0 0 0 / 50%); } #autocomplete { @@ -525,7 +525,7 @@ ul.thin li { #alerts { background: transparent url('images/content.png'); - box-shadow: 1px 3px rgba(0, 0, 0, 0.5); + box-shadow: 1px 3px rgb(0 0 0 / 50%); color: #FFF; margin: -151px 0 0 327px; padding: 4px 9px; @@ -592,7 +592,7 @@ table.no_grouping > tbody > tr.colhead > td:first-child + td { div#flip_view_1 div#similar-artist .name { border: 1px solid #0a84af; - background: rgba(239, 239, 239, 0.5); + background: rgb(239 239 239 / 50%); padding: 2px 4px; } @@ -709,7 +709,7 @@ table { width: 100%; border-collapse: collapse; border: none; - box-shadow: 1px 3px rgba(0, 0, 0, 0.6); + box-shadow: 1px 3px rgb(0 0 0 / 60%); } tr { @@ -1151,11 +1151,11 @@ input[type="submit"] { color: #fff; text-decoration: none; border-radius: 2px; - box-shadow: 1px 3px rgba(0, 0, 0, 0.5); + box-shadow: 1px 3px rgb(0 0 0 / 50%); border-left: 0; border-top: 0; border-right: 0; - border-bottom: 1px solid rgba(0, 0, 0, 0.25); + border-bottom: 1px solid rgb(0 0 0 / 25%); cursor: pointer; } @@ -1179,11 +1179,11 @@ input[type="submit"]:focus { color: #fff; text-decoration: none; border-radius: 2px; - box-shadow: 1px 3px rgba(0, 0, 0, 0.5); + box-shadow: 1px 3px rgb(0 0 0 / 50%); border-left: 0; border-top: 0; border-right: 0; - border-bottom: 1px solid rgba(0, 0, 0, 0.25); + border-bottom: 1px solid rgb(0 0 0 / 25%); cursor: pointer; } @@ -1232,14 +1232,14 @@ input[disabled="disabled"]:active { color: #DFDFDF; } -select[disabled=disabled] { +select[disabled="disabled"] { background: #4F4F4F; color: #DFDFDF; } -select[disabled=disabled]:hover, -select[disabled=disabled]:focus, -select[disabled=disabled]:active { +select[disabled="disabled"]:hover, +select[disabled="disabled"]:focus, +select[disabled="disabled"]:active { background-color: #4F4F4F; color: #DFDFDF; } @@ -1332,12 +1332,12 @@ tr.torrent .bookmark > a::after { background: #444; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #ECECEC; color: #444; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #0A84AF; } diff --git a/sass/proton/style.scss b/sass/proton/style.scss index fe3e63c26..5ba72f397 100644 --- a/sass/proton/style.scss +++ b/sass/proton/style.scss @@ -530,12 +530,12 @@ ul#userinfo_username { width: 100% !important; } -body:not(#requests):not(#friends) .box table:not(#vanityhouse) { +body:not(#requests, #friends) .box table:not(#vanityhouse) { margin: 0; background-color: white; } -body:not(#requests):not(#friends) .box h2 { +body:not(#requests, #friends) .box h2 { background: none; margin: 0; padding: 0; @@ -699,7 +699,7 @@ table { .torrentdetails blockquote { background-image: none; - background-color: rgba(255, 255, 255, 0.6); + background-color: rgb(255 255 255 / 60%); } .forum_post blockquote.spoiler, @@ -730,7 +730,7 @@ table { border-bottom-left-radius: 10px; border: 1px solid #d9d9d9; border-top-style: none !important; - box-shadow: -4px 1px 8px rgba(187, 215, 235, 0.8); + box-shadow: -4px 1px 8px rgb(187 215 235 / 80%); background-color: #F5F5F5; word-wrap: break-word; } @@ -1146,7 +1146,7 @@ tr.torrent .bookmark > a::after { div#flip_view_1 div#similar-artist .name { border: 1px solid #dcdcdc; - background: rgba(240, 240, 240, 0.5); + background: rgb(240 240 240 / 50%); padding: 2px 4px; } @@ -2026,7 +2026,7 @@ tr.torrent .bookmark > a::after { width: 600px; } -div[class~=tooltipster-base] { +div[class~="tooltipster-base"] { background-color: #F5F5F5; color: #575757; } diff --git a/sass/reportauto/style.scss b/sass/reportauto/style.scss index cffdd873c..79092d09a 100644 --- a/sass/reportauto/style.scss +++ b/sass/reportauto/style.scss @@ -4,11 +4,11 @@ display: none; } -.auto_reports input[type=checkbox].expand_checkbox:checked + .expand_block { +.auto_reports input[type="checkbox"].expand_checkbox:checked + .expand_block { display: revert; } -.auto_reports input[type=checkbox].expand_checkbox:checked + .add_comment.expand_block { +.auto_reports input[type="checkbox"].expand_checkbox:checked + .add_comment.expand_block { display: grid; } @@ -115,7 +115,7 @@ table.auto_reports_top_box ul { grid-area: add_comment; grid-template-columns: 1fr auto; - & input[type=submit] { + & input[type="submit"] { padding: 0 1em 0 1em; margin-left: 0.5em; } diff --git a/sass/tooltipster/style.scss b/sass/tooltipster/style.scss index 622abe88a..585d4e05b 100644 --- a/sass/tooltipster/style.scss +++ b/sass/tooltipster/style.scss @@ -229,7 +229,7 @@ } .gold_theme .tooltipster-arrow > span + span { - border-top-color: rgb(255, 228, 81) !important; + border-top-color: rgb(255 228 81) !important; } /* Use this next selector to style things like font-size and line-height: */ diff --git a/sass/xanax_cake/style.scss b/sass/xanax_cake/style.scss index df1501c9f..283807663 100644 --- a/sass/xanax_cake/style.scss +++ b/sass/xanax_cake/style.scss @@ -342,6 +342,7 @@ ul.thin li { #cat-selector ul li { display: inline; + // float: left; // height: 1em; // width: 12em; @@ -373,7 +374,7 @@ ul.thin li { div#flip_view_1 div#similar-artist .name { border: 1px solid #666666; - background: rgba(225, 225, 225, 0.5); + background: rgb(225 225 225 / 50%); padding: 2px 4px; } @@ -907,7 +908,7 @@ tr.torrent .bookmark > a::after { font-weight: normal; } -div[class~=tooltipster-content] > a { +div[class~="tooltipster-content"] > a { color: #AAAAAA; }