kopia lustrzana https://github.com/wagtail/wagtail
Change Sass linting configuration to take advantage of stylelint capabilities
rodzic
a900965fba
commit
eea0664116
|
@ -2,6 +2,7 @@ ignoreFiles:
|
|||
- node_modules
|
||||
plugins:
|
||||
- stylelint-scss
|
||||
# See https://github.com/stylelint/stylelint/blob/master/docs/user-guide/rules.md
|
||||
rules:
|
||||
block-closing-brace-newline-after:
|
||||
- always
|
||||
|
@ -15,6 +16,7 @@ rules:
|
|||
color-hex-length: short
|
||||
color-named: never
|
||||
color-no-invalid-hex: true
|
||||
comment-no-empty: true
|
||||
declaration-bang-space-after: never
|
||||
declaration-bang-space-before: always
|
||||
declaration-block-no-duplicate-properties: true
|
||||
|
@ -26,17 +28,27 @@ rules:
|
|||
declaration-property-value-blacklist:
|
||||
- /^border/: [none]
|
||||
- severity: error
|
||||
declaration-no-important: true
|
||||
font-family-no-duplicate-names: true
|
||||
function-calc-no-unspaced-operator: true
|
||||
function-comma-space-after: always
|
||||
function-linear-gradient-no-nonstandard-direction: true
|
||||
function-parentheses-space-inside: never
|
||||
function-url-quotes: always
|
||||
indentation:
|
||||
- 4
|
||||
- severity: warning
|
||||
length-zero-no-unit: true
|
||||
max-nesting-depth: 5
|
||||
max-nesting-depth: 3
|
||||
media-feature-name-no-unknown: true
|
||||
no-empty-source: true
|
||||
no-eol-whitespace: true
|
||||
no-extra-semicolons: true
|
||||
no-missing-end-of-source-newline: true
|
||||
number-no-trailing-zeros: true
|
||||
number-leading-zero: always
|
||||
property-case: lower
|
||||
property-no-unknown: true
|
||||
rule-empty-line-before:
|
||||
- always
|
||||
- except:
|
||||
|
@ -53,4 +65,14 @@ rules:
|
|||
- class
|
||||
selector-list-comma-newline-after: always
|
||||
selector-max-id: 0
|
||||
selector-pseudo-element-no-unknown: true
|
||||
selector-type-no-unknown: true
|
||||
scss/at-rule-no-unknown: true
|
||||
scss/media-feature-value-dollar-variable: always
|
||||
scss/selector-no-redundant-nesting-selector: true
|
||||
string-no-newline: true
|
||||
string-quotes: single
|
||||
unit-no-unknown: true
|
||||
unit-case: lower
|
||||
value-no-vendor-prefix: true
|
||||
property-no-vendor-prefix: true
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
.o-pill {
|
||||
display: inline-block;
|
||||
padding: .2em .5em;
|
||||
border-radius: .25em;
|
||||
padding: 0.2em 0.5em;
|
||||
border-radius: 0.25em;
|
||||
vertical-align: middle;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
// stylelint-disable declaration-no-important
|
||||
.u-hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
|
@ -102,14 +102,14 @@ $menu-footer-height: 50px;
|
|||
}
|
||||
|
||||
.c-explorer__header__inner {
|
||||
padding: 1em .75em;
|
||||
padding: 1em 0.75em;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
.icon {
|
||||
color: $c-explorer-secondary;
|
||||
margin-right: .25rem;
|
||||
margin-right: 0.25rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
|
|
|
@ -49,7 +49,7 @@
|
|||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
width: 50px;
|
||||
padding: 0 .5em;
|
||||
padding: 0 0.5em;
|
||||
line-height: 1;
|
||||
font-size: 2em;
|
||||
cursor: pointer;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
.c-status {
|
||||
background: $color-grey-1;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .03rem;
|
||||
letter-spacing: 0.03rem;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
|
|
@ -87,8 +87,8 @@
|
|||
outline: none;
|
||||
box-sizing: border-box;
|
||||
-webkit-font-smoothing: auto;
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-moz-appearance: none;
|
||||
-moz-box-sizing: border-box;
|
||||
|
||||
&:hover {
|
||||
background-color: #358c8b;
|
||||
|
@ -98,7 +98,9 @@
|
|||
}
|
||||
|
||||
li.selected a {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
color: #fff !important;
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
border-color: #43b1b0 !important;
|
||||
background-color: #43b1b0;
|
||||
}
|
||||
|
@ -137,7 +139,7 @@ p.no-results {
|
|||
}
|
||||
|
||||
|
||||
@media screen and (min-width: 50em) {
|
||||
@media screen and (min-width: $breakpoint-mobile) {
|
||||
.changelist-filter {
|
||||
float: right;
|
||||
padding: 0 1.5%;
|
||||
|
@ -174,7 +176,7 @@ p.no-results {
|
|||
}
|
||||
|
||||
|
||||
@media screen and (min-width: 1200px) {
|
||||
@media screen and (min-width: $breakpoint-desktop-large) {
|
||||
.result-list.col9 {
|
||||
width: 79%;
|
||||
}
|
||||
|
|
|
@ -100,8 +100,6 @@ section {
|
|||
}
|
||||
|
||||
ul {
|
||||
-webkit-column-count: 3; // Chrome, Safari, Opera
|
||||
-moz-column-count: 3; // Firefox
|
||||
column-count: 3;
|
||||
}
|
||||
|
||||
|
|
|
@ -153,6 +153,7 @@
|
|||
height: 2.3em;
|
||||
line-height: 2.3em;
|
||||
|
||||
// stylelint-disable-next-line max-nesting-depth
|
||||
&:first-child {
|
||||
border-top-width: 0;
|
||||
}
|
||||
|
@ -289,12 +290,6 @@
|
|||
}
|
||||
|
||||
.xdsoft_noselect {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
|
@ -321,6 +316,7 @@
|
|||
cursor: pointer;
|
||||
|
||||
> .xdsoft_scroller {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
background: #ccc !important;
|
||||
height: 20px;
|
||||
border-radius: 3px;
|
||||
|
|
|
@ -60,6 +60,7 @@
|
|||
&.icon {
|
||||
padding-right: 5em;
|
||||
|
||||
// stylelint-disable-next-line max-nesting-depth
|
||||
&:before,
|
||||
&:after {
|
||||
right: 1em;
|
||||
|
@ -238,7 +239,7 @@
|
|||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
line-height: 1;
|
||||
margin-top: -.25rem;
|
||||
margin-top: -0.25rem;
|
||||
}
|
||||
|
||||
.c-dropdown__button {
|
||||
|
@ -254,7 +255,6 @@
|
|||
cursor: pointer;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.c-dropdown__toggle {
|
||||
|
@ -262,22 +262,22 @@
|
|||
}
|
||||
|
||||
.c-dropdown__menu.c-dropdown__menu {
|
||||
margin-top: .75rem;
|
||||
padding: .75rem 1rem;
|
||||
margin-top: 0.75rem;
|
||||
padding: 0.75rem 1rem;
|
||||
min-width: 8rem;
|
||||
text-transform: none;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
animation: dropdownIn .1s ease-out backwards;
|
||||
animation: dropdownIn 0.1s ease-out backwards;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.c-dropdown__item {
|
||||
margin-bottom: .375rem;
|
||||
margin-bottom: 0.375rem;
|
||||
|
||||
&:hover {
|
||||
.c-dropdown__indicator {
|
||||
opacity: .6;
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -300,7 +300,7 @@
|
|||
// =============================================================================
|
||||
.u-arrow:before {
|
||||
content: '';
|
||||
border: solid .35rem transparent;
|
||||
border: solid 0.35rem transparent;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
|
|
@ -216,8 +216,6 @@ a.tag:hover {
|
|||
margin: -15px 0 0 -15px;
|
||||
font-family: wagtail;
|
||||
animation: spin 0.5s infinite linear;
|
||||
-webkit-animation: spin 0.5s infinite linear;
|
||||
-moz-animation: spin 0.5s infinite linear;
|
||||
content: '1';
|
||||
z-index: 2;
|
||||
color: $color-teal;
|
||||
|
|
|
@ -62,6 +62,7 @@ select,
|
|||
border: 1px solid $color-input-border;
|
||||
padding: 0.9em 1.2em;
|
||||
background-color: $color-fieldset-hover;
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-webkit-appearance: none;
|
||||
color: $color-text-input;
|
||||
font-size: 1.2em;
|
||||
|
@ -136,6 +137,7 @@ input[type=checkbox] {
|
|||
}
|
||||
|
||||
input[type=radio] {
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-webkit-appearance: radio;
|
||||
width: auto;
|
||||
position: relative;
|
||||
|
@ -168,6 +170,7 @@ input[type=radio]:checked:before {
|
|||
}
|
||||
|
||||
input[type=checkbox] {
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-webkit-appearance: checkbox;
|
||||
width: auto;
|
||||
position: relative;
|
||||
|
@ -222,6 +225,7 @@ input[type=checkbox]:checked:before {
|
|||
outline: none;
|
||||
box-sizing: border-box;
|
||||
-webkit-font-smoothing: auto;
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-moz-appearance: none;
|
||||
|
||||
&:hover {
|
||||
|
@ -362,6 +366,7 @@ input[type=checkbox]:checked:before {
|
|||
outline: none;
|
||||
box-sizing: border-box;
|
||||
-webkit-font-smoothing: auto;
|
||||
// stylelint-disable-next-line property-no-vendor-prefix
|
||||
-moz-appearance: none;
|
||||
}
|
||||
|
||||
|
@ -452,6 +457,7 @@ input[type=checkbox]:checked:before {
|
|||
height: 1.8rem;
|
||||
width: 1.8rem;
|
||||
|
||||
// stylelint-disable-next-line max-nesting-depth
|
||||
&:before {
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
|
|
@ -6,15 +6,15 @@
|
|||
// =============================================================================
|
||||
// Indicator light
|
||||
// =============================================================================
|
||||
$c-indicator-size: .625em;
|
||||
$c-indicator-margin: .25rem;
|
||||
$c-indicator-size: 0.625em;
|
||||
$c-indicator-margin: 0.25rem;
|
||||
|
||||
.c-indicator {
|
||||
display: inline-block;
|
||||
border-radius: 50rem;
|
||||
width: $c-indicator-size;
|
||||
height: $c-indicator-size;
|
||||
margin-top: -.125rem;
|
||||
margin-top: -0.125rem;
|
||||
margin-right: $c-indicator-margin;
|
||||
font-size: 1rem;
|
||||
vertical-align: middle;
|
||||
|
|
|
@ -194,6 +194,7 @@ ul.listing {
|
|||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
// stylelint-disable max-nesting-depth
|
||||
&:hover {
|
||||
color: $color-link;
|
||||
}
|
||||
|
|
|
@ -2,6 +2,26 @@
|
|||
@import 'wagtailadmin/scss/mixins';
|
||||
@import 'wagtailadmin/scss/grid';
|
||||
|
||||
@keyframes nod {
|
||||
from {
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(8deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes tail-wag {
|
||||
from {
|
||||
transform: rotate(-3deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(7deg);
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: block;
|
||||
text-align: left;
|
||||
|
@ -50,10 +70,12 @@
|
|||
transition: inherit;
|
||||
|
||||
&.wagtail-logo__eye--open {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
display: inline !important; // doesn't work without `!important`, likely a specificity issue
|
||||
}
|
||||
|
||||
&.wagtail-logo__eye--closed {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
@ -68,39 +90,22 @@
|
|||
// Wagtail 'playful' animation (tail-wag, triggered by JS in base.html):
|
||||
&.logo-playful {
|
||||
&:hover {
|
||||
@keyframes nod {
|
||||
from {
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(8deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes tail-wag {
|
||||
from {
|
||||
transform: rotate(-3deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(7deg);
|
||||
}
|
||||
}
|
||||
|
||||
animation: nod 1.2s forwards;
|
||||
|
||||
.wagtail-logo {
|
||||
// stylelint-disable max-nesting-depth
|
||||
&.wagtail-logo__tail {
|
||||
animation: tail-wag 0.09s alternate;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
&.wagtail-logo__eye--open {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
&.wagtail-logo__eye--closed {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -436,6 +436,8 @@ body.explorer-open {
|
|||
}
|
||||
}
|
||||
|
||||
// stylelint-disable scss/media-feature-value-dollar-variable
|
||||
|
||||
// Media query hacks to detect IE10+ which doesn't support 3d transform of static elements and needs a fallback
|
||||
@media all and (-ms-high-contrast: none),
|
||||
all and (-ms-high-contrast: active) {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
$zindex-modal-background: 500;
|
||||
|
||||
.fade {
|
||||
@include transition(opacity .15s linear);
|
||||
@include transition(opacity 0.15s linear);
|
||||
opacity: 0;
|
||||
|
||||
&.in {
|
||||
|
@ -14,7 +14,6 @@ $zindex-modal-background: 500;
|
|||
overflow: hidden;
|
||||
|
||||
.content-wrapper {
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
@ -104,6 +103,7 @@ $zindex-modal-background: 500;
|
|||
}
|
||||
|
||||
.header-title {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
padding-left: 0 !important;
|
||||
margin-left: -36px;
|
||||
}
|
||||
|
|
|
@ -44,7 +44,7 @@ body {
|
|||
&:after {
|
||||
content: '';
|
||||
position: fixed;
|
||||
transition: visibility 0s linear 0s, opacity .2s ease-out;
|
||||
transition: visibility 0s linear 0s, opacity 0.2s ease-out;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
@ -174,8 +174,10 @@ footer {
|
|||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 90em) {
|
||||
width: 90em;
|
||||
$width-1440px: 90em;
|
||||
|
||||
@media screen and (min-width: $width-1440px) {
|
||||
width: $width-1440px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -234,6 +236,7 @@ footer {
|
|||
|
||||
&.home {
|
||||
a {
|
||||
// stylelint-disable max-nesting-depth
|
||||
padding-right: 0;
|
||||
text-align: center;
|
||||
width: 3em;
|
||||
|
|
|
@ -284,6 +284,7 @@
|
|||
font-size: 0; // helps fake the effect of t.ext-replace class, which can't be used here.
|
||||
width: 2em;
|
||||
|
||||
// stylelint-disable max-nesting-depth
|
||||
&:before {
|
||||
position: relative;
|
||||
padding: 0;
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
$size-home-button: 3.5em;
|
||||
$position: 2em;
|
||||
$width-arrow: .6em;
|
||||
$width-arrow: 0.6em;
|
||||
$box-shadow-props: 0 0 1px 0 rgba(107, 214, 230, 1);
|
||||
$max-items: 12;
|
||||
$userbar-radius: 6px;
|
||||
|
@ -88,6 +88,7 @@ $positions: (
|
|||
.#{$namespace}-userbar {
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
font-size: initial !important;
|
||||
line-height: initial;
|
||||
margin: 0;
|
||||
|
@ -105,7 +106,7 @@ $positions: (
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// stylelint-disable declaration-no-important
|
||||
.#{$namespace}-userbar-trigger {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -119,7 +120,7 @@ $positions: (
|
|||
color: $color-black;
|
||||
padding: 0 !important;
|
||||
cursor: pointer;
|
||||
box-shadow: $box-shadow-props, 0 1px 10px 0 rgba(107, 214, 230, .7);
|
||||
box-shadow: $box-shadow-props, 0 1px 10px 0 rgba(107, 214, 230, 0.7);
|
||||
transition: all 0.2s ease-in-out;
|
||||
font-size: 16px;
|
||||
text-decoration: none !important;
|
||||
|
@ -127,7 +128,7 @@ $positions: (
|
|||
|
||||
.#{$namespace}-userbar.touch.is-active &,
|
||||
.#{$namespace}-userbar.no-touch &:hover {
|
||||
box-shadow: $box-shadow-props, 0 3px 15px 0 rgba(107, 214, 230, .95);
|
||||
box-shadow: $box-shadow-props, 0 3px 15px 0 rgba(107, 214, 230, 0.95);
|
||||
}
|
||||
|
||||
.#{$namespace}-userbar-help-text {
|
||||
|
@ -137,7 +138,7 @@ $positions: (
|
|||
}
|
||||
|
||||
&.#{$namespace}-icon:before {
|
||||
transition: color .2s ease;
|
||||
transition: color 0.2s ease;
|
||||
font-size: 32px;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
|
@ -170,13 +171,13 @@ $positions: (
|
|||
height: 0;
|
||||
opacity: 0;
|
||||
border: solid $width-arrow transparent;
|
||||
transition-duration: .15s;
|
||||
transition-timing-function: cubic-bezier(.55, 0, .1, 1);
|
||||
transition-duration: 0.15s;
|
||||
transition-timing-function: cubic-bezier(0.55, 0, 0.1, 1);
|
||||
|
||||
.#{$namespace}-userbar.is-active & {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
transition-delay: .3s;
|
||||
transition-delay: 0.3s;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -200,8 +201,8 @@ $positions: (
|
|||
background-color: $color-grey-1;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
transition-duration: .125s;
|
||||
transition-timing-function: cubic-bezier(.55, 0, .1, 1);
|
||||
transition-duration: 0.125s;
|
||||
transition-timing-function: cubic-bezier(0.55, 0, 0.1, 1);
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-size: 16px !important;
|
||||
text-decoration: none !important;
|
||||
|
@ -319,7 +320,7 @@ $positions: (
|
|||
}
|
||||
|
||||
&:#{unquote($prop)}(#{$i}) {
|
||||
transition-delay: .05s * $i;
|
||||
transition-delay: 0.05s * $i;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
}
|
||||
|
||||
select + span:after {
|
||||
// stylelint-disable-next-line declaration-no-important
|
||||
font-size: 2.5em !important;
|
||||
}
|
||||
}
|
||||
|
|
Ładowanie…
Reference in New Issue