Esanders has uploaded a new change for review.
https://gerrit.wikimedia.org/r/290220
Change subject: Introduce stylelint and add colour rules to start
......................................................................
Introduce stylelint and add colour rules to start
Change-Id: I3903014fa5db8be16313f29ce73391b2fefbe66b
---
A .stylelintrc
M Gruntfile.js
M minerva.less/minerva.mixins.less
M minerva.less/minerva.variables.less
M package.json
M resources/mobile.backtotop/backtotop.less
M resources/mobile.languages.structured/LanguageOverlay.less
M resources/mobile.mainMenu/mainmenu.less
M resources/mobile.mediaViewer/mediaViewer.less
M resources/mobile.notifications.overlay/NotificationsOverlay.less
M resources/mobile.overlays/Overlay.less
M resources/mobile.references/references.less
M resources/mobile.search/SearchOverlay.less
M resources/mobile.special.mobilediff.styles/mobilediff.less
M resources/skins.minerva.base.styles/common.less
M resources/skins.minerva.base.styles/pageactions.less
M resources/skins.minerva.base.styles/ui.less
M resources/skins.minerva.content.styles/hacks.less
18 files changed, 50 insertions(+), 30 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/20/290220/1
diff --git a/.stylelintrc b/.stylelintrc
new file mode 100644
index 0000000..c927699
--- /dev/null
+++ b/.stylelintrc
@@ -0,0 +1,8 @@
+{
+ "rules": {
+ "color-hex-case": [ "lower" ],
+ "color-hex-length": [ "short" ],
+ "color-named": [ "never" ],
+ "color-no-invalid-hex": true
+ }
+}
diff --git a/Gruntfile.js b/Gruntfile.js
index d783629..0ff4bf1 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -7,6 +7,7 @@
grunt.loadNpmTasks( 'grunt-jscs' );
grunt.loadNpmTasks( 'grunt-jsonlint' );
grunt.loadNpmTasks( 'grunt-notify' );
+ grunt.loadNpmTasks( 'grunt-stylelint' );
grunt.initConfig( {
jshint: {
@@ -36,6 +37,15 @@
}
}
},
+ stylelint: {
+ options: {
+ syntax: 'less'
+ },
+ all: [
+ 'minerva.less/**/*.less',
+ 'resources/**/*.less'
+ ]
+ },
watch: {
lint: {
files: [ 'resources/**/*.js',
'tests/qunit/**/*.js' ],
@@ -64,7 +74,7 @@
}
} );
- grunt.registerTask( 'lint', [ 'jshint', 'jscs', 'jsonlint', 'banana' ]
);
+ grunt.registerTask( 'lint', [ 'jshint', 'jscs', 'jsonlint',
'stylelint', 'banana' ] );
grunt.registerTask( 'test', [ 'lint' ] );
grunt.registerTask( 'default', [ 'test' ] );
diff --git a/minerva.less/minerva.mixins.less b/minerva.less/minerva.mixins.less
index 097913e..4d61b48 100644
--- a/minerva.less/minerva.mixins.less
+++ b/minerva.less/minerva.mixins.less
@@ -36,7 +36,7 @@
background-size: @width @height;
}
-.vertical-gradient ( @startColor: gray, @endColor: white, @startPos: 0,
@endPos: 100% ) {
+.vertical-gradient ( @startColor: #808080, @endColor: #fff, @startPos: 0,
@endPos: 100% ) {
background-color: @endColor;
background-image: -moz-linear-gradient( top, @startColor @startPos,
@endColor @endPos ); // Firefox 3.6+
background-image: -webkit-gradient( linear, left top, left bottom,
color-stop( @startPos, @startColor ), color-stop( @endPos, @endColor ) ); //
Safari 4+, Chrome 2+
diff --git a/minerva.less/minerva.variables.less
b/minerva.less/minerva.variables.less
index 6041e61..b637e89 100644
--- a/minerva.less/minerva.variables.less
+++ b/minerva.less/minerva.variables.less
@@ -46,9 +46,9 @@
@semiTransparent: rgba(255, 255, 255, .8);
// note this is also used for red links
@redBase: @colorErrorText;
-@colorTutorial: #2E76FF;
+@colorTutorial: #2e76ff;
@linkColor: #002bb8;
-@lastModifiedBarActiveBackgroundColor: #00AF8B;
+@lastModifiedBarActiveBackgroundColor: #00af8b;
// Use when an element is selected. FIXME: This should be in mediawiki ui.
@selectedBackgroundColor: #e6eeff;
@@ -71,7 +71,7 @@
@headingMargin: .5em;
// FIXME: Merge with @grayLightest (?)
-@sectionBorderColor: #E2E3E4;
+@sectionBorderColor: #e2e3e4;
@sectionIconWidth: 30px;
// information messages, e.g. empty watchlist message
diff --git a/package.json b/package.json
index 8b87a2a..a0f8ba3 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,8 @@
"grunt-jsonlint": "1.0.7",
"grunt-notify": "0.4.5",
"js-beautify": "1.5.10",
- "jscs-preset-wikimedia": "1.0.0"
+ "jscs-preset-wikimedia": "1.0.0",
+ "grunt-stylelint": "0.3.0",
+ "stylelint-config-wikimedia": "0.1.0"
}
}
diff --git a/resources/mobile.backtotop/backtotop.less
b/resources/mobile.backtotop/backtotop.less
index 5e05ece..24d1484 100644
--- a/resources/mobile.backtotop/backtotop.less
+++ b/resources/mobile.backtotop/backtotop.less
@@ -11,7 +11,7 @@
width: 2.5em;
height: 2.5em;
border-radius: 100%;
- box-shadow: .1em .2em .3em lightgrey;
+ box-shadow: .1em .2em .3em #d3d3d3;
bottom: 20px;
right: @contentMargin;
cursor: pointer;
@@ -38,7 +38,7 @@
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
- border-bottom: 7px solid white;
+ border-bottom: 7px solid #fff;
position: absolute;
top: 50%;
left: 50%;
diff --git a/resources/mobile.languages.structured/LanguageOverlay.less
b/resources/mobile.languages.structured/LanguageOverlay.less
index 27b5e61..6f556df 100644
--- a/resources/mobile.languages.structured/LanguageOverlay.less
+++ b/resources/mobile.languages.structured/LanguageOverlay.less
@@ -12,7 +12,7 @@
}
.panel {
- background-color: white;
+ background-color: #fff;
padding: 1em;
}
@@ -39,7 +39,7 @@
.site-link-list {
li {
- background-color: white;
+ background-color: #fff;
padding: 0;
}
@@ -60,7 +60,7 @@
.lang {
background-color: @colorGray9;
border-radius: 2px;
- color: white;
+ color: #fff;
display: block;
margin-right:0.75em;
min-width: @langMinWidth; // so that the 2
letter language codes don't...
@@ -79,7 +79,7 @@
}
.autonym {
- color: black;
+ color: #000;
font-weight: bold;
}
.title {
diff --git a/resources/mobile.mainMenu/mainmenu.less
b/resources/mobile.mainMenu/mainmenu.less
index 08312d2..ba6206f 100644
--- a/resources/mobile.mainMenu/mainmenu.less
+++ b/resources/mobile.mainMenu/mainmenu.less
@@ -13,7 +13,7 @@
@primaryNavBackgroundColor: @colorGray3;
@pageLeftListDarkBorderColor: #3e3e3e;
-@pageLeftListMediumBorderColor: #5C5C5C;
+@pageLeftListMediumBorderColor: #5c5c5c;
@pageLeftListLightBorderColor: #717171;
#mw-mf-viewport {
@@ -37,7 +37,7 @@
position: absolute;
top: -.4em;
right: .6em;
- border: solid .2em white;
+ border: solid .2em #fff;
border-radius: .5em;
}
}
@@ -97,7 +97,7 @@
}
a {
- color: white;
+ color: #fff;
display: block;
padding: @menuLinkLineHeight / 2 10px
@menuLinkLineHeight / 2 15px;
@@ -109,7 +109,7 @@
&:visited,
&:active {
- color: white;
+ color: #fff;
}
}
}
diff --git a/resources/mobile.mediaViewer/mediaViewer.less
b/resources/mobile.mediaViewer/mediaViewer.less
index bf09c0d..ba75aed 100644
--- a/resources/mobile.mediaViewer/mediaViewer.less
+++ b/resources/mobile.mediaViewer/mediaViewer.less
@@ -56,7 +56,7 @@
width: 100%;
padding: 8px 10px;
margin: 0;
- background: white;
+ background: #fff;
overflow-y: auto;
.button {
diff --git a/resources/mobile.notifications.overlay/NotificationsOverlay.less
b/resources/mobile.notifications.overlay/NotificationsOverlay.less
index 86a7573..9e857db 100644
--- a/resources/mobile.notifications.overlay/NotificationsOverlay.less
+++ b/resources/mobile.notifications.overlay/NotificationsOverlay.less
@@ -23,7 +23,7 @@
font-size: 1.5em;
border: 0;
box-shadow: none;
- border: 1px solid #666666;
+ border: 1px solid #666;
// Override the positioning of the menu
// so it is "stuck" on the bottom of the
// notification overlay panel
diff --git a/resources/mobile.overlays/Overlay.less
b/resources/mobile.overlays/Overlay.less
index 6f566d8..8a668c9 100644
--- a/resources/mobile.overlays/Overlay.less
+++ b/resources/mobile.overlays/Overlay.less
@@ -231,12 +231,12 @@
}
.continue {
- color: white;
+ color: #fff;
background-color: @colorProgressive;
}
.submit {
- color: white;
+ color: #fff;
background-color: @colorConstructive;
}
@@ -311,7 +311,7 @@
}
.overlay-footer-container {
- background-color: #FFF;
+ background-color: #fff;
bottom: 0;
border-top: 1px solid @grayLight;
diff --git a/resources/mobile.references/references.less
b/resources/mobile.references/references.less
index 1db5f11..fcd902e 100644
--- a/resources/mobile.references/references.less
+++ b/resources/mobile.references/references.less
@@ -21,7 +21,7 @@
a {
background-image: none;
- color: #5880C0;
+ color: #5880c0;
}
.error {
diff --git a/resources/mobile.search/SearchOverlay.less
b/resources/mobile.search/SearchOverlay.less
index 946ba36..688ac22 100644
--- a/resources/mobile.search/SearchOverlay.less
+++ b/resources/mobile.search/SearchOverlay.less
@@ -12,7 +12,7 @@
}
.search-overlay {
- background: white;
+ background: #fff;
.overlay-header,
.results,
diff --git a/resources/mobile.special.mobilediff.styles/mobilediff.less
b/resources/mobile.special.mobilediff.styles/mobilediff.less
index d7d19ef..87bd6a2 100644
--- a/resources/mobile.special.mobilediff.styles/mobilediff.less
+++ b/resources/mobile.special.mobilediff.styles/mobilediff.less
@@ -83,7 +83,7 @@
ins,
del {
- color: black;
+ color: #000;
text-decoration: none;
}
@@ -92,11 +92,11 @@
}
ins {
- background-color: #75C877;
+ background-color: #75c877;
}
del {
- background-color: #E07076;
+ background-color: #e07076;
text-decoration: none;
}
diff --git a/resources/skins.minerva.base.styles/common.less
b/resources/skins.minerva.base.styles/common.less
index 09cc8b9..bf1bbbd 100644
--- a/resources/skins.minerva.base.styles/common.less
+++ b/resources/skins.minerva.base.styles/common.less
@@ -2,7 +2,7 @@
@import "minerva.variables.less";
@import "minerva.mixins.less";
-@imageReplacementColor: #706E6E;
+@imageReplacementColor: #706e6e;
@inputsBoxBorderColor: #e1e1e1;
// Reusable components
diff --git a/resources/skins.minerva.base.styles/pageactions.less
b/resources/skins.minerva.base.styles/pageactions.less
index 479ab4f..1f8776d 100644
--- a/resources/skins.minerva.base.styles/pageactions.less
+++ b/resources/skins.minerva.base.styles/pageactions.less
@@ -1,7 +1,7 @@
@import "minerva.variables";
@import "minerva.mixins";
-@borderBottomColor: #CACACA;
+@borderBottomColor: #cacaca;
// hide menu items when not possible to use
.client-nojs #ca-watch,
diff --git a/resources/skins.minerva.base.styles/ui.less
b/resources/skins.minerva.base.styles/ui.less
index e2050e3..e5f1f7a 100644
--- a/resources/skins.minerva.base.styles/ui.less
+++ b/resources/skins.minerva.base.styles/ui.less
@@ -2,7 +2,7 @@
@import "minerva.mixins";
@import "mediawiki.mixins";
-@topBarBackgroundColor: #F3F3F3;
+@topBarBackgroundColor: #f3f3f3;
html,
body {
diff --git a/resources/skins.minerva.content.styles/hacks.less
b/resources/skins.minerva.content.styles/hacks.less
index 5972782..936f986 100644
--- a/resources/skins.minerva.content.styles/hacks.less
+++ b/resources/skins.minerva.content.styles/hacks.less
@@ -89,7 +89,7 @@
// When JavaScript is disabled clarify to the user which reference they
clicked on
.references li:target {
- background-color: #ddeeff;
+ background-color: #def;
}
.hatnote,
--
To view, visit https://gerrit.wikimedia.org/r/290220
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I3903014fa5db8be16313f29ce73391b2fefbe66b
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Esanders <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits