diff --git a/.stylelintrc.yml b/.stylelintrc.yml index 8c5a541d7..88d9feb3e 100644 --- a/.stylelintrc.yml +++ b/.stylelintrc.yml @@ -1,13 +1,9 @@ extends: "stylelint-config-standard" rules: - at-rule-empty-line-before: null at-rule-no-unknown: [true, ignoreAtRules: [extend, include, mixin]] - color-hex-case: null - color-hex-length: null - comment-empty-line-before: null - comment-whitespace-inside: null - custom-property-empty-line-before: null - declaration-colon-space-after: null + block-opening-brace-space-before: null + declaration-block-single-line-max-declarations: null declaration-empty-line-before: null no-descending-specificity: null - selector-list-comma-newline-after: always-multi-line + selector-descendant-combinator-no-non-space: null + selector-list-comma-newline-after: null diff --git a/app/javascript/src/styles/base/000_vars.scss b/app/javascript/src/styles/base/000_vars.scss index 9daa1fc4e..c7150029e 100644 --- a/app/javascript/src/styles/base/000_vars.scss +++ b/app/javascript/src/styles/base/000_vars.scss @@ -6,10 +6,10 @@ --text-lg: 1rem; // 16px --text-xl: 1.3125rem; // 21px --text-xxl: 1.75rem; // 28px - --header-font: Tahoma, Verdana, Helvetica, sans-serif; - --body-font: Verdana, Helvetica, sans-serif; + --header-font: "Tahoma", "Verdana", "Helvetica", sans-serif; + --body-font: "Verdana", "Helvetica", sans-serif; --monospace-font: 0.875rem monospace; // 14px - --arial-font: Arial, Helvetica, sans-serif; + --arial-font: "Arial", "Helvetica", sans-serif; } $h1_padding: 0.8em 0 0.25em 0; diff --git a/app/javascript/src/styles/base/010_reset.scss b/app/javascript/src/styles/base/010_reset.scss index 64d708b30..574b54f39 100644 --- a/app/javascript/src/styles/base/010_reset.scss +++ b/app/javascript/src/styles/base/010_reset.scss @@ -17,8 +17,6 @@ h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, cod margin: 0; padding: 0; border: 0; - /* font-weight: normal;*/ - /* font-style: normal;*/ font-size: 100%; line-height: 1.25em; font-family: inherit; diff --git a/app/javascript/src/styles/base/020_base.scss b/app/javascript/src/styles/base/020_base.scss index 40d5b479b..4aae77cb0 100644 --- a/app/javascript/src/styles/base/020_base.scss +++ b/app/javascript/src/styles/base/020_base.scss @@ -141,6 +141,7 @@ a.link-plain { .column-expand { flex: 1; } .column-shrink { flex: 0; } + @media (max-width: 660px) { display: block; } } @@ -172,6 +173,7 @@ ul.list-inline { .mobile-only { display: none !important; + @media (max-width: 660px) { display: initial !important; } } diff --git a/app/javascript/src/styles/common/autocomplete.scss b/app/javascript/src/styles/common/autocomplete.scss index 9da286985..d1a818596 100644 --- a/app/javascript/src/styles/common/autocomplete.scss +++ b/app/javascript/src/styles/common/autocomplete.scss @@ -21,8 +21,8 @@ } } - /* Display a red wavy underline beneath misspelled tags. */ - /* https://stackoverflow.com/a/28152272 */ + // Display a red wavy underline beneath misspelled tags. + // https://stackoverflow.com/a/28152272 li[data-autocomplete-type="tag-autocorrect"] .autocomplete-antecedent { position: relative; display: inline-block; diff --git a/app/javascript/src/styles/common/buttons.scss b/app/javascript/src/styles/common/buttons.scss index 5127d4cf2..640af3b09 100644 --- a/app/javascript/src/styles/common/buttons.scss +++ b/app/javascript/src/styles/common/buttons.scss @@ -39,11 +39,11 @@ a, button, input[type="submit"] { border: none; transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; - box-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 1px 5px 0px rgba(0,0,0,0.12); + box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); &:hover:not([disabled]) { background-color: var(--button-primary-hover-background-color); - box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12) + box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } &[disabled] { @@ -79,7 +79,7 @@ a, button, input[type="submit"] { /* A medium button. */ &.button-md { - padding: 0.50em 1em; + padding: 0.5em 1em; } /* A large button. */ diff --git a/app/javascript/src/styles/common/dtext.scss b/app/javascript/src/styles/common/dtext.scss index 0669d7fb0..3146a783e 100644 --- a/app/javascript/src/styles/common/dtext.scss +++ b/app/javascript/src/styles/common/dtext.scss @@ -75,7 +75,7 @@ div.prose { border-left: 3px solid var(--dtext-blockquote-border-color); blockquote { - opacity: 1.0; + opacity: 1; } } diff --git a/app/javascript/src/styles/common/utilities.scss b/app/javascript/src/styles/common/utilities.scss index 8afe09821..9d477a705 100644 --- a/app/javascript/src/styles/common/utilities.scss +++ b/app/javascript/src/styles/common/utilities.scss @@ -43,7 +43,7 @@ $spacer: 0.25rem; /* 4px */ .right-0\.5 { right: 0.5 * $spacer; } .rounded-sm { border-radius: 0.5 * $spacer; } -.rounded { border-radius: 1.0 * $spacer; } +.rounded { border-radius: 1 * $spacer; } .m-0 { margin: 0; } .m-px { margin: 1px; } diff --git a/app/javascript/src/styles/specific/common_tooltips.scss b/app/javascript/src/styles/specific/common_tooltips.scss index 68f8d976d..525aa19a7 100644 --- a/app/javascript/src/styles/specific/common_tooltips.scss +++ b/app/javascript/src/styles/specific/common_tooltips.scss @@ -13,12 +13,12 @@ div[data-tippy-root].tooltip-loading { /* bordered arrow styling; see https://github.com/atomiks/tippyjs/blob/master/src/scss/themes/light-border.scss */ &[data-placement^=bottom] { - > .tippy-arrow:before { + > .tippy-arrow::before { border-bottom-color: var(--post-tooltip-background-color); bottom: 16px; } - > .tippy-arrow:after { + > .tippy-arrow::after { border-bottom-color: var(--post-tooltip-border-color); border-width: 0 7px 7px; top: -8px; @@ -27,11 +27,11 @@ div[data-tippy-root].tooltip-loading { } &[data-placement^=top] { - > .tippy-arrow:before { + > .tippy-arrow::before { border-top-color: var(--post-tooltip-background-color); } - > .tippy-arrow:after { + > .tippy-arrow::after { border-top-color: var(--post-tooltip-border-color); border-width: 7px 7px 0; top: 17px; @@ -39,7 +39,7 @@ div[data-tippy-root].tooltip-loading { } } - > .tippy-arrow:after { + > .tippy-arrow::after { border-color: transparent; border-style: solid; content: ""; diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss index b3b8ea1ae..6e8b3ebf2 100644 --- a/app/javascript/src/styles/specific/posts.scss +++ b/app/javascript/src/styles/specific/posts.scss @@ -1,14 +1,14 @@ @keyframes heartbeat { 0% { - transform:scale(1); + transform: scale(1); } 50% { - transform:scale(1.3); + transform: scale(1.3); } 100% { - transform:scale(1); + transform: scale(1); } } diff --git a/app/javascript/src/styles/specific/related_tags.scss b/app/javascript/src/styles/specific/related_tags.scss index b9f88cd88..281c32a80 100644 --- a/app/javascript/src/styles/specific/related_tags.scss +++ b/app/javascript/src/styles/specific/related_tags.scss @@ -16,10 +16,9 @@ div.related-tags { } li.selected a { - /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke */ - /* https://caniuse.com/text-stroke */ + // https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke + // https://caniuse.com/text-stroke -webkit-text-stroke: 0.5px; - text-stroke: 0.5px; } /* On computers with a mouse, hide the related tag checkbox unless it's checked or hovered. */ diff --git a/app/javascript/src/styles/specific/user_tooltips.scss b/app/javascript/src/styles/specific/user_tooltips.scss index ce96b60f7..f090d5459 100644 --- a/app/javascript/src/styles/specific/user_tooltips.scss +++ b/app/javascript/src/styles/specific/user_tooltips.scss @@ -22,7 +22,7 @@ .user-tooltip-badge { color: var(--inverse-text-color); - font-size: 0.70em; + font-size: 0.7em; padding: 2px 4px; margin-right: 0.25em; border-radius: 3px; @@ -87,7 +87,7 @@ } .user-tooltip-stat-name { - font-size: 0.90em; + font-size: 0.9em; color: var(--muted-text-color); } } diff --git a/package.json b/package.json index 4dd233eb8..f6ba53ae8 100644 --- a/package.json +++ b/package.json @@ -52,7 +52,7 @@ }, "scripts": { "eslint-all": "yarn run eslint --plugin eslint-plugin-ignore-erb --ext .js,.js.erb app/javascript/src/javascripts", - "stylelint-all": "yarn run stylelint 'app/javascript/src/styles/**/*.scss'" + "stylelint-all": "yarn run stylelint 'app/**/*.scss'" }, "babel": { "presets": [