Just code style (CSS)
This commit is contained in:
nobody
parent
a6b03e177b
commit
25a8a0499c
|
|
@ -0,0 +1,7 @@
|
|||
--ignore = bulletproof-font-face,
|
||||
important,
|
||||
ids,
|
||||
box-sizing,
|
||||
fallback-colors,
|
||||
universal-selector,
|
||||
box-model,
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
{
|
||||
"rules": {
|
||||
"at-rule-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
except: ["blockless-after-same-name-blockless", "first-nested"],
|
||||
ignore: ["after-comment"],
|
||||
},
|
||||
],
|
||||
"at-rule-name-case": "lower",
|
||||
"at-rule-name-space-after": "always-single-line",
|
||||
"at-rule-semicolon-newline-after": "always",
|
||||
"block-closing-brace-empty-line-before": "never",
|
||||
"block-closing-brace-newline-after": "always",
|
||||
"block-closing-brace-newline-before": "always-multi-line",
|
||||
"block-closing-brace-space-before": "always-single-line",
|
||||
"block-opening-brace-newline-after": "always-multi-line",
|
||||
"block-opening-brace-space-after": "always-single-line",
|
||||
"block-opening-brace-space-before": "always",
|
||||
"color-hex-case": "lower",
|
||||
"color-hex-length": "short",
|
||||
"comment-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
except: ["first-nested"],
|
||||
ignore: ["stylelint-commands"],
|
||||
},
|
||||
],
|
||||
"comment-whitespace-inside": "always",
|
||||
"custom-property-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
except: ["after-custom-property", "first-nested"],
|
||||
ignore: ["after-comment", "inside-single-line-block"],
|
||||
},
|
||||
],
|
||||
"declaration-bang-space-after": "never",
|
||||
"declaration-bang-space-before": "always",
|
||||
"declaration-block-semicolon-newline-after": "always-multi-line",
|
||||
"declaration-block-semicolon-space-after": "always-single-line",
|
||||
"declaration-block-semicolon-space-before": "never",
|
||||
"declaration-block-single-line-max-declarations": 1,
|
||||
"declaration-block-trailing-semicolon": "always",
|
||||
"declaration-colon-newline-after": "always-multi-line",
|
||||
"declaration-colon-space-after": "always-single-line",
|
||||
"declaration-colon-space-before": "never",
|
||||
"declaration-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
except: ["after-declaration", "first-nested"],
|
||||
ignore: ["after-comment", "inside-single-line-block"],
|
||||
},
|
||||
],
|
||||
"function-comma-newline-after": "always-multi-line",
|
||||
"function-comma-space-after": "always-single-line",
|
||||
"function-comma-space-before": "never",
|
||||
"function-max-empty-lines": 0,
|
||||
"function-name-case": "lower",
|
||||
"function-parentheses-newline-inside": "always-multi-line",
|
||||
"function-parentheses-space-inside": "never-single-line",
|
||||
"function-whitespace-after": "always",
|
||||
indentation: 4,
|
||||
"length-zero-no-unit": true,
|
||||
"max-empty-lines": 1,
|
||||
"media-feature-colon-space-after": "always",
|
||||
"media-feature-colon-space-before": "never",
|
||||
"media-feature-name-case": "lower",
|
||||
"media-feature-parentheses-space-inside": "never",
|
||||
"media-feature-range-operator-space-after": "always",
|
||||
"media-feature-range-operator-space-before": "always",
|
||||
"media-query-list-comma-newline-after": "always-multi-line",
|
||||
"media-query-list-comma-space-after": "always-single-line",
|
||||
"media-query-list-comma-space-before": "never",
|
||||
"no-eol-whitespace": true,
|
||||
"no-missing-end-of-source-newline": true,
|
||||
"number-leading-zero": "always",
|
||||
"number-no-trailing-zeros": true,
|
||||
"property-case": "lower",
|
||||
"rule-empty-line-before": [
|
||||
"always-multi-line",
|
||||
{
|
||||
except: ["first-nested"],
|
||||
ignore: ["after-comment"],
|
||||
},
|
||||
],
|
||||
"selector-attribute-brackets-space-inside": "never",
|
||||
"selector-attribute-operator-space-after": "never",
|
||||
"selector-attribute-operator-space-before": "never",
|
||||
"selector-combinator-space-after": "always",
|
||||
"selector-combinator-space-before": "always",
|
||||
"selector-descendant-combinator-no-non-space": true,
|
||||
"selector-list-comma-newline-after": "always-multi-line",
|
||||
"selector-list-comma-space-after": "always-single-line",
|
||||
"selector-list-comma-space-before": "never",
|
||||
"selector-max-empty-lines": 0,
|
||||
"selector-pseudo-class-case": "lower",
|
||||
"selector-pseudo-class-parentheses-space-inside": "never",
|
||||
"selector-pseudo-element-case": "lower",
|
||||
"selector-pseudo-element-colon-notation": "double",
|
||||
"selector-type-case": "lower",
|
||||
"unit-case": "lower",
|
||||
"value-keyword-case": "lower",
|
||||
"value-list-comma-newline-after": "always-multi-line",
|
||||
"value-list-comma-space-after": "always-single-line",
|
||||
"value-list-comma-space-before": "never",
|
||||
"value-list-max-empty-lines": 0,
|
||||
}
|
||||
}
|
||||
142
pages/base.css
142
pages/base.css
|
|
@ -1,15 +1,18 @@
|
|||
a {
|
||||
color: #555;
|
||||
background: url('../../icons/link-dark.svg') no-repeat right center;
|
||||
background-size: 10px 10px;
|
||||
color: #777;
|
||||
padding-right: 13px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
filter: invert(0.5);
|
||||
text-decoration: none;
|
||||
background: url('../../icons/link-light.svg') no-repeat right center;
|
||||
background-size: 10px 10px;
|
||||
color: #c4c4c4;
|
||||
cursor: pointer;
|
||||
filter: invert(0.2);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.no-icon {
|
||||
|
|
@ -17,17 +20,17 @@ a:hover {
|
|||
}
|
||||
|
||||
#button-copy-rule-set, textarea {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#button-copy-rule-set {
|
||||
display: none;
|
||||
padding: 5px;
|
||||
font-size: 1.3em;
|
||||
line-height: 2;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
@ -50,20 +53,20 @@ textarea {
|
|||
}
|
||||
|
||||
.btns {
|
||||
padding: 5px 10px;
|
||||
background-color: #f0f0f0;
|
||||
text-align: center;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #aeaeae;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
font-size: 1em;
|
||||
line-height: 1.5;
|
||||
padding: 5px 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btns:hover {
|
||||
cursor: pointer;
|
||||
background-color: #c1c1c1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btns-active {
|
||||
|
|
@ -71,82 +74,78 @@ textarea {
|
|||
color: #515151 !important;
|
||||
}
|
||||
|
||||
/**
|
||||
* Checkboxes, Radiobuttons
|
||||
*/
|
||||
|
||||
.b-contain *, .b-contain *::before, .b-contain *::after {
|
||||
box-sizing: content-box !important;
|
||||
}
|
||||
|
||||
.b-contain input {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.b-contain span {
|
||||
font-size: 12px;
|
||||
font-family: inherit;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.b-contain {
|
||||
display: table;
|
||||
position: relative;
|
||||
padding-left: 25px;
|
||||
cursor: pointer;
|
||||
display: table;
|
||||
line-height: 1.2;
|
||||
padding-left: 25px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.b-contain input[type="checkbox"] ~ .b-input {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
background: rgba(241, 245, 248, 1);
|
||||
transition: background 250ms;
|
||||
border: 1px solid rgba(184, 194, 204, 1);
|
||||
border-radius: 2px;
|
||||
height: 16px;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transition: background 250ms;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.b-contain input[type="radio"] ~ .b-input {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
background: rgba(241, 245, 248, 1);
|
||||
transition: background 250ms;
|
||||
border: 1px solid rgba(184, 194, 204, 1);
|
||||
border-radius: 10px;
|
||||
height: 16px;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transition: background 250ms;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.b-contain input[type="checkbox"] ~ .b-input::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 5px;
|
||||
top: 1px;
|
||||
width: 4px;
|
||||
height: 10px;
|
||||
border: solid rgba(255, 255, 255, 1);
|
||||
border-width: 0 2px 2px 0;
|
||||
transition: background 250ms;
|
||||
content: '';
|
||||
display: none;
|
||||
height: 10px;
|
||||
left: 5px;
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
transform: rotate(45deg);
|
||||
transition: background 250ms;
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.b-contain input[type="radio"] ~ .b-input::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 4px;
|
||||
background: rgba(255, 255, 255, 1);
|
||||
border-radius: 4px;
|
||||
content: '';
|
||||
display: none;
|
||||
height: 8px;
|
||||
left: 4px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
transition: background 250ms;
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.b-contain input:disabled ~ .b-input::after {
|
||||
|
|
@ -163,7 +162,7 @@ textarea {
|
|||
}
|
||||
|
||||
.b-contain input:focus ~ .b-input {
|
||||
box-shadow: 0 0 0 2px rgba(52,144,220,0.5);
|
||||
box-shadow: 0 0 0 2px rgba(52, 144, 220, 0.5);
|
||||
}
|
||||
|
||||
.b-contain input:checked ~ .b-input {
|
||||
|
|
@ -174,15 +173,15 @@ textarea {
|
|||
.b-contain input[type="checkbox"]:disabled ~ .b-input {
|
||||
background: rgba(241, 245, 248, 1);
|
||||
border-color: rgba(184, 194, 204, 1);
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.b-contain input[type="radio"]:disabled ~ .b-input {
|
||||
background: rgba(241, 245, 248, 1);
|
||||
border-color: rgba(184, 194, 204, 1);
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.b-contain input[type="radio"]:disabled ~ .b-input::after {
|
||||
|
|
@ -195,21 +194,21 @@ textarea {
|
|||
}
|
||||
|
||||
.b-contain .b-input::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
margin-left: -0.85rem;
|
||||
margin-top: -0.85rem;
|
||||
background: rgba(0, 130, 243, 1);
|
||||
border-radius: 2rem;
|
||||
opacity: .6;
|
||||
z-index: 99999;
|
||||
content: '';
|
||||
display: block;
|
||||
height: 3rem;
|
||||
left: 0;
|
||||
margin-left: -0.85rem;
|
||||
margin-top: -0.85rem;
|
||||
opacity: 0.6;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transform: scale(0);
|
||||
visibility: hidden;
|
||||
width: 3rem;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
.b-contain input + .b-input::before {
|
||||
|
|
@ -230,14 +229,15 @@ textarea {
|
|||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
a {
|
||||
color: #f2f2f2;
|
||||
font-weight: bold;
|
||||
background: url('../../icons/link-light.svg') no-repeat right center;
|
||||
background-size: 10px 10px;
|
||||
padding-right:13px;
|
||||
color: #f2f2f2;
|
||||
font-weight: bold;
|
||||
padding-right: 13px;
|
||||
}
|
||||
a:hover{
|
||||
background: url('../../icons/link-dark.svg') no-repeat right center;
|
||||
|
||||
a:hover {
|
||||
background: url('../../icons/link-dark.svg') no-repeat right center; /* csslint allow: duplicate-background-images */
|
||||
background-size: 10px 10px;
|
||||
}
|
||||
|
||||
|
|
@ -272,18 +272,18 @@ textarea {
|
|||
}
|
||||
|
||||
.important > p > a {
|
||||
color: #555;
|
||||
background: url('../../icons/link-dark.svg') no-repeat right center;
|
||||
background: url('../../icons/link-dark.svg') no-repeat right center; /* csslint allow: duplicate-background-images */
|
||||
background-size: 10px 10px;
|
||||
color: #555;
|
||||
font-weight: normal;
|
||||
padding-right: 13px;
|
||||
text-decoration: underline;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.important > p > a:hover {
|
||||
color: #777;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btns {
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
}
|
||||
|
||||
.div-donations {
|
||||
border-radius: 4px;
|
||||
border: 1px solid lightgrey;
|
||||
border-radius: 4px;
|
||||
line-break: anywhere;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 3em 1em;
|
||||
border-collapse: separate;
|
||||
border-spacing: 3em 1em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,31 +1,27 @@
|
|||
/**
|
||||
* Sections
|
||||
*/
|
||||
|
||||
body {
|
||||
color: #555;
|
||||
cursor: default;
|
||||
font-family: 'Noto Sans', Arial, sans-serif !important;
|
||||
font-size: 14px;
|
||||
margin-top: -15px;
|
||||
padding: 10px !important;
|
||||
max-width: 800px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: -15px;
|
||||
max-width: 800px;
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.option-buttons {
|
||||
border: none;
|
||||
padding: 5px 10px;
|
||||
margin: 5px 10px;
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-weight: normal;
|
||||
margin: 5px 10px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.option-buttons-active {
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #555;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.option-buttons:hover {
|
||||
|
|
@ -60,8 +56,8 @@ body {
|
|||
}
|
||||
|
||||
.without-checkbox {
|
||||
margin: 0px !important;
|
||||
padding: 0px !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
#advanced-tab, #export-import-tab, #info-tab {
|
||||
|
|
@ -78,8 +74,8 @@ body {
|
|||
|
||||
.div-selected-icon {
|
||||
margin-top: 10px;
|
||||
padding-right: 25px;
|
||||
min-width: 113px;
|
||||
padding-right: 25px;
|
||||
}
|
||||
|
||||
.div-selected-icon > label {
|
||||
|
|
@ -99,90 +95,68 @@ body {
|
|||
font-style: normal;
|
||||
}
|
||||
|
||||
/**
|
||||
* Fonts
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans.woff2')
|
||||
format('woff2');
|
||||
src: url('../../modules/noto-sans/noto-sans.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: url('../../modules/noto-sans/noto-sans-bold.woff2')
|
||||
format('woff2');
|
||||
src: url('../../modules/noto-sans/noto-sans-bold.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans-italic.woff2')
|
||||
format('woff2');
|
||||
src: url('../../modules/noto-sans/noto-sans-italic.woff2') format('woff2');
|
||||
}
|
||||
|
||||
/**
|
||||
* Titles
|
||||
*/
|
||||
|
||||
.title-option {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/**
|
||||
* Controls
|
||||
*/
|
||||
|
||||
.input-text {
|
||||
border-radius: 3px;
|
||||
border: 1px solid darkgrey;
|
||||
padding: 5px !important;
|
||||
margin-top: 10px !important;
|
||||
border-radius: 3px;
|
||||
color: #555;
|
||||
margin-top: 10px !important;
|
||||
padding: 5px !important;
|
||||
}
|
||||
|
||||
/**
|
||||
* Icons
|
||||
*/
|
||||
|
||||
.options-help-icon {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
background-image: url("../../icons/help-dark.svg");
|
||||
background-size: contain;
|
||||
background-position: left;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
height: 15px;
|
||||
margin-left: 5px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Buttons
|
||||
*/
|
||||
|
||||
.button {
|
||||
-moz-user-select: none;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #cfcfcf;
|
||||
border-radius: 2px;
|
||||
color: #5f5f5f;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
font-size: 12px;
|
||||
outline: 0;
|
||||
padding: 5px 22px;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.button-warning {
|
||||
|
|
@ -218,9 +192,9 @@ body {
|
|||
}
|
||||
|
||||
.div-badge {
|
||||
border-left: 1px solid #bbb;
|
||||
margin-top: 10px;
|
||||
padding-left: 30px;
|
||||
border-left: 1px solid #bbb;
|
||||
}
|
||||
|
||||
#badge-preview-top {
|
||||
|
|
@ -229,20 +203,20 @@ body {
|
|||
}
|
||||
|
||||
#counter-preview-badge {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: -5px;
|
||||
color: white;
|
||||
background: black;
|
||||
padding: 1px 6px;
|
||||
font-size: 10px;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
font-size: 10px;
|
||||
padding: 1px 6px;
|
||||
position: absolute;
|
||||
right: -5px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#pre-badged-background-color, #pre-badged-text-color {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-right: 5px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
#icon-badge-preview {
|
||||
|
|
@ -250,14 +224,14 @@ body {
|
|||
}
|
||||
|
||||
.colorpicker {
|
||||
display: flex;
|
||||
padding-bottom: 5px;
|
||||
margin-top: 10px;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
margin-top: 10px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.colorpicker > input {
|
||||
margin-top: 0px !important;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
div[class="color-picker:a"] {
|
||||
|
|
@ -273,24 +247,20 @@ div[class="color-picker:a"] {
|
|||
}
|
||||
|
||||
.img-restore-color {
|
||||
margin-left: 5px;
|
||||
height: 15px;
|
||||
cursor: pointer;
|
||||
height: 15px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.import-export > input[type="button"] {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Miscellaneous
|
||||
*/
|
||||
|
||||
.description-option {
|
||||
color: #777;
|
||||
font-size: 12px;
|
||||
font-style: italic;
|
||||
padding-left: 25px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.badge {
|
||||
|
|
@ -307,7 +277,7 @@ div[class="color-picker:a"] {
|
|||
}
|
||||
|
||||
#negate-html-filter-list-warning {
|
||||
margin: 10px 0px 30px 0px;
|
||||
margin: 10px 0 30px 0;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
|
@ -343,24 +313,24 @@ div[class="color-picker:a"] {
|
|||
}
|
||||
|
||||
.ruleset-generator {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 5px 0px;
|
||||
display: flex;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.last-update {
|
||||
font-weight: 600;
|
||||
background-color: #ffa500;
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
padding: 3px 5px !important;
|
||||
text-transform: uppercase;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.storage-type {
|
||||
margin: 5px 0px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.option-disabled > .title-option > .b-contain,
|
||||
|
|
@ -387,15 +357,11 @@ div[class="color-picker:a"] {
|
|||
}
|
||||
|
||||
#tf-domains-allowlist-google-fonts {
|
||||
margin-top: 0px !important;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin-top: 0 !important;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Right to Left
|
||||
*/
|
||||
|
||||
body[dir="rtl"] .badge {
|
||||
margin-left: 0;
|
||||
margin-right: 6px;
|
||||
|
|
@ -417,19 +383,19 @@ body[dir="rtl"] .input-text {
|
|||
|
||||
.option-group {
|
||||
background-color: #e1e1e1;
|
||||
padding: 1.5rem;
|
||||
border-radius: 5px;
|
||||
margin: 20px 0px;
|
||||
margin: 20px 0;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.option-links {
|
||||
list-style-type: disclosure-closed;
|
||||
margin-top: 0;
|
||||
padding-top: 2rem;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.option-links > li {
|
||||
padding-bottom: .5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
|
|
@ -442,9 +408,10 @@ body[dir="rtl"] .input-text {
|
|||
.div-icons-badge-colors {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.div-badge {
|
||||
border: none;
|
||||
padding-left: 0px;
|
||||
padding-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,32 +8,32 @@ body {
|
|||
font-family: 'Noto Sans', Arial, sans-serif !important;
|
||||
font-size: 75%;
|
||||
margin: 0 auto;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
max-width: 348px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
header {
|
||||
align-items: center;
|
||||
border-bottom: solid #d3d3d3 1px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
padding: 8px 15px 8px 4px;
|
||||
justify-content: space-between;
|
||||
padding: 8px 15px 8px 4px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#manipulateDOM-indicator {
|
||||
background: url('../../icons/help-dark.svg') no-repeat right center;
|
||||
color: #555;
|
||||
background-size: 15px 15px;
|
||||
color: #555;
|
||||
padding-right: 20px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#manipulateDOM-indicator:hover {
|
||||
color: #777;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.panel {
|
||||
|
|
@ -41,16 +41,16 @@ header {
|
|||
}
|
||||
|
||||
.subpanel {
|
||||
padding-top: 8px;
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.panel-overflow {
|
||||
margin-left: 0;
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
margin-left: 0px;
|
||||
padding-left: 0px;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.subpanel:last-child {
|
||||
|
|
@ -59,15 +59,15 @@ header {
|
|||
}
|
||||
|
||||
.content {
|
||||
padding: 0px 15px;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
footer {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
padding: 8px 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#testing-utility {
|
||||
|
|
@ -83,38 +83,35 @@ footer {
|
|||
* Fonts
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans.woff2')
|
||||
format('woff2');
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: url('../../modules/noto-sans/noto-sans-bold.woff2')
|
||||
format('woff2');
|
||||
font-family: 'Noto Sans';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: url('../../modules/noto-sans/noto-sans-bold.woff2') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Noto Sans';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans-italic.woff2')
|
||||
format('woff2');
|
||||
font-family: 'Noto Sans';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: url('../../modules/noto-sans/noto-sans-italic.woff2') format('woff2');
|
||||
}
|
||||
|
||||
/**
|
||||
* Headings
|
||||
*/
|
||||
.heading {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
padding-left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -141,12 +138,12 @@ footer {
|
|||
border: 1px solid #e0e0e0;
|
||||
box-shadow: inset 0 2px 10px #e2e2e2;
|
||||
list-style: none;
|
||||
padding: 0px 0px 0px 8px;
|
||||
padding: 0 0 0 8px;
|
||||
}
|
||||
|
||||
.sublist:last-child {
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
margin-bottom: 0px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.sublist-item {
|
||||
|
|
@ -161,15 +158,15 @@ footer {
|
|||
}
|
||||
|
||||
#label-donate {
|
||||
margin: 0px 5px 0px 0px;
|
||||
margin: 0 5px 0 0;
|
||||
}
|
||||
|
||||
#get-more-injections-btn, #label-donate {
|
||||
cursor: pointer;
|
||||
background-color: #f0f0f0;
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
margin: 0px 5px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
#get-more-injections-btn:hover {
|
||||
|
|
@ -191,17 +188,19 @@ footer {
|
|||
* Buttons
|
||||
*/
|
||||
.button {
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #cfcfcf;
|
||||
border-radius: 2px;
|
||||
color: #5f5f5f;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
font-size: 12px;
|
||||
padding: 5px 22px;
|
||||
margin-left: 10px;
|
||||
padding: 5px 22px;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
|
|
@ -214,21 +213,23 @@ footer {
|
|||
|
||||
.button-svg {
|
||||
background-size: cover;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Donate
|
||||
*/
|
||||
#donate-button {
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
color: #5f5f5f;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
float: right;
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#donate-button:hover #donate-button-svg {
|
||||
|
|
@ -251,7 +252,7 @@ footer {
|
|||
}
|
||||
|
||||
#options-button:hover {
|
||||
filter: contrast(.5);
|
||||
filter: contrast(0.5);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -263,7 +264,7 @@ footer {
|
|||
}
|
||||
|
||||
#statistics-button:hover {
|
||||
filter: contrast(.5);
|
||||
filter: contrast(0.5);
|
||||
}
|
||||
|
||||
#statistics-button {
|
||||
|
|
@ -274,59 +275,61 @@ footer {
|
|||
* Toggles
|
||||
*/
|
||||
#protection-toggle, #manipulateDOM-toggle {
|
||||
-moz-user-select: none;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 40px;
|
||||
height: 18px;
|
||||
display: inline-block;
|
||||
height: 18px;
|
||||
position: relative;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.slider, .slider-disabled {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #b40000;
|
||||
-webkit-transition: .1s;
|
||||
transition: .1s;
|
||||
border-radius: 34px;
|
||||
background-color: #b40000;
|
||||
border-radius: 34px;
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
-webkit-transition: 0.1s;
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
.slider:before, .slider-disabled:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
left: 2px;
|
||||
bottom: 2px;
|
||||
background-color: #f9f9fa;
|
||||
-webkit-transition: .3s;
|
||||
transition: .3s;
|
||||
border-radius: 50%;
|
||||
.slider::before, .slider-disabled::before {
|
||||
background-color: #f9f9fa;
|
||||
border-radius: 50%;
|
||||
bottom: 2px;
|
||||
content: "";
|
||||
height: 14px;
|
||||
left: 2px;
|
||||
position: absolute;
|
||||
-webkit-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #6bb798;
|
||||
background-color: #6bb798;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(22px);
|
||||
-ms-transform: translateX(22px);
|
||||
transform: translateX(22px);
|
||||
input:checked + .slider::before {
|
||||
-webkit-transform: translateX(22px);
|
||||
-ms-transform: translateX(22px);
|
||||
transform: translateX(22px);
|
||||
}
|
||||
|
||||
.slider-disabled {
|
||||
|
|
@ -342,7 +345,6 @@ input:checked + .slider:hover {
|
|||
background-color: #4b806a;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Miscellaneous
|
||||
*/
|
||||
|
|
@ -379,7 +381,7 @@ input:checked + .slider:hover {
|
|||
.label-version {
|
||||
color: #6aac91;
|
||||
font-size: 9px;
|
||||
margin: 0px 0px 5px 2px;
|
||||
margin: 0 0 5px 2px;
|
||||
}
|
||||
|
||||
.label-domain {
|
||||
|
|
@ -397,13 +399,13 @@ input:checked + .slider:hover {
|
|||
}
|
||||
|
||||
#popup-incomplete-translation {
|
||||
width: 100%;
|
||||
color: white;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
background-color: #ffa500;
|
||||
padding: 0px;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -411,14 +413,12 @@ input:checked + .slider:hover {
|
|||
*/
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
|
||||
body {
|
||||
width: 348px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
|
||||
/**
|
||||
* Sections
|
||||
*/
|
||||
|
|
@ -435,10 +435,10 @@ input:checked + .slider:hover {
|
|||
#manipulateDOM-indicator {
|
||||
background: url('../../icons/help-light.svg') no-repeat right center;
|
||||
background-size: 15px 15px;
|
||||
padding-right: 20px;
|
||||
text-decoration: underline;
|
||||
color: #f2f2f2;
|
||||
font-weight: bold;
|
||||
padding-right: 20px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -505,8 +505,8 @@ input:checked + .slider:hover {
|
|||
background-color: #b54b4b;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
background-color: #323232;
|
||||
.slider::before {
|
||||
background-color: #323232;
|
||||
}
|
||||
|
||||
.slider-disabled {
|
||||
|
|
@ -514,14 +514,14 @@ input:checked + .slider:hover {
|
|||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.slider-disabled:before {
|
||||
.slider-disabled::before {
|
||||
background-color: #323232;
|
||||
}
|
||||
|
||||
#label-donate {
|
||||
cursor: pointer;
|
||||
background-color: #404040;
|
||||
color: #bbb;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -6,19 +6,19 @@ html {
|
|||
|
||||
body {
|
||||
background-color: #fafafa;
|
||||
-khtml-box-shadow: 10px 10px 60px #111;
|
||||
-moz-box-shadow: 10px 10px 60px #111;
|
||||
-webkit-box-shadow: 10px 10px 60px #111;
|
||||
box-shadow: 10px 10px 60px #111;
|
||||
box-sizing: border-box;
|
||||
color: #555;
|
||||
font-size: 14px;
|
||||
height: unset !important;
|
||||
margin: 0 auto;
|
||||
max-width: 982px;
|
||||
min-height: 100%;
|
||||
min-width: 256px;
|
||||
padding: 33px 18px;
|
||||
height: unset !important;
|
||||
-moz-box-shadow: 10px 10px 60px #111;
|
||||
-webkit-box-shadow: 10px 10px 60px #111;
|
||||
-khtml-box-shadow: 10px 10px 60px #111;
|
||||
box-shadow: 10px 10px 60px #111;
|
||||
}
|
||||
|
||||
h1 {
|
||||
|
|
@ -29,27 +29,27 @@ h1 {
|
|||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
display: block;
|
||||
height: 1px;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.btn-panel {
|
||||
cursor: default;
|
||||
display: flex;
|
||||
font-family: 'Noto Sans', Arial, sans-serif;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
max-width: 750px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.topic-badge {
|
||||
background-color: #fcfcfc;
|
||||
border-radius: 100px;
|
||||
border: 4px solid #e6e6e6;
|
||||
border-radius: 100px;
|
||||
color: #5a8f79;
|
||||
display: inline-block;
|
||||
font-size: 48px;
|
||||
|
|
@ -88,19 +88,19 @@ hr {
|
|||
}
|
||||
|
||||
.btn {
|
||||
color: #fff !important;
|
||||
font-weight: 600;
|
||||
margin: 15px;
|
||||
padding: 11px 17px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
background: 0 0;
|
||||
border-radius: 4px;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
-webkit-box-shadow: 0 5px 30px -5px rgba(0, 0, 0, 0.5), 0 5px 5px -5px #000;
|
||||
box-shadow: 0 5px 30px -5px rgba(0, 0, 0, 0.5), 0 5px 5px -5px #000;
|
||||
background: 0 0;
|
||||
color: #fff !important;
|
||||
font-weight: 600;
|
||||
margin: 15px;
|
||||
padding: 11px 17px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
|
|
@ -108,10 +108,10 @@ hr {
|
|||
}
|
||||
|
||||
.btn-text {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 40px;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.btn-gitlab {
|
||||
|
|
@ -170,10 +170,10 @@ hr {
|
|||
}
|
||||
|
||||
.uncle-sam, .we-need-you-title {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.uncle-sam {
|
||||
|
|
@ -206,15 +206,15 @@ hr {
|
|||
}
|
||||
|
||||
.btn {
|
||||
padding: 13px 18px 12px;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
max-width: 733px;
|
||||
padding: 13px 18px 12px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
width: 100%;
|
||||
min-height: unset;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
*/
|
||||
|
||||
.release-date {
|
||||
font-weight: bold;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
ul {
|
||||
|
|
@ -16,7 +16,7 @@ ul {
|
|||
*/
|
||||
|
||||
input[type=radio] {
|
||||
margin: 0px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
label {
|
||||
|
|
@ -28,8 +28,8 @@ input[type=radio], label {
|
|||
}
|
||||
|
||||
.ruleset-generator {
|
||||
margin-top: 10px;
|
||||
display: inline-flex;
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue