From 6102a3f6ae5b363a525ed70938e20deaab559c72 Mon Sep 17 00:00:00 2001 From: hanakin Date: Thu, 9 Mar 2017 16:34:17 -0500 Subject: [PATCH 01/16] [ticket/15115] Add .postcss-sorting.json file allow for editors to auto sort on save https://github.com/hudochenkov/postcss-sorting#usage PHPBB3-15115 --- .postcss-sorting.json | 241 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 241 insertions(+) create mode 100644 .postcss-sorting.json diff --git a/.postcss-sorting.json b/.postcss-sorting.json new file mode 100644 index 0000000000..af119c28c4 --- /dev/null +++ b/.postcss-sorting.json @@ -0,0 +1,241 @@ +{ + "order": [ + "custom-properties", + "dollar-variables", + "at-rules", + "declarations", + { + "type": "at-rule", + "name": "media" + }, + "rules" + ], + "properties-order": [ + { + "emptyLineBefore": false, + "properties": [ + "-moz-osx-font-smoothing", + "-webkit-font-smoothing", + "font", + "font-family", + "font-size", + "font-weight", + "font-style", + "font-variant", + "font-size-adjust", + "font-stretch", + "font-effect", + "font-emphasize", + "font-emphasize-position", + "font-emphasize-style", + "font-smooth", + "line-height", + "text-align", + "text-align-last", + "vertical-align", + "white-space", + "text-decoration", + "text-emphasis", + "text-emphasis-color", + "text-emphasis-style", + "text-emphasis-position", + "text-indent", + "text-justify", + "letter-spacing", + "word-spacing", + "writing-mode", + "text-outline", + "text-transform", + "text-wrap", + "text-overflow", + "text-overflow-ellipsis", + "text-overflow-mode", + "word-wrap", + "word-break", + "tab-size", + "hyphens" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "background", + "background-color", + "background-image", + "background-repeat", + "background-attachment", + "background-position", + "background-position-x", + "background-position-y", + "background-clip", + "background-origin", + "background-size", + "interpolation-mode", + "filter" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "border", + "border-width", + "border-style", + "border-color", + "border-top", + "border-top-width", + "border-top-style", + "border-top-color", + "border-right", + "border-right-width", + "border-right-style", + "border-right-color", + "border-bottom", + "border-bottom-width", + "border-bottom-style", + "border-bottom-color", + "border-left", + "border-left-width", + "border-left-style", + "border-left-color", + "border-radius", + "border-top-left-radius", + "border-top-right-radius", + "border-bottom-right-radius", + "border-bottom-left-radius", + "border-image", + "border-image-source", + "border-image-slice", + "border-image-width", + "border-image-outset", + "border-image-repeat", + "outline", + "outline-width", + "outline-style", + "outline-color", + "outline-offset" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "box-decoration-break", + "box-shadow", + "text-shadow" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "color", + "opacity" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "position", + "z-index", + "top", + "right", + "bottom", + "left" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "display", + "visibility", + "float", + "clear", + "overflow", + "overflow-x", + "overflow-y", + "clip", + "zoom", + "flex", + "flex-direction", + "flex-order", + "flex-pack", + "flex-align", + "flex-basis", + "flex-grow", + "flex-shrink", + "flex-wrap", + "justify-content", + "align-items", + "align-self" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "box-sizing", + "width", + "min-width", + "max-width", + "height", + "min-height", + "max-height", + "margin", + "margin-top", + "margin-right", + "margin-bottom", + "margin-left", + "padding", + "padding-top", + "padding-right", + "padding-bottom", + "padding-left" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "table-layout", + "empty-cells", + "caption-side", + "border-spacing", + "border-collapse", + "list-style", + "list-style-position", + "list-style-type", + "list-style-image" + ] + }, + { + "emptyLineBefore": false, + "properties": [ + "content", + "quotes", + "counter-reset", + "counter-increment", + "resize", + "cursor", + "user-select", + "nav-index", + "nav-up", + "nav-right", + "nav-down", + "nav-left", + "transition", + "transition-delay", + "transition-timing-function", + "transition-duration", + "transition-property", + "transform", + "transform-origin", + "animation", + "animation-name", + "animation-duration", + "animation-play-state", + "animation-timing-function", + "animation-delay", + "animation-iteration-count", + "animation-direction", + "pointer-events" + ] + } + ], + "unspecified-properties-position": "bottomAlphabetical" +} From 2ca1402476d821c8f15b4b6c71a2aa620948629e Mon Sep 17 00:00:00 2001 From: hanakin Date: Thu, 9 Mar 2017 16:34:53 -0500 Subject: [PATCH 02/16] [ticket/15115] Update stylelintrc & pkg.json files PHPBB3-15115 --- .stylelintrc | 780 ++++++++++++++++++++------------------------- phpBB/package.json | 4 +- 2 files changed, 346 insertions(+), 438 deletions(-) diff --git a/.stylelintrc b/.stylelintrc index b069001a95..094033df34 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,468 +1,376 @@ { - "rules": { - "color-hex-case": "lower", - "color-hex-length": "long", - "color-named": "never", - "color-no-invalid-hex": true, + "plugins": [ + "stylelint-order" + ], + "ignoreFiles": [ + "./phpBB/styles/prosilver/theme/normalize.css", + ], + "rules": { + "at-rule-name-case": "lower", + "at-rule-name-newline-after": "always-multi-line", + "at-rule-name-space-after": "always-single-line", + "at-rule-no-vendor-prefix": true, + "at-rule-semicolon-newline-after": "always", - "font-family-name-quotes": "always-where-recommended", + "block-closing-brace-newline-after": "always", + "block-closing-brace-newline-before": "always-multi-line", + "block-closing-brace-space-after": "always-single-line", + "block-closing-brace-space-before": "always-single-line", - "function-calc-no-unspaced-operator": true, - "function-comma-newline-after": "always-multi-line", - "function-comma-newline-before": "never-multi-line", - "function-comma-space-after": "always-single-line", - "function-comma-space-before": "never", - "function-linear-gradient-no-nonstandard-direction": true, - "function-max-empty-lines": 0, - "function-name-case": "lower", - "function-parentheses-newline-inside": "always-multi-line", - "function-parentheses-space-inside": "never-single-line", - "function-url-quotes": "always", - "function-whitespace-after": "always", + "block-no-empty": true, - "number-leading-zero": "always", - "number-max-precision": 3, - "number-no-trailing-zeros": true, + "block-opening-brace-newline-after": "always", + "block-opening-brace-space-after": "always-single-line", + "block-opening-brace-space-before": "always", - "string-no-newline": true, - "string-quotes": single, + "color-hex-case": "lower", + "color-hex-length": "long", + "color-named": "never", + "color-no-invalid-hex": true, - "length-zero-no-unit": true, + "comment-empty-line-before": [ + "always", { + "except": ["first-nested"], + "ignore": ["stylelint-commands"] + } + ], + "comment-whitespace-inside": "always", - "unit-case": "lower", - "unit-no-unknown": true, + "declaration-bang-space-after": "never", + "declaration-bang-space-before": "always", - "value-keyword-case": lower, + "declaration-block-no-shorthand-property-overrides": true, + "declaration-block-semicolon-newline-after": "always-multi-line", + "declaration-block-semicolon-newline-before": "never-multi-line", + "declaration-block-semicolon-space-after": "always-single-line", + "declaration-block-semicolon-space-before": "never", + "declaration-block-trailing-semicolon": "always", + "declaration-block-single-line-max-declarations": 1, + "declaration-block-no-duplicate-properties": [ + true, { + "ignore": ["consecutive-duplicates-with-different-values"] + } + ], - "value-list-comma-newline-after": "always-multi-line", - "value-list-comma-newline-before": "never-multi-line", - "value-list-comma-space-after": "always-single-line", - "value-list-comma-space-before": "never", - "value-list-max-empty-lines": 0, + "declaration-colon-newline-after": "always-multi-line", + "declaration-colon-space-after": "always-single-line", + "declaration-colon-space-before": "never", - "shorthand-property-no-redundant-values": true, + "declaration-empty-line-before": "never", - "property-case": "lower", - "property-no-unknown": true, + "declaration-property-unit-blacklist": { + "line-height": ["rem", "em", "%"] + }, + "declaration-property-unit-whitelist": { + "height": ["px", "%"], + "width": ["px", "%"], + "font-size": ["px", "rem", "%"], + "margin-left": ["px", "rem", "%"], + "margin-right": ["px", "rem", "%"], + "margin-top": ["px", "rem", "%"], + "margin-bottom": ["px", "rem", "%"], + "padding-left": ["px", "rem"], + "padding-right": ["px", "rem"], + "padding-top": ["px", "rem"], + "padding-bottom": ["px", "rem"] + }, - "keyframe-declaration-no-important": true, + "font-family-name-quotes": "always-where-recommended", + "function-calc-no-unspaced-operator": true, - "declaration-bang-space-after": "never", - "declaration-bang-space-before": "always", - "declaration-colon-newline-after": "always-multi-line", - "declaration-colon-space-after": "always-single-line", - "declaration-colon-space-before": "never", - "declaration-empty-line-before": "never", + "function-comma-newline-after": "never-multi-line", + "function-comma-newline-before": "never-multi-line", + "function-comma-space-after": "always-single-line", + "function-comma-space-before": "never-single-line", - "declaration-block-no-duplicate-properties": true, - "declaration-block-no-ignored-properties": true, - "declaration-block-no-shorthand-property-overrides": true, - "declaration-block-semicolon-newline-after": "always-multi-line", - "declaration-block-semicolon-newline-before": "never-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", + "function-linear-gradient-no-nonstandard-direction": true, + "function-max-empty-lines": 5, - "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-after": "always-single-line", - "block-closing-brace-space-before": "always-single-line", - "block-no-empty": true, - "block-opening-brace-newline-after": "always-multi-line", - "block-opening-brace-space-after": "always-single-line", - "block-opening-brace-space-before": "always", + "function-name-case": "lower", + "function-parentheses-newline-inside": "always-multi-line", + "function-parentheses-space-inside": "never-single-line", + "function-url-quotes": "always", + "function-whitespace-after": "always", - "selector-attribute-brackets-space-inside": "never", - "selector-attribute-operator-space-after": "never", - "selector-attribute-operator-space-before": "never", - "selector-attribute-quotes": "always", - "selector-combinator-space-after": "always", - "selector-combinator-space-before": "always", - "selector-descendant-combinator-no-non-space": true, - "selector-max-compound-selectors": 3, - "selector-no-empty": true, - "selector-no-id": true, - "selector-no-qualifying-type": [ - true, { - "ignore": ["attribute"] - } - ], - "selector-pseudo-class-case": "lower", - "selector-pseudo-class-no-unknown": true, - "selector-pseudo-class-parentheses-space-inside": "never", - "selector-pseudo-element-case": "lower", - "selector-pseudo-element-colon-notation": "single", - "selector-pseudo-element-no-unknown": true, - "selector-type-case": "lower", - "selector-type-no-unknown": true, - "selector-max-empty-lines": 0, + "indentation": "tab", - "selector-list-comma-newline-after": "always", - "selector-list-comma-space-before": "never", + "length-zero-no-unit": true, - "rule-nested-empty-line-before": [ - "always-multi-line", { - "ignore": ["after-comment"], - "except": ["first-nested"] - } - ], - "rule-non-nested-empty-line-before": [ - "always-multi-line", { - "ignore": ["after-comment"] - } - ], + "max-empty-lines": 10, + "max-line-length": 180, + "max-nesting-depth": 4, - "media-feature-colon-space-after": "always", - "media-feature-colon-space-before": "never", - "media-feature-name-case": "lower", - "media-feature-no-missing-punctuation": true, - "media-feature-parentheses-space-inside": "never", - "media-feature-range-operator-space-after": "always", - "media-feature-range-operator-space-before": "always", + "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-newline-before": "never-multi-line", + "media-query-list-comma-space-after": "always-single-line", + "media-query-list-comma-space-before": "never", - "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-duplicate-selectors": true, + "no-empty-source": true, + "no-eol-whitespace": true, + "no-extra-semicolons": true, + "no-missing-end-of-source-newline": true, + "no-unknown-animations": true, - "at-rule-empty-line-before": [ - "always", { - "except": ["blockless-group", "all-nested", "first-nested"], - "ignore": ["after-comment"] - } - ], - "at-rule-name-case": "lower", - "at-rule-name-space-after": "always-single-line", - "at-rule-semicolon-newline-after": "always", + "number-leading-zero": "always", + "number-max-precision": 10, + "number-no-trailing-zeros": true, - "comment-empty-line-before": [ - "always", { - "except": ["first-nested"], - "ignore": ["stylelint-commands"] - } - ], - "comment-whitespace-inside": "always", + "property-case": "lower", + "property-no-unknown": true, - "indentation": "tab", - "max-empty-lines": 5, + "rule-empty-line-before": ["always", { + "ignore": ["after-comment"], + "except": ["first-nested"] + }], - "no-duplicate-selectors": true, - "no-eol-whitespace": true, - "no-extra-semicolons": true, - "no-indistinguishable-colors": [ - true, { - "ignore": ["#fafafa", "#f5f5f5", "#eeeeee", "#ffffff" ] - } - ], - "no-invalid-double-slash-comments": true, - "no-missing-end-of-source-newline": true, + "selector-attribute-brackets-space-inside": "never", + "selector-attribute-operator-space-after": "never", + "selector-attribute-operator-space-before": "never", + "selector-attribute-quotes": "always", - "declaration-block-properties-order": [ - [ - "-moz-osx-font-smoothing", - "-webkit-font-smoothing", - "font", - "font-effect", - "font-emphasize", - "font-emphasize-position", - "font-emphasize-style", - "font-family", - "font-feature-settings", - "-webkit-font-feature-settings", - "font-size", - "font-size-adjust", - "font-smooth", - "font-stretch", - "font-style", - "font-variant", - "font-weight", - "-moz-hyphens", - "-webkit-hyphens", - "hyphens", - "letter-spacing", - "line-height", - "-moz-tab-size", - "-o-tab-size", - "-ms-text-size-adjust", - "-webkit-text-size-adjust", - "tab-size", - "text-align", - "-moz-text-align-last", - "-ms-text-align-last", - "-webkit-text-align-last", - "text-align-last", - "-webkit-text-decoration-skip", - "text-decoration", - "text-emphasis", - "text-emphasis-color", - "text-emphasis-position", - "text-emphasis-style", - "text-indent", - "-ms-text-justify", - "text-justify", - "text-outline", - "-ms-text-overflow", - "text-overflow", - "text-overflow-ellipsis", - "text-overflow-mode", - "text-transform", - "text-wrap", - "vertical-align", - "white-space", - "-ms-word-break", - "word-break", - "word-spacing", - "-ms-word-wrap", - "-ms-writing-mode", - "word-wrap", + "selector-combinator-space-after": "always", + "selector-combinator-space-before": "always", - "background", - "background-attachment", - "-moz-background-clip", - "-webkit-background-clip", - "background-clip", - "background-color", - "background-image", - "background-origin", - "background-position", - "-ms-background-position-x", - "background-position-x", - "-ms-background-position-y", - "background-position-y", - "background-repeat", - "-moz-background-size", - "-o-background-size", - "-webkit-background-size", - "background-size", - "border", - "border-color", - "border-collapse", - "-o-border-image", - "-moz-border-image", - "-webkit-border-image", - "border-image", - "-moz-border-image-outset", - "-o-border-image-outset", - "-webkit-border-image-outset", - "border-image-outset", - "-moz-border-image-repeat", - "-o-border-image-repeat", - "-webkit-border-image-repeat", - "border-image-repeat", - "-moz-border-image-slice", - "-o-border-image-slice", - "-webkit-border-image-slice", - "border-image-slice", - "-moz-border-image-source", - "-o-border-image-source", - "-webkit-border-image-source", - "border-image-source", - "-moz-border-image-width", - "-o-border-image-width", - "-webkit-border-image-width", - "border-image-width", - "-moz-border-radius", - "-webkit-border-radius", - "border-radius", - "border-top", - "border-top-color", - "border-top-left-radius", - "-moz-border-radius-topleft", - "-webkit-border-top-left-radius", - "border-top-right-radius", - "-moz-border-radius-topright", - "-webkit-border-top-right-radius", - "border-top-style", - "border-top-width", - "border-right", - "border-right-color", - "border-right-style", - "border-right-width", - "border-bottom", - "border-bottom-color", - "-moz-border-radius-bottomleft", - "-webkit-border-bottom-left-radius", - "border-bottom-left-radius", - "-moz-border-radius-bottomright", - "-webkit-border-bottom-right-radius", - "border-bottom-right-radius", - "border-bottom-style", - "border-bottom-width", - "border-left", - "border-left-color", - "border-left-style", - "border-left-width", - "border-spacing", - "border-style", - "border-width", - "box-decoration-break", - "-moz-box-shadow", - "-webkit-box-shadow", - "box-shadow", - "color", - "opacity", - "outline", - "outline-color", - "outline-offset", - "outline-style", - "outline-width", - "text-shadow", - "-ms-interpolation-mode", - "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha", - "-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient", - "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity", - "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader", - "filter:progid:DXImageTransform.Microsoft.gradient", + "selector-list-comma-newline-after": "always", + "selector-list-comma-space-before": "never", - "position", - "top", - "right", - "bottom", - "left", - "z-index", + "selector-max-empty-lines": 5, + "selector-max-compound-selectors": 5, - "display", - "visibility", - "float", - "clear", - "-ms-overflow-x", - "-ms-overflow-y", - "-ms-overflow-style", - "overflow", - "overflow-x", - "overflow-y", - "clip", - "zoom", - "-webkit-flex", - "flex-direction", - "flex-order", - "flex-pack", - "flex-align", - "flex", + "selector-pseudo-class-case": "lower", + "selector-pseudo-class-no-unknown": true, + "selector-pseudo-class-parentheses-space-inside": "never", - "-webkit-box-sizing", - "-moz-box-sizing", - "box-sizing", - "width", - "min-width", - "max-width", - "height", - "min-height", - "max-height", - "margin", - "margin-top", - "margin-right", - "margin-bottom", - "margin-left", - "padding", - "padding-top", - "padding-right", - "padding-bottom", - "padding-left", + "selector-pseudo-element-case": "lower", + "selector-pseudo-element-colon-notation": "single", + "selector-pseudo-element-no-unknown": true, - "table-layout", - "empty-cells", - "caption-side", - "list-style", - "list-style-position", - "list-style-type", - "list-style-image", + "selector-type-case": "lower", + "selector-type-no-unknown": true, - "content", - "quotes", - "counter-reset", - "counter-increment", - "resize", - "cursor", - "-moz-user-select", - "-ms-user-select", - "-webkit-user-select", - "user-select", - "nav-index", - "nav-up", - "nav-right", - "nav-down", - "nav-left", - "-webkit-transition", - "-moz-transition", - "-ms-transition", - "-o-transition", - "transition", - "-webkit-transition-delay", - "-moz-transition-delay", - "-ms-transition-delay", - "-o-transition-delay", - "transition-delay", - "-webkit-transition-timing-function", - "-moz-transition-timing-function", - "-ms-transition-timing-function", - "-o-transition-timing-function", - "transition-timing-function", - "-webkit-transition-duration", - "-moz-transition-duration", - "-ms-transition-duration", - "-o-transition-duration", - "transition-duration", - "-webkit-transition-property", - "-moz-transition-property", - "-ms-transition-property", - "-o-transition-property", - "transition-property", - "-webkit-transform", - "-moz-transform", - "-ms-transform", - "-o-transform", - "transform", - "-webkit-transform-origin", - "-moz-transform-origin", - "-ms-transform-origin", - "-o-transform-origin", - "transform-origin", - "-webkit-animation", - "-moz-animation", - "-ms-animation", - "-o-animation", - "animation", - "-webkit-animation-name", - "-moz-animation-name", - "-ms-animation-name", - "-o-animation-name", - "animation-name", - "-webkit-animation-duration", - "-moz-animation-duration", - "-ms-animation-duration", - "-o-animation-duration", - "animation-duration", - "-webkit-animation-play-state", - "-moz-animation-play-state", - "-ms-animation-play-state", - "-o-animation-play-state", - "animation-play-state", - "-webkit-animation-timing-function", - "-moz-animation-timing-function", - "-ms-animation-timing-function", - "-o-animation-timing-function", - "animation-timing-function", - "-webkit-animation-delay", - "-moz-animation-delay", - "-ms-animation-delay", - "-o-animation-delay", - "animation-delay", - "-webkit-animation-iteration-count", - "-moz-animation-iteration-count", - "-ms-animation-iteration-count", - "-o-animation-iteration-count", - "animation-iteration-count", - "-webkit-animation-direction", - "-moz-animation-direction", - "-ms-animation-direction", - "-o-animation-direction", - "animation-direction", - "pointer-events", - "-moz-appearance", - "-webkit-appearance" - ], { unspecified: "ignore" } - ] - } + "selector-descendant-combinator-no-non-space": true, + "selector-no-id": true, + "selector-no-qualifying-type": [ + true, { + "ignore": ["attribute"] + } + ], + + "shorthand-property-no-redundant-values": true, + + "string-no-newline": true, + "string-quotes": "double", + + "unit-case": "lower", + "unit-no-unknown": true, + + "value-list-comma-newline-after": "always-multi-line", + "value-list-comma-newline-before": "never-multi-line", + "value-list-comma-space-after": "always-single-line", + "value-list-comma-space-before": "never", + "order/declaration-block-order": [ + "custom-properties", + "dollar-variables", + "at-rules", + "declarations", + { + "type": "at-rule", + "name": "media" + }, + "rules" + ], + "order/declaration-block-properties-specified-order": [ + "-moz-osx-font-smoothing", + "-webkit-font-smoothing", + "font", + "font-family", + "font-size", + "font-weight", + "font-style", + "font-variant", + "font-size-adjust", + "font-stretch", + "font-effect", + "font-emphasize", + "font-emphasize-position", + "font-emphasize-style", + "font-smooth", + "line-height", + "text-align", + "text-align-last", + "vertical-align", + "white-space", + "text-decoration", + "text-emphasis", + "text-emphasis-color", + "text-emphasis-style", + "text-emphasis-position", + "text-indent", + "text-justify", + "letter-spacing", + "word-spacing", + "writing-mode", + "text-outline", + "text-transform", + "text-wrap", + "text-overflow", + "text-overflow-ellipsis", + "text-overflow-mode", + "word-wrap", + "word-break", + "tab-size", + "hyphens", + + "background", + "background-color", + "background-image", + "background-repeat", + "background-attachment", + "background-position", + "background-position-x", + "background-position-y", + "background-clip", + "background-origin", + "background-size", + "interpolation-mode", + "filter", + + "border", + "border-width", + "border-style", + "border-color", + "border-top", + "border-top-width", + "border-top-style", + "border-top-color", + "border-right", + "border-right-width", + "border-right-style", + "border-right-color", + "border-bottom", + "border-bottom-width", + "border-bottom-style", + "border-bottom-color", + "border-left", + "border-left-width", + "border-left-style", + "border-left-color", + "border-radius", + "border-top-left-radius", + "border-top-right-radius", + "border-bottom-right-radius", + "border-bottom-left-radius", + "border-image", + "border-image-source", + "border-image-slice", + "border-image-width", + "border-image-outset", + "border-image-repeat", + "outline", + "outline-width", + "outline-style", + "outline-color", + "outline-offset", + + "box-decoration-break", + "box-shadow", + "text-shadow", + + "color", + "opacity", + + "position", + "z-index", + "top", + "right", + "bottom", + "left", + + "display", + "visibility", + "float", + "clear", + "overflow", + "overflow-x", + "overflow-y", + "clip", + "zoom", + "flex", + "flex-direction", + "flex-order", + "flex-pack", + "flex-align", + "flex-basis", + "flex-grow", + "flex-shrink", + "flex-wrap", + "justify-content", + "align-items", + "align-self", + + "box-sizing", + "width", + "min-width", + "max-width", + "height", + "min-height", + "max-height", + "margin", + "margin-top", + "margin-right", + "margin-bottom", + "margin-left", + "padding", + "padding-top", + "padding-right", + "padding-bottom", + "padding-left", + + "table-layout", + "empty-cells", + "caption-side", + "border-spacing", + "border-collapse", + "list-style", + "list-style-position", + "list-style-type", + "list-style-image", + + "content", + "quotes", + "counter-reset", + "counter-increment", + "resize", + "cursor", + "user-select", + "nav-index", + "nav-up", + "nav-right", + "nav-down", + "nav-left", + "transition", + "transition-delay", + "transition-timing-function", + "transition-duration", + "transition-property", + "transform", + "transform-origin", + "animation", + "animation-name", + "animation-duration", + "animation-play-state", + "animation-timing-function", + "animation-delay", + "animation-iteration-count", + "animation-direction", + "pointer-events" + ] + } } diff --git a/phpBB/package.json b/phpBB/package.json index fc85b20a99..e97fc5cc78 100644 --- a/phpBB/package.json +++ b/phpBB/package.json @@ -28,7 +28,7 @@ }, "homepage": "https://www.phpbb.com", "devDependencies": { - "stylelint": "^7.7.1", - "stylelint-order": "^0.3.0" + "stylelint": "7.8.0", + "stylelint-order": "0.3.0" } } From ec71279a77889474c4ef3bd912b4a4c94aaefbae Mon Sep 17 00:00:00 2001 From: hanakin Date: Thu, 9 Mar 2017 16:35:28 -0500 Subject: [PATCH 03/16] [ticket/15115] Fix errors PHPBB3-15115 --- phpBB/styles/prosilver/theme/base.css | 12 +- phpBB/styles/prosilver/theme/bidi.css | 20 ++- phpBB/styles/prosilver/theme/buttons.css | 12 +- phpBB/styles/prosilver/theme/colours.css | 184 +++++++++++++------- phpBB/styles/prosilver/theme/common.css | 49 +++--- phpBB/styles/prosilver/theme/content.css | 34 ++-- phpBB/styles/prosilver/theme/cp.css | 17 +- phpBB/styles/prosilver/theme/forms.css | 90 ++++++++-- phpBB/styles/prosilver/theme/icons.css | 4 +- phpBB/styles/prosilver/theme/links.css | 12 +- phpBB/styles/prosilver/theme/plupload.css | 10 +- phpBB/styles/prosilver/theme/print.css | 12 +- phpBB/styles/prosilver/theme/responsive.css | 21 ++- phpBB/styles/prosilver/theme/stylesheet.css | 24 +-- phpBB/styles/prosilver/theme/tweaks.css | 11 +- phpBB/styles/prosilver/theme/utilities.css | 4 +- 16 files changed, 340 insertions(+), 176 deletions(-) diff --git a/phpBB/styles/prosilver/theme/base.css b/phpBB/styles/prosilver/theme/base.css index 5b64943704..3c5fdb11d5 100644 --- a/phpBB/styles/prosilver/theme/base.css +++ b/phpBB/styles/prosilver/theme/base.css @@ -18,13 +18,17 @@ /* Define your base font-size here; most elements will inherit this. */ html { - font-size: 1em; /* Assuming 16px... */ - line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) */ + font-size: 16px; /* Assuming 16px... */ + + /* 24px (This is now our magic number; all subsequent margin-bottoms and + line-heights want to be a multiple of this number in order to maintain + vertical rhythm.) */ + line-height: 1.5; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { - font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; background-color: #ffffff; color: #333333; } @@ -116,7 +120,7 @@ ul { * This prevents an unwanted focus outline from appearing around elements that * might still respond to pointer events. */ -[tabindex='-1']:focus { +[tabindex="-1"]:focus { outline: none !important; } diff --git a/phpBB/styles/prosilver/theme/bidi.css b/phpBB/styles/prosilver/theme/bidi.css index d628f0a562..a5b9b51dbf 100644 --- a/phpBB/styles/prosilver/theme/bidi.css +++ b/phpBB/styles/prosilver/theme/bidi.css @@ -3,6 +3,7 @@ /* -------------------------------------------------------------- */ /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ /** * common.css @@ -411,8 +412,8 @@ li.breadcrumbs span:first-child > a { } .rtl ul.topiclist dd { - border-right-style: solid; border-right-width: 1px; + border-right-style: solid; border-left: none; float: right; } @@ -601,8 +602,8 @@ li.breadcrumbs span:first-child > a { .rtl .pollbar4, .rtl .pollbar5 { border-right: none; - border-left-style: solid; border-left-width: 1px; + border-left-style: solid; } /* Poster profile block @@ -615,8 +616,8 @@ li.breadcrumbs span:first-child > a { } .rtl .pm .postprofile { - border-right-style: solid; border-right-width: 1px; + border-right-style: solid; border-left: none; } @@ -669,8 +670,8 @@ li.breadcrumbs span:first-child > a { ---------------------------------------- */ .rtl .contact-icons a { border-right: none; - border-left-style: dotted; border-left-width: 1px; + border-left-style: dotted; float: right; } @@ -810,8 +811,8 @@ li.breadcrumbs span:first-child > a { /* PM marking colours */ .rtl .pm-legend { - border-right-style: solid; border-right-width: 10px; + border-right-style: solid; border-left-width: 0; padding-right: 3px; padding-left: 0; @@ -958,9 +959,9 @@ li.breadcrumbs span:first-child > a { } .rtl .search-box .inputbox { - border-radius: 0 4px 4px 0; border-right-width: 1px; border-left-width: 0; + border-radius: 0 4px 4px 0; float: right; padding: 3px; } @@ -971,9 +972,9 @@ li.breadcrumbs span:first-child > a { } .rtl .button-search-end { - border-radius: 4px 0 0 4px; border-right-width: 0; border-left-width: 1px; + border-radius: 4px 0 0 4px; } .rtl .search-header .button-search-end { @@ -1137,4 +1138,7 @@ li.breadcrumbs span:first-child > a { margin-right: 0; } } -/* stylelint-enable */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable declaration-property-unit-whitelist */ diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index 9fed9e128b..ed1b86ab25 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -2,8 +2,10 @@ $Buttons /* -------------------------------------------------------------- */ +/* stylelint-disable declaration-property-unit-whitelist */ + .button { - font-family: 'Open Sans', 'Droid Sans', Verdana, Arial, Helvetica; + font-family: "Open Sans", "Droid Sans", Verdana, Arial, Helvetica; font-size: 13px; font-weight: normal; line-height: 1.4; @@ -59,8 +61,8 @@ } .button-search-end { - border-radius: 0 4px 4px 0; border-left-width: 0; + border-radius: 0 4px 4px 0; } .search-header .button-search, @@ -173,8 +175,8 @@ button::-moz-focus-inner { ------------------------------------------------- */ .small-icon { background-image: none; - background-position: 0 50%; background-repeat: no-repeat; + background-position: 0 50%; } .dropdown .small-icon { @@ -191,7 +193,7 @@ button::-moz-focus-inner { ul.linklist.bulletin > li.small-icon:before { display: none; } -/* stylelint-enable */ +/* stylelint-enable selector-no-qualifying-type */ .dropdown .small-icon > a { display: block; @@ -205,3 +207,5 @@ ul.linklist.bulletin > li.small-icon:before { padding-right: 19px; padding-left: 0; } + +/* stylelint-enable declaration-property-unit-whitelist */ diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 8502613020..9113f000b1 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -162,7 +162,7 @@ ul.zebra-list li:nth-child(even) { } .site_logo { - background-image: url('./images/site_logo.gif'); + background-image: url("./images/site_logo.gif"); } /* horizontal lists */ @@ -338,7 +338,7 @@ p.post-notice { ul.forums { background-color: #eef5f9; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to bottom, #d2e0eb 0%, #eef5f9 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#d2e0eb', endcolorstr='#eef5f9', gradienttype=0); /* ie6-9 */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#d2e0eb", endcolorstr="#eef5f9", gradienttype=0); /* ie6-9 */ } ul.topiclist li { @@ -426,12 +426,12 @@ dl.faq dt { /* quote block */ blockquote { background-color: #ebeadd; - background-image: url('./images/quote.gif'); + background-image: url("./images/quote.gif"); border-color: #dbdbce; } .rtl blockquote { - background-image: url('./images/quote_rtl.gif'); + background-image: url("./images/quote_rtl.gif"); } blockquote blockquote { @@ -595,7 +595,7 @@ fieldset.polls dd div { } .online { - background-image: url('./en/icon_user_online.gif'); + background-image: url("./en/icon_user_online.gif"); } dd.profile-warnings { @@ -629,20 +629,20 @@ dd.profile-warnings { .button { background-color: #e9e9e9; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to bottom, #ffffff 0%, #e9e9e9 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#ffffff", endcolorstr="#e9e9e9", gradienttype=0); /* ie6-9 */ border-color: #c7c3bf; -webkit-box-shadow: 0 0 0 1px #ffffff inset; box-shadow: 0 0 0 1px #ffffff inset; color: #d31141; - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#ffffff', endcolorstr='#e9e9e9', gradienttype=0); /* ie6-9 */ } .button:hover, .button:focus { background-color: #ffffff; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to bottom, #e9e9e9 0%, #ffffff 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#e9e9e9", endcolorstr="#ffffff", gradienttype=0); /* ie6-9 */ border-color: #0a8ed0; text-shadow: 1px 1px 0 #ffffff, -1px -1px 0 #ffffff, -1px -1px 0 rgba(188, 42, 77, 0.2); - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#e9e9e9', endcolorstr='#ffffff', gradienttype=0); /* ie6-9 */ } .button .icon, @@ -701,12 +701,12 @@ dd.profile-warnings { .pagination li a { background: #ecedee; + -webkit-filter: none; + filter: none; border-color: #b4bac0; -webkit-box-shadow: none; box-shadow: none; color: #5c758c; - -webkit-filter: none; - filter: none; } .pagination li.ellipsis span { @@ -725,11 +725,11 @@ dd.profile-warnings { .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger { background: #368ad2; - border-color: #368ad2; - color: #ffffff; - text-shadow: none; -webkit-filter: none; filter: none; + border-color: #368ad2; + text-shadow: none; + color: #ffffff; } /* search box */ @@ -747,7 +747,7 @@ dd.profile-warnings { /* icon images */ .contact-icon { - background-image: url('./images/icons_contact.png'); + background-image: url("./images/icons_contact.png"); } /* profile & navigation icons */ @@ -805,181 +805,181 @@ dd.profile-warnings { /* forum icons & topic icons */ .global_read { - background-image: url('./images/announce_read.gif'); + background-image: url("./images/announce_read.gif"); } .global_read_mine { - background-image: url('./images/announce_read_mine.gif'); + background-image: url("./images/announce_read_mine.gif"); } .global_read_locked { - background-image: url('./images/announce_read_locked.gif'); + background-image: url("./images/announce_read_locked.gif"); } .global_read_locked_mine { - background-image: url('./images/announce_read_locked_mine.gif'); + background-image: url("./images/announce_read_locked_mine.gif"); } .global_unread { - background-image: url('./images/announce_unread.gif'); + background-image: url("./images/announce_unread.gif"); } .global_unread_mine { - background-image: url('./images/announce_unread_mine.gif'); + background-image: url("./images/announce_unread_mine.gif"); } .global_unread_locked { - background-image: url('./images/announce_unread_locked.gif'); + background-image: url("./images/announce_unread_locked.gif"); } .global_unread_locked_mine { - background-image: url('./images/announce_unread_locked_mine.gif'); + background-image: url("./images/announce_unread_locked_mine.gif"); } .announce_read { - background-image: url('./images/announce_read.gif'); + background-image: url("./images/announce_read.gif"); } .announce_read_mine { - background-image: url('./images/announce_read_mine.gif'); + background-image: url("./images/announce_read_mine.gif"); } .announce_read_locked { - background-image: url('./images/announce_read_locked.gif'); + background-image: url("./images/announce_read_locked.gif"); } .announce_read_locked_mine { - background-image: url('./images/announce_read_locked_mine.gif'); + background-image: url("./images/announce_read_locked_mine.gif"); } .announce_unread { - background-image: url('./images/announce_unread.gif'); + background-image: url("./images/announce_unread.gif"); } .announce_unread_mine { - background-image: url('./images/announce_unread_mine.gif'); + background-image: url("./images/announce_unread_mine.gif"); } .announce_unread_locked { - background-image: url('./images/announce_unread_locked.gif'); + background-image: url("./images/announce_unread_locked.gif"); } .announce_unread_locked_mine { - background-image: url('./images/announce_unread_locked_mine.gif'); + background-image: url("./images/announce_unread_locked_mine.gif"); } .forum_link { - background-image: url('./images/forum_link.gif'); + background-image: url("./images/forum_link.gif"); } .forum_read { - background-image: url('./images/forum_read.gif'); + background-image: url("./images/forum_read.gif"); } .forum_read_locked { - background-image: url('./images/forum_read_locked.gif'); + background-image: url("./images/forum_read_locked.gif"); } .forum_read_subforum { - background-image: url('./images/forum_read_subforum.gif'); + background-image: url("./images/forum_read_subforum.gif"); } .forum_unread { - background-image: url('./images/forum_unread.gif'); + background-image: url("./images/forum_unread.gif"); } .forum_unread_locked { - background-image: url('./images/forum_unread_locked.gif'); + background-image: url("./images/forum_unread_locked.gif"); } .forum_unread_subforum { - background-image: url('./images/forum_unread_subforum.gif'); + background-image: url("./images/forum_unread_subforum.gif"); } .sticky_read { - background-image: url('./images/sticky_read.gif'); + background-image: url("./images/sticky_read.gif"); } .sticky_read_mine { - background-image: url('./images/sticky_read_mine.gif'); + background-image: url("./images/sticky_read_mine.gif"); } .sticky_read_locked { - background-image: url('./images/sticky_read_locked.gif'); + background-image: url("./images/sticky_read_locked.gif"); } .sticky_read_locked_mine { - background-image: url('./images/sticky_read_locked_mine.gif'); + background-image: url("./images/sticky_read_locked_mine.gif"); } .sticky_unread { - background-image: url('./images/sticky_unread.gif'); + background-image: url("./images/sticky_unread.gif"); } .sticky_unread_mine { - background-image: url('./images/sticky_unread_mine.gif'); + background-image: url("./images/sticky_unread_mine.gif"); } .sticky_unread_locked { - background-image: url('./images/sticky_unread_locked.gif'); + background-image: url("./images/sticky_unread_locked.gif"); } .sticky_unread_locked_mine { - background-image: url('./images/sticky_unread_locked_mine.gif'); + background-image: url("./images/sticky_unread_locked_mine.gif"); } .topic_moved { - background-image: url('./images/topic_moved.gif'); + background-image: url("./images/topic_moved.gif"); } .pm_read, .topic_read { - background-image: url('./images/topic_read.gif'); + background-image: url("./images/topic_read.gif"); } .topic_read_mine { - background-image: url('./images/topic_read_mine.gif'); + background-image: url("./images/topic_read_mine.gif"); } .topic_read_hot { - background-image: url('./images/topic_read_hot.gif'); + background-image: url("./images/topic_read_hot.gif"); } .topic_read_hot_mine { - background-image: url('./images/topic_read_hot_mine.gif'); + background-image: url("./images/topic_read_hot_mine.gif"); } .topic_read_locked { - background-image: url('./images/topic_read_locked.gif'); + background-image: url("./images/topic_read_locked.gif"); } .topic_read_locked_mine { - background-image: url('./images/topic_read_locked_mine.gif'); + background-image: url("./images/topic_read_locked_mine.gif"); } .pm_unread, .topic_unread { - background-image: url('./images/topic_unread.gif'); + background-image: url("./images/topic_unread.gif"); } .topic_unread_mine { - background-image: url('./images/topic_unread_mine.gif'); + background-image: url("./images/topic_unread_mine.gif"); } .topic_unread_hot { - background-image: url('./images/topic_unread_hot.gif'); + background-image: url("./images/topic_unread_hot.gif"); } .topic_unread_hot_mine { - background-image: url('./images/topic_unread_hot_mine.gif'); + background-image: url("./images/topic_unread_hot_mine.gif"); } .topic_unread_locked { - background-image: url('./images/topic_unread_locked.gif'); + background-image: url("./images/topic_unread_locked.gif"); } .topic_unread_locked_mine { - background-image: url('./images/topic_unread_locked_mine.gif'); + background-image: url("./images/topic_unread_locked_mine.gif"); } @@ -1033,10 +1033,10 @@ ul.cplist { .tabs .activetab > a:hover { background-color: #cadceb; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to bottom, #e2f2ff 0%, #cadceb 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#e2f2ff", endcolorstr="#cadceb", gradienttype=0); /* ie6-9 */ border-color: #cadceb; box-shadow: 0 1px 1px #f2f9ff inset; color: #333333; - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#e2f2ff', endcolorstr='#cadceb', gradienttype=0); /* ie6-9 */ } .tabs .activetab > a:hover { @@ -1069,26 +1069,26 @@ ul.cplist { .navigation a { background: #cadceb; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to right, #b4c4d1 50%, #cadceb 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#b4c4d1", endcolorstr="#cadceb", gradienttype=1); /* ie6-9 */ color: #333333; - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#b4c4d1', endcolorstr='#cadceb', gradienttype=1); /* ie6-9 */ } .rtl .navigation a { background: #b4c4d1; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to right, #cadceb 50%, #b4c4d1 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#cadceb', endcolorstr='#b4c4d1', gradienttype=1); /* ie6-9 */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#cadceb", endcolorstr="#b4c4d1", gradienttype=1); /* ie6-9 */ } .navigation a:hover { background: #aabac6; - color: #bc2a4d; filter: progid:dximagetransform.microsoft.gradient(enabled = false); + color: #bc2a4d; } .navigation .active-subsection a { background: #f9f9f9; - color: #d31141; filter: progid:dximagetransform.microsoft.gradient(enabled = false); + color: #d31141; } .navigation .active-subsection a:hover { @@ -1261,6 +1261,62 @@ fieldset.quick-login input.inputbox { color: transparent; } +/* form button styles */ + +a.button1, +input.button1, +input.button3, +a.button2, +input.button2 { + background-color: #efefef; /* old browsers */ /* ff3.6+ */ + background-image: linear-gradient(to bottom, #d2d2d2 0%, #efefef 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#d2d2d2", endcolorstr="#efefef", gradienttype=0); /* ie6-9 */ + color: #000000; +} + +a.button1, +input.button1 { + border-color: #666666; +} + +input.button3 { + background-image: none; +} + +/* alternative button */ +a.button2, +input.button2, +input.button3 { + border-color: #666666; +} + +/* button in the style of the form buttons */ +a.button1, +a.button2 { + color: #000000; +} + +/* hover states */ +a.button1:hover, +input.button1:hover, +a.button2:hover, +input.button2:hover, +input.button3:hover { + background-color: #d2d2d2; /* old browsers */ /* ff3.6+ */ + background-image: linear-gradient(to bottom, #efefef 0%, #d2d2d2 100%); /* w3c */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#efefef", endcolorstr="#d2d2d2", gradienttype=0); /* ie6-9 */ + border-color: #d31141; + color: #d31141; +} + +/* focus states */ +input.button1:focus, +input.button2:focus, +input.button3:focus { + border-color: #11a3ea; + color: #0f4987; +} + input.disabled { color: #666666; } @@ -1313,14 +1369,14 @@ input.disabled { } .dropdown-extended .footer { - border-top-style: solid; border-top-width: 1px; + border-top-style: solid; } .dropdown-extended .header { background-color: #f1f8ff; /* old browsers */ /* ff3.6+ */ background-image: linear-gradient(to bottom, #f1f8ff 0%, #cadceb 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#f1f8ff', endcolorstr='#cadceb', gradienttype=0); /* ie6-9 */ + filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#f1f8ff", endcolorstr="#cadceb", gradienttype=0); /* ie6-9 */ } .dropdown .pointer { diff --git a/phpBB/styles/prosilver/theme/common.css b/phpBB/styles/prosilver/theme/common.css index b6bcdfdb22..da10394181 100644 --- a/phpBB/styles/prosilver/theme/common.css +++ b/phpBB/styles/prosilver/theme/common.css @@ -3,6 +3,8 @@ /* -------------------------------------------------------------- */ /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ html { font-size: 100%; @@ -23,7 +25,7 @@ body { h1 { /* Forum name */ - font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 2em; font-weight: bold; margin-top: 15px; @@ -32,7 +34,7 @@ h1 { h2 { /* Forum header titles */ - font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 2em; font-weight: normal; margin: 0.8em 0 0.2em; @@ -56,7 +58,7 @@ h3 { h4 { /* Forum and topic list titles */ - font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-size: 1.3em; } @@ -238,8 +240,8 @@ a:hover { } .post { - background-position: 100% 0; background-repeat: no-repeat; + background-position: 100% 0; border-radius: 7px; position: relative; margin-bottom: 4px; @@ -341,7 +343,7 @@ ul.linklist.bulletin > li:before { line-height: inherit; display: inline-block; padding-right: 4px; - content: '\2022'; + content: "\2022"; } ul.linklist.bulletin > li:first-child:before, @@ -381,7 +383,7 @@ a.header-avatar span:after { display: inline-block; padding-top: 2px; padding-left: 6px; - content: '\f0dd'; + content: "\f0dd"; } /* Dropdown menu @@ -406,9 +408,9 @@ a.header-avatar span:after { border: 1px solid transparent; border-radius: 5px; position: absolute; + z-index: 2; top: 1.2em; left: 0; - z-index: 2; display: none; margin-right: -500px; padding: 9px 0 0; @@ -465,10 +467,10 @@ a.header-avatar span:after { } .dropdown .pointer { + z-index: 3; top: -1px; right: auto; left: 10px; - z-index: 3; } .dropdown-up .pointer { @@ -612,7 +614,7 @@ a.header-avatar span:after { .breadcrumbs .crumb:before { font-weight: bold; padding: 0 0.5em; - content: '\2039'; + content: "\2039"; } .breadcrumbs .crumb:first-child:before { @@ -620,9 +622,9 @@ a.header-avatar span:after { } .breadcrumbs .crumb a { - text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; + text-overflow: ellipsis; overflow: hidden; } @@ -777,8 +779,8 @@ table.info tbody th { } .color_palette_placeholder table { - border-collapse: separate; border-spacing: 1px; + border-collapse: separate; } /* Misc layout styles @@ -817,7 +819,7 @@ table.info tbody th { } dl.details { - /* font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; */ + /* font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; */ font-size: 1.1em; } @@ -924,7 +926,7 @@ fieldset.fields1 dl.pmlist dd.recipients { } .pagination li.active span { - font-family: 'Open Sans', 'Droid Sans', Verdana, Arial, Helvetica; + font-family: "Open Sans", "Droid Sans", Verdana, Arial, Helvetica; font-size: 13px; font-weight: normal; line-height: 1.4; @@ -978,10 +980,10 @@ fieldset.fields1 dl.pmlist dd.recipients { .phpbb_alert { border: 1px solid transparent; position: fixed; + z-index: 50; top: 150px; right: 0; left: 0; - z-index: 50; display: none; width: 620px; margin: 0 auto; @@ -1028,18 +1030,18 @@ fieldset.fields1 dl.pmlist dd.recipients { .darken { opacity: 0.5; position: fixed; + z-index: 45; top: 0; left: 0; - z-index: 45; width: 100%; height: 100%; } .loading_indicator { position: fixed; + z-index: 51; top: 50%; left: 50%; - z-index: 51; display: none; } @@ -1163,7 +1165,7 @@ ul.linklist:after, .postprofile .avatar-container:after { display: block; clear: both; - content: ''; + content: ""; } .emoji { @@ -1234,13 +1236,13 @@ ul.linklist:after, } .dropdown-extended .header { - font-family: Arial, 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-family: Arial, "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: bold; line-height: 3em; text-align: left; text-transform: uppercase; - border-radius: 5px 5px 0 0; border-bottom: 1px solid; + border-radius: 5px 5px 0 0; text-shadow: 1px 1px 1px #ffffff; padding: 0 10px; } @@ -1259,7 +1261,7 @@ ul.linklist:after, .dropdown-extended .header:after { display: table; clear: both; - content: ''; + content: ""; } .dropdown-extended .footer { @@ -1300,8 +1302,8 @@ ul.linklist:after, .notification_list p.notification-reference, .notification_list p.notification-location, .notification_list li a p.notification-reason { - text-overflow: ellipsis; white-space: nowrap; + text-overflow: ellipsis; overflow: hidden; } @@ -1321,7 +1323,7 @@ ul.linklist:after, } .notification_list p.notifications_title { - font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; + font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 1.2em !important; } @@ -1386,3 +1388,6 @@ ul.linklist:after, .dropdown .clone.hidden + li { border-top: none; } + +/* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/content.css b/phpBB/styles/prosilver/theme/content.css index 88376d3430..5f0d46852e 100644 --- a/phpBB/styles/prosilver/theme/content.css +++ b/phpBB/styles/prosilver/theme/content.css @@ -1,8 +1,11 @@ /* -------------------------------------------------------------- /* $Content /* -------------------------------------------------------------- */ + /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ ul.topiclist { display: block; @@ -135,14 +138,14 @@ li.header dl.row-item dt .list-inner { /* Forum list column styles */ dl.row-item { - background-position: 10px 50%; /* Position of folder icon */ background-repeat: no-repeat; + background-position: 10px 50%; /* Position of folder icon */ background-size: 32px; } dl.row-item dt { - background-position: 5px 95%; /* Position of topic icon */ background-repeat: no-repeat; + background-position: 5px 95%; /* Position of topic icon */ background-size: 17px; } @@ -258,7 +261,7 @@ dd.option { } .postbody h3 { - font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-size: 1.5em; line-height: 125%; text-transform: none; @@ -337,7 +340,7 @@ dd.option { /* Content container styles ---------------------------------------- */ .content { - font-family: 'Lucida Grande', 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.4em; clear: both; @@ -367,14 +370,14 @@ dd.option { } .content p { - font-family: 'Lucida Grande', 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-size: 1.2em; line-height: 1.4em; margin-bottom: 1em; } dl.faq { - font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; font-size: 1.1em; line-height: 1.4em; margin-top: 1em; @@ -448,7 +451,7 @@ dd .signature { /* Post noticies */ .notice { - font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 130%; border-top: 1px dashed transparent; @@ -486,10 +489,10 @@ blockquote blockquote { blockquote cite { font-size: 0.9em; + font-weight: bold; /* Username/source of quoter */ font-style: normal; - font-weight: bold; display: block; margin-left: 20px; } @@ -536,7 +539,7 @@ blockquote .codebox { } .codebox code { - font: 0.9em Monaco, 'Andale Mono', 'Courier New', Courier, monospace; + font: 0.9em Monaco, "Andale Mono", "Courier New", Courier, monospace; line-height: 1.3em; display: block; overflow: auto; @@ -651,7 +654,7 @@ dl.thumbnail dt a:hover img { /* Post poll styles ---------------------------------------- */ fieldset.polls { - font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; } fieldset.polls dl { @@ -794,8 +797,8 @@ dd.profile-contact { .online { background-image: none; - background-position: 100% 0; background-repeat: no-repeat; + background-position: 100% 0; } /* Poster profile used by search */ @@ -850,8 +853,8 @@ div.dl_links { } .ellipsis-text { - text-overflow: ellipsis; white-space: nowrap; + text-overflow: ellipsis; display: inline-block; overflow: hidden; } @@ -891,4 +894,9 @@ table.fixed-width-table { #team tr.inactive { font-style: italic; } -/* stylelint-enable */ +/* stylelint-enable selector-no-id */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/cp.css b/phpBB/styles/prosilver/theme/cp.css index 6abd982319..a36ef877d4 100644 --- a/phpBB/styles/prosilver/theme/cp.css +++ b/phpBB/styles/prosilver/theme/cp.css @@ -1,8 +1,11 @@ /* -------------------------------------------------------------- /* $Contorl Panel /* -------------------------------------------------------------- */ + /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ /* Main CP box ---------------------------------------- */ @@ -126,8 +129,8 @@ ul.cplist { .tabs .tab > a, .minitabs .tab > a { - text-decoration: none; white-space: nowrap; + text-decoration: none; position: relative; display: block; padding: 5px 9px; @@ -195,7 +198,7 @@ ul.cplist { left: 10px; width: 14px; height: 0.125em; - content: ''; + content: ""; } .tabs .dropdown, @@ -333,8 +336,8 @@ ol.def-rules li { .pm-legend { border-right-width: 0; - border-left-style: solid; border-left-width: 10px; + border-left-style: solid; margin-bottom: 3px; padding-left: 3px; } @@ -386,8 +389,12 @@ ol.def-rules li { } .navigation li:last-child a { - border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; + border-bottom-left-radius: 5px; } } -/* stylelint-enable */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/forms.css b/phpBB/styles/prosilver/theme/forms.css index 5d24c7511c..70ed28543d 100644 --- a/phpBB/styles/prosilver/theme/forms.css +++ b/phpBB/styles/prosilver/theme/forms.css @@ -1,8 +1,11 @@ /* -------------------------------------------------------------- /* $Forms /* -------------------------------------------------------------- */ + /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ /* General form styles ---------------------------------------- */ @@ -44,7 +47,7 @@ select optgroup option { } textarea { - font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1.4em; width: 60%; @@ -263,7 +266,7 @@ fieldset.submit-buttons input { } .message-box textarea { - font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif; font-size: 1.2em; outline: 3px dashed transparent; outline-offset: -4px; @@ -322,33 +325,84 @@ textarea.inputbox { width: auto !important; } -input[type='number'] { +input[type="number"] { -moz-padding-end: inherit; } -input[type='search'] { +input[type="search"] { -webkit-box-sizing: content-box; -webkit-appearance: textfield; } -input[type='search']::-webkit-search-decoration, -input[type='search']::-webkit-search-results-button, -input[type='search']::-webkit-search-results-decoration { +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-results-button, +input[type="search"]::-webkit-search-results-decoration { display: none; } -input[type='search']::-webkit-search-cancel-button { +input[type="search"]::-webkit-search-cancel-button { cursor: pointer; } -input[type='button'], -input[type='submit'], -input[type='reset'], -input[type='checkbox'], -input[type='radio'] { +/* Form button styles +---------------------------------------- */ +input.button1, +input.button2 { + font-size: 1em; +} + +a.button1, +input.button1, +input.button3, +a.button2, +input.button2 { + font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; + line-height: 1.5; + background: transparent none repeat-x top left; + width: auto !important; + padding-top: 1px; + padding-bottom: 1px; +} + +a.button1, +input.button1 { + font-weight: bold; + border: 1px solid transparent; +} + +input.button3 { + font-variant: small-caps; + line-height: 5px; + background-image: none; + height: 12px; + margin: 0; + padding: 0; +} + +input[type="button"], +input[type="submit"], +input[type="reset"], +input[type="checkbox"], +input[type="radio"] { cursor: pointer; } +/* Alternative button */ +a.button2, +input.button2, +input.button3 { + border: 1px solid transparent; +} + +/* button in the style of the form buttons */ +a.button1, +a.button2 { + vertical-align: text-bottom; + text-decoration: none; + padding: 0 3px; +/* Hover states */ +} + input.disabled { font-weight: normal; } @@ -360,8 +414,8 @@ input.disabled { .search-box .inputbox { background-image: none; - border-radius: 4px 0 0 4px; border-right-width: 0; + border-radius: 4px 0 0 4px; float: left; box-sizing: border-box; height: 24px; @@ -388,8 +442,8 @@ input.disabled { input.search { background-image: none; - background-position: left 1px; background-repeat: no-repeat; + background-position: left 1px; padding-left: 17px; } @@ -408,4 +462,8 @@ input.search { .tiny { width: 10%; } -/* stylelint-enable */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/icons.css b/phpBB/styles/prosilver/theme/icons.css index 1d4634d684..534ecb2dde 100644 --- a/phpBB/styles/prosilver/theme/icons.css +++ b/phpBB/styles/prosilver/theme/icons.css @@ -11,13 +11,13 @@ */ .icon, .button .icon { - -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; font-family: FontAwesome; font-size: 14px; + font-weight: normal; font-style: normal; font-variant: normal; - font-weight: normal; line-height: 1; display: inline-block; text-rendering: auto; /* optimizelegibility throws things off #1094 */ diff --git a/phpBB/styles/prosilver/theme/links.css b/phpBB/styles/prosilver/theme/links.css index b4fee56073..10bdd9e729 100644 --- a/phpBB/styles/prosilver/theme/links.css +++ b/phpBB/styles/prosilver/theme/links.css @@ -2,6 +2,7 @@ $Links /* -------------------------------------------------------------- */ +/* stylelint-disable declaration-property-unit-whitelist */ /* Links adjustment to correctly display an order of rtl/ltr mixed content */ a { @@ -38,13 +39,13 @@ th a:hover { /* Notification mark read link */ .dropdown-extended a.mark_read { - background-position: center center; background-repeat: no-repeat; + background-position: center center; border-radius: 3px 0 0 3px; position: absolute; + z-index: 2; top: 50%; right: 0; - z-index: 2; display: none; box-sizing: border-box; margin-top: -20px; @@ -66,7 +67,7 @@ th a:hover { /* Links for forum/topic lists */ a.forumtitle { - font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Helvetica, Arial, sans-serif; font-size: 1.2em; font-weight: bold; text-decoration: none; @@ -77,7 +78,7 @@ a.forumtitle:hover { } a.topictitle { - font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif; + font-family: "Trebuchet MS", Helvetica, Arial, sans-serif; font-size: 1.2em; font-weight: bold; text-decoration: none; @@ -208,4 +209,5 @@ a.feed-icon-forum { a.anchor { display: block; } -/* stylelint-enable */ + +/* stylelint-enable declaration-property-unit-whitelist */ diff --git a/phpBB/styles/prosilver/theme/plupload.css b/phpBB/styles/prosilver/theme/plupload.css index 2ec396e682..3be5663443 100644 --- a/phpBB/styles/prosilver/theme/plupload.css +++ b/phpBB/styles/prosilver/theme/plupload.css @@ -2,6 +2,8 @@ $Plupload /* -------------------------------------------------------------- */ +/* stylelint-disable declaration-property-unit-whitelist */ + .attach-panel-multi { display: none; margin-bottom: 1em; @@ -69,15 +71,15 @@ } .file-status.file-working { - background: url('./images/plupload/throbber.gif'); + background: url("./images/plupload/throbber.gif"); } .file-status.file-uploaded { - background: url('./images/plupload/done.gif'); + background: url("./images/plupload/done.gif"); } .file-status.file-error { - background: url('./images/plupload/error.gif'); + background: url("./images/plupload/error.gif"); } .file-status { @@ -90,3 +92,5 @@ vertical-align: bottom; max-width: 65%; } + +/* stylelint-enable declaration-property-unit-whitelist */ diff --git a/phpBB/styles/prosilver/theme/print.css b/phpBB/styles/prosilver/theme/print.css index 192805d8e7..de7531c483 100644 --- a/phpBB/styles/prosilver/theme/print.css +++ b/phpBB/styles/prosilver/theme/print.css @@ -1,7 +1,10 @@ /* -------------------------------------------------------------- /* $Print /* -------------------------------------------------------------- */ + /* stylelint-disable selector-max-compound-selectors */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ /* Lots still TODO here! */ @@ -71,7 +74,7 @@ h3, h1 a, h2 a, h3 a { - font-family: 'Trebuchet MS', georgia, Verdana, sans-serif; + font-family: "Trebuchet MS", georgia, Verdana, sans-serif; font-weight: bold; text-decoration: none; background: none; @@ -93,7 +96,7 @@ h3 { } .content { - font-family: 'Lucida Grande', 'Trebuchet MS', Verdana, Arial, Helvetica, sans-serif; + font-family: "Lucida Grande", "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; line-height: 14pt; overflow: hidden; @@ -117,7 +120,7 @@ html > body .postbody a:link:after, html > body .postbody a:visited:after { font-size: 90%; text-decoration: none; - content: ' (' attr(href) ') '; + content: " (" attr(href) ") "; } hr { @@ -152,7 +155,7 @@ html > body .postquote .quote-by a:visited:after, html > body .postbody h1 a:link:after, html > body .postbody h2 a:link:after { text-decoration: none; - content: ''; + content: ""; } /* Poster profile */ @@ -222,3 +225,4 @@ ul { width: 1em; } /* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/responsive.css b/phpBB/styles/prosilver/theme/responsive.css index bc606e9723..3b556b22db 100644 --- a/phpBB/styles/prosilver/theme/responsive.css +++ b/phpBB/styles/prosilver/theme/responsive.css @@ -3,6 +3,8 @@ /* -------------------------------------------------------------- */ /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ +/* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ @media (max-width: 320px) { select, @@ -30,15 +32,15 @@ } .action-bar .search-box .inputbox ::-moz-placeholder { - content: 'Search...'; + content: "Search..."; } .action-bar .search-box .inputbox :-ms-input-placeholder { - content: 'Search...'; + content: "Search..."; } .action-bar .search-box .inputbox ::-webkit-input-placeholder { - content: 'Search...'; + content: "Search..."; } } @@ -299,8 +301,8 @@ } ul.topiclist li.row dt a.subforum { - text-overflow: ellipsis; vertical-align: bottom; + text-overflow: ellipsis; overflow: hidden; max-width: 100px; } @@ -360,7 +362,7 @@ table.responsive td > dfn:after { padding-right: 5px; - content: ':'; + content: ":"; } table.responsive span.rank-img { @@ -368,7 +370,7 @@ padding-right: 5px; } - table.responsive.memberlist td:first-child input[type='checkbox'] { + table.responsive.memberlist td:first-child input[type="checkbox"] { float: right; } @@ -455,7 +457,7 @@ margin-left: 20px; } - fieldset.quick-login label[for='autologin'] { + fieldset.quick-login label[for="autologin"] { text-align: right; display: inline-block; min-width: 50%; @@ -647,4 +649,7 @@ } } -/* stylelint-enable */ +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ diff --git a/phpBB/styles/prosilver/theme/stylesheet.css b/phpBB/styles/prosilver/theme/stylesheet.css index 0c29ccee30..ddae99a94e 100644 --- a/phpBB/styles/prosilver/theme/stylesheet.css +++ b/phpBB/styles/prosilver/theme/stylesheet.css @@ -7,15 +7,15 @@ -------------------------------------------------------------- */ -@import url('normalize.css?v=3.3'); -@import url('base.css?v=3.3'); -@import url('utilities.css?v=3.3'); -@import url('common.css?v=3.3'); -@import url('links.css?v=3.3'); -@import url('content.css?v=3.3'); -@import url('buttons.css?v=3.3'); -@import url('cp.css?v=3.3'); -@import url('forms.css?v=3.3'); -@import url('icons.css?v=3.3'); -@import url('colours.css?v=3.3'); -@import url('responsive.css?v=3.3'); +@import url("normalize.css?v=3.3"); +@import url("base.css?v=3.3"); +@import url("utilities.css?v=3.3"); +@import url("common.css?v=3.3"); +@import url("links.css?v=3.3"); +@import url("content.css?v=3.3"); +@import url("buttons.css?v=3.3"); +@import url("cp.css?v=3.3"); +@import url("forms.css?v=3.3"); +@import url("icons.css?v=3.3"); +@import url("colours.css?v=3.3"); +@import url("responsive.css?v=3.3"); diff --git a/phpBB/styles/prosilver/theme/tweaks.css b/phpBB/styles/prosilver/theme/tweaks.css index db629c19f5..c8075c0252 100644 --- a/phpBB/styles/prosilver/theme/tweaks.css +++ b/phpBB/styles/prosilver/theme/tweaks.css @@ -4,6 +4,7 @@ These style definitions are IE 8 & 9 only. They are required due to the poor CSS support in IE browsers. /* -------------------------------------------------------------- */ + /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable selector-no-qualifying-type */ @@ -27,7 +28,7 @@ dd label input { height: 20px\9; } -/* IE8 often can't handle max-width in %, so we use px instead */ +/* IE8 often can"t handle max-width in %, so we use px instead */ .postprofile .avatar img { max-width: 150px\9; } @@ -45,14 +46,16 @@ dd label input { .headerbar, .forumbg { - background-image: url('./images/bg_header.gif'); + background-image: url("./images/bg_header.gif"); } .forabg { - background-image: url('./images/bg_list.gif'); + background-image: url("./images/bg_list.gif"); } .tabs .tab > a { border-radius: 0; } -/* stylelint-enable */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ diff --git a/phpBB/styles/prosilver/theme/utilities.css b/phpBB/styles/prosilver/theme/utilities.css index bcee77cec5..ab47754d5d 100644 --- a/phpBB/styles/prosilver/theme/utilities.css +++ b/phpBB/styles/prosilver/theme/utilities.css @@ -32,7 +32,7 @@ .row:before, .row:after { display: table; - content: ' '; + content: " "; } .clearfix:after, @@ -72,8 +72,8 @@ font: 0/0 a; background-color: transparent; border: 0; - color: transparent; text-shadow: none; + color: transparent; } .hidden { From 8713c71776f9fd4677fad5b2f56eedd5ea97e73f Mon Sep 17 00:00:00 2001 From: hanakin Date: Sat, 18 Mar 2017 18:06:58 -0400 Subject: [PATCH 04/16] [ticket/15115] prep for rebase PHPBB3-15115 --- phpBB/styles/prosilver/theme/colours.css | 58 +----------------------- phpBB/styles/prosilver/theme/forms.css | 35 -------------- 2 files changed, 1 insertion(+), 92 deletions(-) diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 9113f000b1..5c2b996f17 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -1190,7 +1190,7 @@ label { } option.disabled-option { - color: graytext; + color: #7f7f7f; } /* definition list layout for forms */ @@ -1261,62 +1261,6 @@ fieldset.quick-login input.inputbox { color: transparent; } -/* form button styles */ - -a.button1, -input.button1, -input.button3, -a.button2, -input.button2 { - background-color: #efefef; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #d2d2d2 0%, #efefef 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#d2d2d2", endcolorstr="#efefef", gradienttype=0); /* ie6-9 */ - color: #000000; -} - -a.button1, -input.button1 { - border-color: #666666; -} - -input.button3 { - background-image: none; -} - -/* alternative button */ -a.button2, -input.button2, -input.button3 { - border-color: #666666; -} - -/* button in the style of the form buttons */ -a.button1, -a.button2 { - color: #000000; -} - -/* hover states */ -a.button1:hover, -input.button1:hover, -a.button2:hover, -input.button2:hover, -input.button3:hover { - background-color: #d2d2d2; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #efefef 0%, #d2d2d2 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#efefef", endcolorstr="#d2d2d2", gradienttype=0); /* ie6-9 */ - border-color: #d31141; - color: #d31141; -} - -/* focus states */ -input.button1:focus, -input.button2:focus, -input.button3:focus { - border-color: #11a3ea; - color: #0f4987; -} - input.disabled { color: #666666; } diff --git a/phpBB/styles/prosilver/theme/forms.css b/phpBB/styles/prosilver/theme/forms.css index 70ed28543d..8b69ac9168 100644 --- a/phpBB/styles/prosilver/theme/forms.css +++ b/phpBB/styles/prosilver/theme/forms.css @@ -344,41 +344,6 @@ input[type="search"]::-webkit-search-cancel-button { cursor: pointer; } -/* Form button styles ----------------------------------------- */ -input.button1, -input.button2 { - font-size: 1em; -} - -a.button1, -input.button1, -input.button3, -a.button2, -input.button2 { - font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; - line-height: 1.5; - background: transparent none repeat-x top left; - width: auto !important; - padding-top: 1px; - padding-bottom: 1px; -} - -a.button1, -input.button1 { - font-weight: bold; - border: 1px solid transparent; -} - -input.button3 { - font-variant: small-caps; - line-height: 5px; - background-image: none; - height: 12px; - margin: 0; - padding: 0; -} - input[type="button"], input[type="submit"], input[type="reset"], From c6f2f00a7845a6c4a1fd46ba57fbc3f425825e8f Mon Sep 17 00:00:00 2001 From: hanakin Date: Sat, 18 Mar 2017 18:10:52 -0400 Subject: [PATCH 05/16] [ticket/15115] more prep for rebase PHPBB3-15115 --- phpBB/styles/prosilver/theme/buttons.css | 2 +- phpBB/styles/prosilver/theme/colours.css | 5 ++--- phpBB/styles/prosilver/theme/forms.css | 16 ---------------- 3 files changed, 3 insertions(+), 20 deletions(-) diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index ed1b86ab25..9c5ba0d486 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -44,7 +44,7 @@ ---------------------------------------- */ .button-form, .button-form-bold { - font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; + font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; border-radius: 0; } diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 5c2b996f17..2cd236f431 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -661,18 +661,17 @@ dd.profile-warnings { .button-form:hover, .button-form-bold:hover { border-color: #d31141; - color: #d31141; text-shadow: none; + color: #d31141; } .button-form:focus, .button-form-bold:focus { border-color: #0a8ed0; - color: #0a8ed0; text-shadow: none; + color: #0a8ed0; } - .button-secondary:focus, .button-secondary:hover, .button:focus .icon, diff --git a/phpBB/styles/prosilver/theme/forms.css b/phpBB/styles/prosilver/theme/forms.css index 8b69ac9168..6cec12a3ce 100644 --- a/phpBB/styles/prosilver/theme/forms.css +++ b/phpBB/styles/prosilver/theme/forms.css @@ -352,22 +352,6 @@ input[type="radio"] { cursor: pointer; } -/* Alternative button */ -a.button2, -input.button2, -input.button3 { - border: 1px solid transparent; -} - -/* button in the style of the form buttons */ -a.button1, -a.button2 { - vertical-align: text-bottom; - text-decoration: none; - padding: 0 3px; -/* Hover states */ -} - input.disabled { font-weight: normal; } From f1ad532a567543fb594ff65433b4780d021f74d8 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sat, 18 Mar 2017 18:17:50 -0400 Subject: [PATCH 06/16] [ticket/15115] pkg.json must be in root PHPBB3-15115 --- phpBB/package.json => package.json | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename phpBB/package.json => package.json (100%) diff --git a/phpBB/package.json b/package.json similarity index 100% rename from phpBB/package.json rename to package.json From 9f5dc941dc5a1628b9a8b8284cc8c471ef8d3a33 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sat, 18 Mar 2017 18:21:22 -0400 Subject: [PATCH 07/16] [ticket/15115] Slight tweaks to rc and sorting file PHPBB3-15115 --- .postcss-sorting.json | 1 - .stylelintrc | 19 +++++++++++-------- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/.postcss-sorting.json b/.postcss-sorting.json index af119c28c4..fa52bd6769 100644 --- a/.postcss-sorting.json +++ b/.postcss-sorting.json @@ -2,7 +2,6 @@ "order": [ "custom-properties", "dollar-variables", - "at-rules", "declarations", { "type": "at-rule", diff --git a/.stylelintrc b/.stylelintrc index 094033df34..cc261b4622 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -12,7 +12,11 @@ "at-rule-no-vendor-prefix": true, "at-rule-semicolon-newline-after": "always", - "block-closing-brace-newline-after": "always", + "block-closing-brace-newline-after": [ + "always", { + "ignoreAtRules": ["if", "else"] + } + ], "block-closing-brace-newline-before": "always-multi-line", "block-closing-brace-space-after": "always-single-line", "block-closing-brace-space-before": "always-single-line", @@ -59,11 +63,11 @@ "declaration-empty-line-before": "never", "declaration-property-unit-blacklist": { - "line-height": ["rem", "em", "%"] + "line-height": ["rem", "px", "em", "%"] }, "declaration-property-unit-whitelist": { - "height": ["px", "%"], - "width": ["px", "%"], + "height": ["px", "%", "vh"], + "width": ["px", "%", "vw"], "font-size": ["px", "rem", "%"], "margin-left": ["px", "rem", "%"], "margin-right": ["px", "rem", "%"], @@ -72,7 +76,9 @@ "padding-left": ["px", "rem"], "padding-right": ["px", "rem"], "padding-top": ["px", "rem"], - "padding-bottom": ["px", "rem"] + "padding-bottom": ["px", "rem"], + "letter-spacing": ["em"], + "word-spacing": ["em"] }, "font-family-name-quotes": "always-where-recommended", @@ -178,7 +184,6 @@ "order/declaration-block-order": [ "custom-properties", "dollar-variables", - "at-rules", "declarations", { "type": "at-rule", @@ -187,8 +192,6 @@ "rules" ], "order/declaration-block-properties-specified-order": [ - "-moz-osx-font-smoothing", - "-webkit-font-smoothing", "font", "font-family", "font-size", From 8f25f40321fe6fda010bef64d11f4c7b65f5e497 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sat, 18 Mar 2017 19:38:12 -0400 Subject: [PATCH 08/16] [ticket/15115] Fix print.css errors PHPBB3-15115 --- phpBB/styles/prosilver/theme/print.css | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/phpBB/styles/prosilver/theme/print.css b/phpBB/styles/prosilver/theme/print.css index de7531c483..271606b0fe 100644 --- a/phpBB/styles/prosilver/theme/print.css +++ b/phpBB/styles/prosilver/theme/print.css @@ -4,7 +4,6 @@ /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable declaration-property-unit-whitelist */ -/* stylelint-disable declaration-property-unit-blacklist */ /* Lots still TODO here! */ @@ -217,12 +216,10 @@ ul { display: none; } -/* stylelint-disable declaration-property-unit-whitelist */ .emoji { - min-height: 18px; + width: 1em; min-width: 18px; height: 1em; - width: 1em; + min-height: 18px; } /* stylelint-enable declaration-property-unit-whitelist */ -/* stylelint-enable declaration-property-unit-blacklist */ From 3b67065d8962c51e5f797aa884e9fd2af5b55fc9 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 12:32:48 -0400 Subject: [PATCH 09/16] [ticket/15115] Update tests to run on proprer dir PHPBB3-15115 --- travis/check-stylesheet.sh | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/travis/check-stylesheet.sh b/travis/check-stylesheet.sh index a834833399..83bafaa03a 100755 --- a/travis/check-stylesheet.sh +++ b/travis/check-stylesheet.sh @@ -15,7 +15,6 @@ NOTESTS=$1 if [ "$NOTESTS" == '1' ] then - cd phpBB # Define a node version. TRAVIS_NODE_VERSION="4" @@ -33,7 +32,7 @@ then npm install -g > /dev/null npm install > /dev/null set -x - stylelint --config ../.stylelintrc "styles/prosilver/theme/*.css" + stylelint --config ../.stylelintrc "phpBB/styles/prosilver/theme/*.css" # Disable admin stylelint for now - # stylelint --config ../.stylelintrc "adm/style/*.css" + # stylelint --config ../.stylelintrc "phpBB/adm/style/*.css" fi From 09dbd305419b60087ddcd2e80e6937c133fe9801 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 13:11:38 -0400 Subject: [PATCH 10/16] [ticket/15115] Small tweak to orders PHPBB3-15115 --- .postcss-sorting.json | 9 +- .stylelintrc | 354 +++++++++++++++++++++--------------------- 2 files changed, 187 insertions(+), 176 deletions(-) diff --git a/.postcss-sorting.json b/.postcss-sorting.json index fa52bd6769..98f1126af1 100644 --- a/.postcss-sorting.json +++ b/.postcss-sorting.json @@ -13,8 +13,6 @@ { "emptyLineBefore": false, "properties": [ - "-moz-osx-font-smoothing", - "-webkit-font-smoothing", "font", "font-family", "font-size", @@ -28,6 +26,7 @@ "font-emphasize-position", "font-emphasize-style", "font-smooth", + "font-smoothing", "line-height", "text-align", "text-align-last", @@ -45,6 +44,7 @@ "writing-mode", "text-outline", "text-transform", + "text-size-adjust", "text-wrap", "text-overflow", "text-overflow-ellipsis", @@ -111,7 +111,8 @@ "outline-width", "outline-style", "outline-color", - "outline-offset" + "outline-offset", + "tap-highlight-color" ] }, { @@ -150,6 +151,7 @@ "overflow", "overflow-x", "overflow-y", + "overflow-scrolling", "clip", "zoom", "flex", @@ -211,6 +213,7 @@ "counter-increment", "resize", "cursor", + "touch-callout", "user-select", "nav-index", "nav-up", diff --git a/.stylelintrc b/.stylelintrc index cc261b4622..8aeda79f71 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -192,188 +192,196 @@ "rules" ], "order/declaration-block-properties-specified-order": [ - "font", - "font-family", - "font-size", - "font-weight", - "font-style", - "font-variant", - "font-size-adjust", - "font-stretch", - "font-effect", - "font-emphasize", - "font-emphasize-position", - "font-emphasize-style", - "font-smooth", - "line-height", - "text-align", - "text-align-last", - "vertical-align", - "white-space", - "text-decoration", - "text-emphasis", - "text-emphasis-color", - "text-emphasis-style", - "text-emphasis-position", - "text-indent", - "text-justify", - "letter-spacing", - "word-spacing", - "writing-mode", - "text-outline", - "text-transform", - "text-wrap", - "text-overflow", - "text-overflow-ellipsis", - "text-overflow-mode", - "word-wrap", - "word-break", - "tab-size", - "hyphens", + [ + "font", + "font-family", + "font-size", + "font-weight", + "font-style", + "font-variant", + "font-size-adjust", + "font-stretch", + "font-effect", + "font-emphasize", + "font-emphasize-position", + "font-emphasize-style", + "font-smooth", + "font-smoothing", + "line-height", + "text-align", + "text-align-last", + "vertical-align", + "white-space", + "text-decoration", + "text-emphasis", + "text-emphasis-color", + "text-emphasis-style", + "text-emphasis-position", + "text-indent", + "text-justify", + "letter-spacing", + "word-spacing", + "writing-mode", + "text-outline", + "text-transform", + "text-size-adjust", + "text-wrap", + "text-overflow", + "text-overflow-ellipsis", + "text-overflow-mode", + "word-wrap", + "word-break", + "tab-size", + "hyphens", - "background", - "background-color", - "background-image", - "background-repeat", - "background-attachment", - "background-position", - "background-position-x", - "background-position-y", - "background-clip", - "background-origin", - "background-size", - "interpolation-mode", - "filter", + "background", + "background-color", + "background-image", + "background-repeat", + "background-attachment", + "background-position", + "background-position-x", + "background-position-y", + "background-clip", + "background-origin", + "background-size", + "interpolation-mode", + "filter", - "border", - "border-width", - "border-style", - "border-color", - "border-top", - "border-top-width", - "border-top-style", - "border-top-color", - "border-right", - "border-right-width", - "border-right-style", - "border-right-color", - "border-bottom", - "border-bottom-width", - "border-bottom-style", - "border-bottom-color", - "border-left", - "border-left-width", - "border-left-style", - "border-left-color", - "border-radius", - "border-top-left-radius", - "border-top-right-radius", - "border-bottom-right-radius", - "border-bottom-left-radius", - "border-image", - "border-image-source", - "border-image-slice", - "border-image-width", - "border-image-outset", - "border-image-repeat", - "outline", - "outline-width", - "outline-style", - "outline-color", - "outline-offset", + "border", + "border-width", + "border-style", + "border-color", + "border-top", + "border-top-width", + "border-top-style", + "border-top-color", + "border-right", + "border-right-width", + "border-right-style", + "border-right-color", + "border-bottom", + "border-bottom-width", + "border-bottom-style", + "border-bottom-color", + "border-left", + "border-left-width", + "border-left-style", + "border-left-color", + "border-radius", + "border-top-left-radius", + "border-top-right-radius", + "border-bottom-right-radius", + "border-bottom-left-radius", + "border-image", + "border-image-source", + "border-image-slice", + "border-image-width", + "border-image-outset", + "border-image-repeat", + "outline", + "outline-width", + "outline-style", + "outline-color", + "outline-offset", + "tap-highlight-color", - "box-decoration-break", - "box-shadow", - "text-shadow", + "box-decoration-break", + "box-shadow", + "text-shadow", - "color", - "opacity", + "color", + "opacity", - "position", - "z-index", - "top", - "right", - "bottom", - "left", + "position", + "z-index", + "top", + "right", + "bottom", + "left", - "display", - "visibility", - "float", - "clear", - "overflow", - "overflow-x", - "overflow-y", - "clip", - "zoom", - "flex", - "flex-direction", - "flex-order", - "flex-pack", - "flex-align", - "flex-basis", - "flex-grow", - "flex-shrink", - "flex-wrap", - "justify-content", - "align-items", - "align-self", + "display", + "visibility", + "float", + "clear", + "overflow", + "overflow-x", + "overflow-y", + "overflow-scrolling", + "clip", + "zoom", + "flex", + "flex-direction", + "flex-order", + "flex-pack", + "flex-align", + "flex-basis", + "flex-grow", + "flex-shrink", + "flex-wrap", + "justify-content", + "align-items", + "align-self", - "box-sizing", - "width", - "min-width", - "max-width", - "height", - "min-height", - "max-height", - "margin", - "margin-top", - "margin-right", - "margin-bottom", - "margin-left", - "padding", - "padding-top", - "padding-right", - "padding-bottom", - "padding-left", + "box-sizing", + "width", + "min-width", + "max-width", + "height", + "min-height", + "max-height", + "margin", + "margin-top", + "margin-right", + "margin-bottom", + "margin-left", + "padding", + "padding-top", + "padding-right", + "padding-bottom", + "padding-left", - "table-layout", - "empty-cells", - "caption-side", - "border-spacing", - "border-collapse", - "list-style", - "list-style-position", - "list-style-type", - "list-style-image", + "table-layout", + "empty-cells", + "caption-side", + "border-spacing", + "border-collapse", + "list-style", + "list-style-position", + "list-style-type", + "list-style-image", - "content", - "quotes", - "counter-reset", - "counter-increment", - "resize", - "cursor", - "user-select", - "nav-index", - "nav-up", - "nav-right", - "nav-down", - "nav-left", - "transition", - "transition-delay", - "transition-timing-function", - "transition-duration", - "transition-property", - "transform", - "transform-origin", - "animation", - "animation-name", - "animation-duration", - "animation-play-state", - "animation-timing-function", - "animation-delay", - "animation-iteration-count", - "animation-direction", - "pointer-events" + "content", + "quotes", + "counter-reset", + "counter-increment", + "resize", + "cursor", + "touch-callout", + "user-select", + "nav-index", + "nav-up", + "nav-right", + "nav-down", + "nav-left", + "transition", + "transition-delay", + "transition-timing-function", + "transition-duration", + "transition-property", + "transform", + "transform-origin", + "animation", + "animation-name", + "animation-duration", + "animation-play-state", + "animation-timing-function", + "animation-delay", + "animation-iteration-count", + "animation-direction", + "pointer-events" + ], + { unspecified: "bottomAlphabetical" } ] } } From ae85c9e91dec7714bf1b094468490b6a7929e643 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 13:41:27 -0400 Subject: [PATCH 11/16] [ticket/15115] minor order adjustments PHPBB3-15115 --- .postcss-sorting.json | 1 + .stylelintrc | 1 + 2 files changed, 2 insertions(+) diff --git a/.postcss-sorting.json b/.postcss-sorting.json index 98f1126af1..a1bc5ff1ae 100644 --- a/.postcss-sorting.json +++ b/.postcss-sorting.json @@ -214,6 +214,7 @@ "resize", "cursor", "touch-callout", + "touch-action", "user-select", "nav-index", "nav-up", diff --git a/.stylelintrc b/.stylelintrc index 8aeda79f71..003b87c42f 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -358,6 +358,7 @@ "resize", "cursor", "touch-callout", + "touch-action", "user-select", "nav-index", "nav-up", From 79f865bd561872a50e490f23bd095c0251a147b5 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 16:15:33 -0400 Subject: [PATCH 12/16] [ticket/15115] Fix errors PHPBB3-15115 --- phpBB/styles/prosilver/theme/buttons.css | 2 +- phpBB/styles/prosilver/theme/colours.css | 11 ++--------- phpBB/styles/prosilver/theme/common.css | 10 ++++++---- phpBB/styles/prosilver/theme/icons.css | 6 ++++-- phpBB/styles/prosilver/theme/print.css | 3 +++ 5 files changed, 16 insertions(+), 16 deletions(-) diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css index 9c5ba0d486..55ecb53d05 100644 --- a/phpBB/styles/prosilver/theme/buttons.css +++ b/phpBB/styles/prosilver/theme/buttons.css @@ -17,11 +17,11 @@ display: inline-block; padding: 2px 8px; cursor: pointer; + touch-action: manipulation; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; user-select: none; - touch-action: manipulation; } .button:focus, diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index 2cd236f431..f740dafb2c 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -1094,20 +1094,13 @@ ul.cplist { color: #d31141; } -/* This ID needs factored out */ @media only screen and (max-width: 900px), only screen and (max-device-width: 900px) { - /* stylelint-disable selector-no-id */ - #navigation a, - .rtl #navigation a { + .navigation a, + .rtl .navigation a { background: #b2c2cf; } - /* stylelint-enable */ } -/* stylelint-disable selector-max-compound-selectors */ -/* stylelint-disable selector-no-qualifying-type */ -/* stylelint-disable no-indistinguishable-colors */ - /* preferences pane layout */ .panel-container h2 { color: #333333; diff --git a/phpBB/styles/prosilver/theme/common.css b/phpBB/styles/prosilver/theme/common.css index da10394181..b5c2cfc5f6 100644 --- a/phpBB/styles/prosilver/theme/common.css +++ b/phpBB/styles/prosilver/theme/common.css @@ -1055,12 +1055,14 @@ fieldset.fields1 dl.pmlist dd.recipients { animation: rotator 1s linear infinite; } +/* stylelint-disable no-unknown-animations */ .spinner-path { - stroke-dasharray: 187; - stroke-dashoffset: 0; transform-origin: center; animation: dash 1s ease-in-out infinite, colors 4s ease-in-out infinite; + stroke-dasharray: 187; + stroke-dashoffset: 0; } +/* stylelint-enable no-unknown-animations */ @keyframes rotator { 0% { @@ -1078,13 +1080,13 @@ fieldset.fields1 dl.pmlist dd.recipients { } 50% { - stroke-dashoffset: 46.75; transform: rotate(135deg); + stroke-dashoffset: 46.75; } 100% { - stroke-dashoffset: 187; transform: rotate(450deg); + stroke-dashoffset: 187; } } diff --git a/phpBB/styles/prosilver/theme/icons.css b/phpBB/styles/prosilver/theme/icons.css index 534ecb2dde..ce202f1b9d 100644 --- a/phpBB/styles/prosilver/theme/icons.css +++ b/phpBB/styles/prosilver/theme/icons.css @@ -11,15 +11,17 @@ */ .icon, .button .icon { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; font-family: FontAwesome; font-size: 14px; font-weight: normal; font-style: normal; font-variant: normal; + -webkit-font-smoothing: antialiased; line-height: 1; display: inline-block; + /* stylelint-disable order/declaration-block-properties-specified-order */ + -moz-osx-font-smoothing: grayscale; + /* stylelint-enable order/declaration-block-properties-specified-order */ text-rendering: auto; /* optimizelegibility throws things off #1094 */ } diff --git a/phpBB/styles/prosilver/theme/print.css b/phpBB/styles/prosilver/theme/print.css index 271606b0fe..753e6bebe5 100644 --- a/phpBB/styles/prosilver/theme/print.css +++ b/phpBB/styles/prosilver/theme/print.css @@ -4,6 +4,7 @@ /* stylelint-disable selector-max-compound-selectors */ /* stylelint-disable declaration-property-unit-whitelist */ +/* stylelint-disable declaration-property-unit-blacklist */ /* Lots still TODO here! */ @@ -222,4 +223,6 @@ ul { height: 1em; min-height: 18px; } +/* stylelint-enable selector-max-compound-selectors */ /* stylelint-enable declaration-property-unit-whitelist */ +/* stylelint-enable declaration-property-unit-blacklist */ From 3173b463159cf74eedf079eff8cc90d957395a18 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 16:15:58 -0400 Subject: [PATCH 13/16] [ticket/15115] fix stylelintrc error PHPBB3-15115 --- .stylelintrc | 5 ----- 1 file changed, 5 deletions(-) diff --git a/.stylelintrc b/.stylelintrc index 003b87c42f..160816a389 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -131,11 +131,6 @@ "property-case": "lower", "property-no-unknown": true, - "rule-empty-line-before": ["always", { - "ignore": ["after-comment"], - "except": ["first-nested"] - }], - "selector-attribute-brackets-space-inside": "never", "selector-attribute-operator-space-after": "never", "selector-attribute-operator-space-before": "never", From 1f224233c77325a5ebc635e248878a24f5493738 Mon Sep 17 00:00:00 2001 From: hanakin Date: Sun, 19 Mar 2017 16:16:27 -0400 Subject: [PATCH 14/16] [ticket/15115] Fix test paths PHPBB3-15115 --- travis/check-stylesheet.sh | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/travis/check-stylesheet.sh b/travis/check-stylesheet.sh index 83bafaa03a..d056ff9c47 100755 --- a/travis/check-stylesheet.sh +++ b/travis/check-stylesheet.sh @@ -32,7 +32,7 @@ then npm install -g > /dev/null npm install > /dev/null set -x - stylelint --config ../.stylelintrc "phpBB/styles/prosilver/theme/*.css" + stylelint "phpBB/styles/prosilver/theme/*.css" # Disable admin stylelint for now - # stylelint --config ../.stylelintrc "phpBB/adm/style/*.css" + # stylelint "phpBB/adm/style/*.css" fi From 74fcd60afea032c1af3fe8ec71ea35be47458c49 Mon Sep 17 00:00:00 2001 From: hanakin Date: Fri, 24 Mar 2017 20:33:24 -0400 Subject: [PATCH 15/16] [ticket/15115] Update grads & single line rules PHPBB3-15115 --- .postcss-sorting.json | 15 +- .stylelintrc | 16 +- phpBB/styles/prosilver/theme/colours.css | 338 ++++++----------------- 3 files changed, 98 insertions(+), 271 deletions(-) diff --git a/.postcss-sorting.json b/.postcss-sorting.json index a1bc5ff1ae..11a55f3c3d 100644 --- a/.postcss-sorting.json +++ b/.postcss-sorting.json @@ -2,12 +2,16 @@ "order": [ "custom-properties", "dollar-variables", + { + "type": "at-rule", + "name": "include" + }, "declarations", + "rules", { "type": "at-rule", "name": "media" - }, - "rules" + } ], "properties-order": [ { @@ -70,12 +74,7 @@ "background-origin", "background-size", "interpolation-mode", - "filter" - ] - }, - { - "emptyLineBefore": false, - "properties": [ + "filter", "border", "border-width", "border-style", diff --git a/.stylelintrc b/.stylelintrc index 160816a389..4740068395 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -18,12 +18,11 @@ } ], "block-closing-brace-newline-before": "always-multi-line", - "block-closing-brace-space-after": "always-single-line", "block-closing-brace-space-before": "always-single-line", "block-no-empty": true, - "block-opening-brace-newline-after": "always", + "block-opening-brace-newline-after": "always-multi-line", "block-opening-brace-space-after": "always-single-line", "block-opening-brace-space-before": "always", @@ -131,6 +130,11 @@ "property-case": "lower", "property-no-unknown": true, + "rule-empty-line-before": ["always-multi-line", { + "ignore": ["after-comment"], + "except": ["first-nested"] + }], + "selector-attribute-brackets-space-inside": "never", "selector-attribute-operator-space-after": "never", "selector-attribute-operator-space-before": "never", @@ -179,12 +183,16 @@ "order/declaration-block-order": [ "custom-properties", "dollar-variables", + { + "type": "at-rule", + "name": "include" + }, "declarations", + "rules", { "type": "at-rule", "name": "media" - }, - "rules" + } ], "order/declaration-block-properties-specified-order": [ [ diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css index f740dafb2c..f5b0211f03 100644 --- a/phpBB/styles/prosilver/theme/colours.css +++ b/phpBB/styles/prosilver/theme/colours.css @@ -161,10 +161,6 @@ ul.zebra-list li:nth-child(even) { background-color: #e7e8ea; } -.site_logo { - background-image: url("./images/site_logo.gif"); -} - /* horizontal lists */ ul.navlinks { @@ -336,9 +332,8 @@ p.post-notice { ------------------------------------------------------------- */ ul.forums { - background-color: #eef5f9; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #d2e0eb 0%, #eef5f9 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#d2e0eb", endcolorstr="#eef5f9", gradienttype=0); /* ie6-9 */ + background-color: #eef5f9; + background-image: linear-gradient(to bottom, #d2e0eb 0%, #eef5f9 100%); } ul.topiclist li { @@ -594,10 +589,6 @@ fieldset.polls dd div { color: #000000; } -.online { - background-image: url("./en/icon_user_online.gif"); -} - dd.profile-warnings { color: #bc2a4d; } @@ -627,9 +618,8 @@ dd.profile-warnings { /* colours and backgrounds for buttons.css ------------------------------------------------------------- */ .button { - background-color: #e9e9e9; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #ffffff 0%, #e9e9e9 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#ffffff", endcolorstr="#e9e9e9", gradienttype=0); /* ie6-9 */ + background-color: #e9e9e9; + background-image: linear-gradient(to bottom, #ffffff 0%, #e9e9e9 100%); border-color: #c7c3bf; -webkit-box-shadow: 0 0 0 1px #ffffff inset; box-shadow: 0 0 0 1px #ffffff inset; @@ -638,9 +628,8 @@ dd.profile-warnings { .button:hover, .button:focus { - background-color: #ffffff; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #e9e9e9 0%, #ffffff 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#e9e9e9", endcolorstr="#ffffff", gradienttype=0); /* ie6-9 */ + background-color: #ffffff; + background-image: linear-gradient(to bottom, #e9e9e9 0%, #ffffff 100%); border-color: #0a8ed0; text-shadow: 1px 1px 0 #ffffff, -1px -1px 0 #ffffff, -1px -1px 0 rgba(188, 42, 77, 0.2); } @@ -743,244 +732,78 @@ dd.profile-warnings { box-shadow: 0 0 10px #0075b0; } -/* icon images */ -.contact-icon { - background-image: url("./images/icons_contact.png"); -} +.site_logo { background-image: url("./images/site_logo.gif"); } +.contact-icon { background-image: url("./images/icons_contact.png"); } -/* profile & navigation icons */ -.pm-icon { - background-position: 0 0; -} - -.email-icon { - background-position: -21px 0; -} - -.jabber-icon { - background-position: -80px 0; -} - -.phpbb_icq-icon { - background-position: -61px 0; -} - -.phpbb_wlm-icon { - background-position: -182px 0; -} - -.phpbb_aol-icon { - background-position: -244px 0; -} - -.phpbb_website-icon { - background-position: -40px 0; -} - -.phpbb_youtube-icon { - background-position: -98px 0; -} - -.phpbb_facebook-icon { - background-position: -119px 0; -} - -.phpbb_googleplus-icon { - background-position: -140px 0; -} - -.phpbb_skype-icon { - background-position: -161px 0; -} - -.phpbb_twitter-icon { - background-position: -203px 0; -} - -.phpbb_yahoo-icon { - background-position: -224px 0; -} +/* profile icons */ +.online { background-image: url("./en/icon_user_online.gif"); } +.pm-icon { background-position: 0 0; } +.email-icon { background-position: -21px 0; } +.jabber-icon { background-position: -80px 0; } +.phpbb_icq-icon { background-position: -61px 0; } +.phpbb_wlm-icon { background-position: -182px 0; } +.phpbb_aol-icon { background-position: -244px 0; } +.phpbb_website-icon { background-position: -40px 0; } +.phpbb_youtube-icon { background-position: -98px 0; } +.phpbb_facebook-icon { background-position: -119px 0; } +.phpbb_googleplus-icon { background-position: -140px 0; } +.phpbb_skype-icon { background-position: -161px 0; } +.phpbb_twitter-icon { background-position: -203px 0; } +.phpbb_yahoo-icon { background-position: -224px 0; } /* forum icons & topic icons */ -.global_read { - background-image: url("./images/announce_read.gif"); -} +.global_read { background-image: url("./images/announce_read.gif"); } +.global_read_mine { background-image: url("./images/announce_read_mine.gif"); } +.global_read_locked { background-image: url("./images/announce_read_locked.gif"); } +.global_read_locked_mine { background-image: url("./images/announce_read_locked_mine.gif"); } +.global_unread { background-image: url("./images/announce_unread.gif"); } +.global_unread_mine { background-image: url("./images/announce_unread_mine.gif"); } +.global_unread_locked { background-image: url("./images/announce_unread_locked.gif"); } +.global_unread_locked_mine { background-image: url("./images/announce_unread_locked_mine.gif"); } -.global_read_mine { - background-image: url("./images/announce_read_mine.gif"); -} +.announce_read { background-image: url("./images/announce_read.gif"); } +.announce_read_mine { background-image: url("./images/announce_read_mine.gif"); } +.announce_read_locked { background-image: url("./images/announce_read_locked.gif"); } +.announce_read_locked_mine { background-image: url("./images/announce_read_locked_mine.gif"); } +.announce_unread { background-image: url("./images/announce_unread.gif"); } +.announce_unread_mine { background-image: url("./images/announce_unread_mine.gif"); } +.announce_unread_locked { background-image: url("./images/announce_unread_locked.gif"); } +.announce_unread_locked_mine { background-image: url("./images/announce_unread_locked_mine.gif"); } -.global_read_locked { - background-image: url("./images/announce_read_locked.gif"); -} +.forum_link { background-image: url("./images/forum_link.gif"); } +.forum_read { background-image: url("./images/forum_read.gif"); } +.forum_read_locked { background-image: url("./images/forum_read_locked.gif"); } +.forum_read_subforum { background-image: url("./images/forum_read_subforum.gif"); } +.forum_unread { background-image: url("./images/forum_unread.gif"); } +.forum_unread_locked { background-image: url("./images/forum_unread_locked.gif"); } +.forum_unread_subforum { background-image: url("./images/forum_unread_subforum.gif"); } -.global_read_locked_mine { - background-image: url("./images/announce_read_locked_mine.gif"); -} - -.global_unread { - background-image: url("./images/announce_unread.gif"); -} - -.global_unread_mine { - background-image: url("./images/announce_unread_mine.gif"); -} - -.global_unread_locked { - background-image: url("./images/announce_unread_locked.gif"); -} - -.global_unread_locked_mine { - background-image: url("./images/announce_unread_locked_mine.gif"); -} - -.announce_read { - background-image: url("./images/announce_read.gif"); -} - -.announce_read_mine { - background-image: url("./images/announce_read_mine.gif"); -} - -.announce_read_locked { - background-image: url("./images/announce_read_locked.gif"); -} - -.announce_read_locked_mine { - background-image: url("./images/announce_read_locked_mine.gif"); -} - -.announce_unread { - background-image: url("./images/announce_unread.gif"); -} - -.announce_unread_mine { - background-image: url("./images/announce_unread_mine.gif"); -} - -.announce_unread_locked { - background-image: url("./images/announce_unread_locked.gif"); -} - -.announce_unread_locked_mine { - background-image: url("./images/announce_unread_locked_mine.gif"); -} - -.forum_link { - background-image: url("./images/forum_link.gif"); -} - -.forum_read { - background-image: url("./images/forum_read.gif"); -} - -.forum_read_locked { - background-image: url("./images/forum_read_locked.gif"); -} - -.forum_read_subforum { - background-image: url("./images/forum_read_subforum.gif"); -} - -.forum_unread { - background-image: url("./images/forum_unread.gif"); -} - -.forum_unread_locked { - background-image: url("./images/forum_unread_locked.gif"); -} - -.forum_unread_subforum { - background-image: url("./images/forum_unread_subforum.gif"); -} - -.sticky_read { - background-image: url("./images/sticky_read.gif"); -} - -.sticky_read_mine { - background-image: url("./images/sticky_read_mine.gif"); -} - -.sticky_read_locked { - background-image: url("./images/sticky_read_locked.gif"); -} - -.sticky_read_locked_mine { - background-image: url("./images/sticky_read_locked_mine.gif"); -} - -.sticky_unread { - background-image: url("./images/sticky_unread.gif"); -} - -.sticky_unread_mine { - background-image: url("./images/sticky_unread_mine.gif"); -} - -.sticky_unread_locked { - background-image: url("./images/sticky_unread_locked.gif"); -} - -.sticky_unread_locked_mine { - background-image: url("./images/sticky_unread_locked_mine.gif"); -} - -.topic_moved { - background-image: url("./images/topic_moved.gif"); -} +.sticky_read { background-image: url("./images/sticky_read.gif"); } +.sticky_read_mine { background-image: url("./images/sticky_read_mine.gif"); } +.sticky_read_locked { background-image: url("./images/sticky_read_locked.gif"); } +.sticky_read_locked_mine { background-image: url("./images/sticky_read_locked_mine.gif"); } +.sticky_unread { background-image: url("./images/sticky_unread.gif"); } +.sticky_unread_mine { background-image: url("./images/sticky_unread_mine.gif"); } +.sticky_unread_locked { background-image: url("./images/sticky_unread_locked.gif"); } +.sticky_unread_locked_mine { background-image: url("./images/sticky_unread_locked_mine.gif"); } .pm_read, -.topic_read { - background-image: url("./images/topic_read.gif"); -} - -.topic_read_mine { - background-image: url("./images/topic_read_mine.gif"); -} - -.topic_read_hot { - background-image: url("./images/topic_read_hot.gif"); -} - -.topic_read_hot_mine { - background-image: url("./images/topic_read_hot_mine.gif"); -} - -.topic_read_locked { - background-image: url("./images/topic_read_locked.gif"); -} - -.topic_read_locked_mine { - background-image: url("./images/topic_read_locked_mine.gif"); -} +.topic_read { background-image: url("./images/topic_read.gif"); } +.topic_moved { background-image: url("./images/topic_moved.gif"); } +.topic_read_mine { background-image: url("./images/topic_read_mine.gif"); } +.topic_read_hot { background-image: url("./images/topic_read_hot.gif"); } +.topic_read_hot_mine { background-image: url("./images/topic_read_hot_mine.gif"); } +.topic_read_locked { background-image: url("./images/topic_read_locked.gif"); } +.topic_read_locked_mine { background-image: url("./images/topic_read_locked_mine.gif"); } .pm_unread, -.topic_unread { - background-image: url("./images/topic_unread.gif"); -} - -.topic_unread_mine { - background-image: url("./images/topic_unread_mine.gif"); -} - -.topic_unread_hot { - background-image: url("./images/topic_unread_hot.gif"); -} - -.topic_unread_hot_mine { - background-image: url("./images/topic_unread_hot_mine.gif"); -} - -.topic_unread_locked { - background-image: url("./images/topic_unread_locked.gif"); -} - -.topic_unread_locked_mine { - background-image: url("./images/topic_unread_locked_mine.gif"); -} - +.topic_unread { background-image: url("./images/topic_unread.gif"); } +.topic_unread_mine { background-image: url("./images/topic_unread_mine.gif"); } +.topic_unread_hot { background-image: url("./images/topic_unread_hot.gif"); } +.topic_unread_hot_mine { background-image: url("./images/topic_unread_hot_mine.gif"); } +.topic_unread_locked { background-image: url("./images/topic_unread_locked.gif"); } +.topic_unread_locked_mine { background-image: url("./images/topic_unread_locked_mine.gif"); } /* colours and backgrounds for cp.css ------------------------------------------------------------- */ @@ -1030,9 +853,8 @@ ul.cplist { .tabs .activetab > a, .tabs .activetab > a:hover { - background-color: #cadceb; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #e2f2ff 0%, #cadceb 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#e2f2ff", endcolorstr="#cadceb", gradienttype=0); /* ie6-9 */ + background-color: #cadceb; + background-image: linear-gradient(to bottom, #e2f2ff 0%, #cadceb 100%); border-color: #cadceb; box-shadow: 0 1px 1px #f2f9ff inset; color: #333333; @@ -1066,27 +888,23 @@ ul.cplist { /* link styles for the sub-section links */ .navigation a { - background: #cadceb; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to right, #b4c4d1 50%, #cadceb 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#b4c4d1", endcolorstr="#cadceb", gradienttype=1); /* ie6-9 */ + background: #cadceb; + background-image: linear-gradient(to right, #b4c4d1 50%, #cadceb 100%); color: #333333; } .rtl .navigation a { - background: #b4c4d1; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to right, #cadceb 50%, #b4c4d1 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#cadceb", endcolorstr="#b4c4d1", gradienttype=1); /* ie6-9 */ + background: #b4c4d1; + background-image: linear-gradient(to right, #cadceb 50%, #b4c4d1 100%); } .navigation a:hover { background: #aabac6; - filter: progid:dximagetransform.microsoft.gradient(enabled = false); color: #bc2a4d; } .navigation .active-subsection a { background: #f9f9f9; - filter: progid:dximagetransform.microsoft.gradient(enabled = false); color: #d31141; } @@ -1310,9 +1128,8 @@ input.disabled { } .dropdown-extended .header { - background-color: #f1f8ff; /* old browsers */ /* ff3.6+ */ - background-image: linear-gradient(to bottom, #f1f8ff 0%, #cadceb 100%); /* w3c */ - filter: progid:dximagetransform.microsoft.gradient(startcolorstr="#f1f8ff", endcolorstr="#cadceb", gradienttype=0); /* ie6-9 */ + background-color: #f1f8ff; + background-image: linear-gradient(to bottom, #f1f8ff 0%, #cadceb 100%); } .dropdown .pointer { @@ -1361,4 +1178,7 @@ li.notification-disapproved strong { background-color: #d31141; color: #ffffff; } -/* stylelint-enable */ + +/* stylelint-enable selector-max-compound-selectors */ +/* stylelint-enable selector-no-qualifying-type */ +/* stylelint-enable no-indistinguishable-colors */ From 84fdd1a5d42c2f0c896620d6e7eadfc088fc8beb Mon Sep 17 00:00:00 2001 From: Michael Miday Date: Sat, 25 Mar 2017 10:07:43 -0400 Subject: [PATCH 16/16] [ticket/15115] Fix typo PHPBB3-15115 --- phpBB/styles/prosilver/theme/tweaks.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/phpBB/styles/prosilver/theme/tweaks.css b/phpBB/styles/prosilver/theme/tweaks.css index c8075c0252..d6328ae5f6 100644 --- a/phpBB/styles/prosilver/theme/tweaks.css +++ b/phpBB/styles/prosilver/theme/tweaks.css @@ -28,7 +28,7 @@ dd label input { height: 20px\9; } -/* IE8 often can"t handle max-width in %, so we use px instead */ +/* IE8 often can not handle max-width in %, so we use px instead */ .postprofile .avatar img { max-width: 150px\9; }