[wp-trac] [WordPress Trac] #29792: Grunt: Add a precommit task to check for CSS syntax errors
WordPress Trac
noreply at wordpress.org
Tue Oct 13 09:45:17 UTC 2015
#29792: Grunt: Add a precommit task to check for CSS syntax errors
------------------------------+-----------------------
Reporter: helen | Owner: netweb
Type: enhancement | Status: assigned
Priority: normal | Milestone: 4.4
Component: Build/Test Tools | Version:
Severity: normal | Resolution:
Keywords: needs-patch | Focuses:
------------------------------+-----------------------
Comment (by netweb):
'''Alignment via Whitespace'''
Replying to [comment:40 nacin]:
> Where we should change our CSS to conform to the rules, rather than add
ignore rules:
> * For `@-webkit-keyframes dice-color-change`, we don't align things the
way we do for `@-webkit-keyframes customize-reload`. We might as well make
them standardized so they ignore the same things.
I haven't changed any of these currently, all I have done is added
comments so that Stylelint skips the rules that would cause failures, some
examples of these are below, no doubt they are more "readable" using the
extra whitespace formatting but at this stage we there are no Stylelint
rules defined to allow this.
src/wp-admin/css/customize-controls.css
{{{
#!css
/* stylelint-disable block-opening-brace-newline-after, block-closing-
brace-newline-before */
@-webkit-keyframes dice-color-change {
0% { color: #d4b146; }
50% { color: #ef54b0; }
75% { color: #7190d3; }
100% { color: #d4b146; }
}
@keyframes dice-color-change {
0% { color: #d4b146; }
50% { color: #ef54b0; }
75% { color: #7190d3; }
100% { color: #d4b146; }
}
/* stylelint-enable */
}}}
src/wp-admin/css/customize-controls.css
{{{
#!css
/* stylelint-disable block-opening-brace-newline-after, block-opening-
brace-space-before, block-closing-brace-newline-before */
@-webkit-keyframes customize-reload {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes customize-reload {
0% { opacity: 0; }
100% { opacity: 1; }
}
/* stylelint-enable */
}}}
src/wp-admin/css/nav-menus.css
{{{
#!css
/* stylelint-disable block-opening-brace-newline-after, number-zero-
length-no-unit, block-closing-brace-newline-before */
/* WARNING: The factor of 30px is hardcoded into the nav-menus JavaScript.
*/
.menu-item-depth-0 { margin-left: 0px; }
.menu-item-depth-1 { margin-left: 30px; }
.menu-item-depth-2 { margin-left: 60px; }
.menu-item-depth-3 { margin-left: 90px; }
.menu-item-depth-4 { margin-left: 120px; }
.menu-item-depth-5 { margin-left: 150px; }
.menu-item-depth-6 { margin-left: 180px; }
.menu-item-depth-7 { margin-left: 210px; }
.menu-item-depth-8 { margin-left: 240px; }
.menu-item-depth-9 { margin-left: 270px; }
.menu-item-depth-10 { margin-left: 300px; }
.menu-item-depth-11 { margin-left: 330px; }
.menu-item-depth-0 .menu-item-transport { margin-left: 0px; }
.menu-item-depth-1 .menu-item-transport { margin-left: -30px; }
.menu-item-depth-2 .menu-item-transport { margin-left: -60px; }
.menu-item-depth-3 .menu-item-transport { margin-left: -90px; }
.menu-item-depth-4 .menu-item-transport { margin-left: -120px; }
.menu-item-depth-5 .menu-item-transport { margin-left: -150px; }
.menu-item-depth-6 .menu-item-transport { margin-left: -180px; }
.menu-item-depth-7 .menu-item-transport { margin-left: -210px; }
.menu-item-depth-8 .menu-item-transport { margin-left: -240px; }
.menu-item-depth-9 .menu-item-transport { margin-left: -270px; }
.menu-item-depth-10 .menu-item-transport { margin-left: -300px; }
.menu-item-depth-11 .menu-item-transport { margin-left: -330px; }
body.menu-max-depth-0 { min-width: 950px !important; }
body.menu-max-depth-1 { min-width: 980px !important; }
body.menu-max-depth-2 { min-width: 1010px !important; }
body.menu-max-depth-3 { min-width: 1040px !important; }
body.menu-max-depth-4 { min-width: 1070px !important; }
body.menu-max-depth-5 { min-width: 1100px !important; }
body.menu-max-depth-6 { min-width: 1130px !important; }
body.menu-max-depth-7 { min-width: 1160px !important; }
body.menu-max-depth-8 { min-width: 1190px !important; }
body.menu-max-depth-9 { min-width: 1220px !important; }
body.menu-max-depth-10 { min-width: 1250px !important; }
body.menu-max-depth-11 { min-width: 1280px !important; }
/* stylelint-enable */
}}}
src/wp-admin/css/customize-nav-menus.css
{{{
#!css
/* stylelint-disable block-opening-brace-newline-after, block-opening-
brace-space-before, selector-combinator-space-before, block-closing-brace-
newline-before */
/* WARNING: The 20px factor is hard-coded in JS. */
.menu-item-depth-0 { margin-left: 0; }
.menu-item-depth-1 { margin-left: 20px; }
.menu-item-depth-2 { margin-left: 40px; }
.menu-item-depth-3 { margin-left: 60px; }
.menu-item-depth-4 { margin-left: 80px; }
.menu-item-depth-5 { margin-left: 100px; }
.menu-item-depth-6 { margin-left: 120px; }
.menu-item-depth-7 { margin-left: 140px; }
.menu-item-depth-8 { margin-left: 160px; } /* Not likely to be used or
useful beyond this depth */
.menu-item-depth-9 { margin-left: 180px; }
.menu-item-depth-10 { margin-left: 200px; }
.menu-item-depth-11 { margin-left: 220px; }
/* @todo handle .menu-item-settings width */
.menu-item-depth-0 > .menu-item-bar { margin-right: 0; }
.menu-item-depth-1 > .menu-item-bar { margin-right: 20px; }
.menu-item-depth-2 > .menu-item-bar { margin-right: 40px; }
.menu-item-depth-3 > .menu-item-bar { margin-right: 60px; }
.menu-item-depth-4 > .menu-item-bar { margin-right: 80px; }
.menu-item-depth-5 > .menu-item-bar { margin-right: 100px; }
.menu-item-depth-6 > .menu-item-bar { margin-right: 120px; }
.menu-item-depth-7 > .menu-item-bar { margin-right: 140px; }
.menu-item-depth-8 > .menu-item-bar { margin-right: 160px; }
.menu-item-depth-9 > .menu-item-bar { margin-right: 180px; }
.menu-item-depth-10 > .menu-item-bar { margin-right: 200px; }
.menu-item-depth-11 > .menu-item-bar { margin-right: 220px; }
/* Submenu left margin. */
.menu-item-depth-0 .menu-item-transport { margin-left: 0; }
.menu-item-depth-1 .menu-item-transport { margin-left: -20px; }
.menu-item-depth-3 .menu-item-transport { margin-left: -60px; }
.menu-item-depth-4 .menu-item-transport { margin-left: -80px; }
.menu-item-depth-2 .menu-item-transport { margin-left: -40px; }
.menu-item-depth-5 .menu-item-transport { margin-left: -100px; }
.menu-item-depth-6 .menu-item-transport { margin-left: -120px; }
.menu-item-depth-7 .menu-item-transport { margin-left: -140px; }
.menu-item-depth-8 .menu-item-transport { margin-left: -160px; }
.menu-item-depth-9 .menu-item-transport { margin-left: -180px; }
.menu-item-depth-10 .menu-item-transport { margin-left: -200px; }
.menu-item-depth-11 .menu-item-transport { margin-left: -220px; }
/* WARNING: The 20px factor is hard-coded in JS. */
.reordering .menu-item-depth-0 { margin-left: 0; }
.reordering .menu-item-depth-1 { margin-left: 15px; }
.reordering .menu-item-depth-2 { margin-left: 30px; }
.reordering .menu-item-depth-3 { margin-left: 45px; }
.reordering .menu-item-depth-4 { margin-left: 60px; }
.reordering .menu-item-depth-5 { margin-left: 75px; }
.reordering .menu-item-depth-6 { margin-left: 90px; }
.reordering .menu-item-depth-7 { margin-left: 105px; }
.reordering .menu-item-depth-8 { margin-left: 120px; } /* Not likely to
be used or useful beyond this depth */
.reordering .menu-item-depth-9 { margin-left: 135px; }
.reordering .menu-item-depth-10 { margin-left: 150px; }
.reordering .menu-item-depth-11 { margin-left: 165px; }
.reordering .menu-item-depth-0 > .menu-item-bar { margin-right: 0; }
.reordering .menu-item-depth-1 > .menu-item-bar { margin-right: 15px; }
.reordering .menu-item-depth-2 > .menu-item-bar { margin-right: 30px; }
.reordering .menu-item-depth-3 > .menu-item-bar { margin-right: 45px; }
.reordering .menu-item-depth-4 > .menu-item-bar { margin-right: 60px; }
.reordering .menu-item-depth-5 > .menu-item-bar { margin-right: 75px; }
.reordering .menu-item-depth-6 > .menu-item-bar { margin-right: 90px; }
.reordering .menu-item-depth-7 > .menu-item-bar { margin-right: 105px; }
.reordering .menu-item-depth-8 > .menu-item-bar { margin-right: 120px; }
.reordering .menu-item-depth-9 > .menu-item-bar { margin-right: 135px; }
.reordering .menu-item-depth-10 > .menu-item-bar { margin-right: 150px; }
.reordering .menu-item-depth-11 > .menu-item-bar { margin-right: 165px; }
/* stylelint-enable */
}}}
--
Ticket URL: <https://core.trac.wordpress.org/ticket/29792#comment:53>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform
More information about the wp-trac
mailing list