Skip to content

Commit 01b809b

Browse files
nacinnacin
committed
Dev/build tools: Use grunt-autoprefixer for CSS vendor prefixes.
We'll be using it for two distinct tasks: * Core CSS files will keep prefixes. `grunt autoprefixer:core` will update files directly in src/ as a pre-commit step, rather than doing it on build. * Color CSS files will receive prefixes when they are built. This commit: * Adds prefixes we were missing to core CSS. * Removes prefixes that we no longer need from core CSS. * Removes all prefixes from colors CSS. props ocean90. fixes #27078. git-svn-id: https://develop.svn.wordpress.org/trunk@27174 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 12b13fe commit 01b809b

16 files changed

Lines changed: 333 additions & 293 deletions

‎Gruntfile.js‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,28 @@ module.exports = function(grunt) {
99

1010
// Project configuration.
1111
grunt.initConfig({
12+
autoprefixer: {
13+
options: {
14+
browsers: ['Android >= 2.1', 'Chrome >= 21', 'Explorer >= 7', 'Firefox >= 17', 'Opera >= 12.1', 'Safari >= 6.0']
15+
},
16+
core: {
17+
expand: true,
18+
cwd: SOURCE_DIR,
19+
dest: SOURCE_DIR,
20+
src: [
21+
'wp-admin/css/*.css',
22+
'wp-includes/css/*.css'
23+
]
24+
},
25+
colors: {
26+
expand: true,
27+
cwd: BUILD_DIR,
28+
dest: BUILD_DIR,
29+
src: [
30+
'wp-admin/css/colors/*/colors.css'
31+
]
32+
}
33+
},
1234
clean: {
1335
all: [BUILD_DIR],
1436
dynamic: {
@@ -95,7 +117,6 @@ module.exports = function(grunt) {
95117
'wp-admin/css/*.css',
96118
'wp-includes/css/*.css',
97119
// Exceptions
98-
'!wp-admin/css/theme.css', // Temporary file
99120
'!wp-admin/css/farbtastic.css'
100121
]
101122
},
@@ -376,7 +397,7 @@ module.exports = function(grunt) {
376397
grunt.registerTask('rtl', ['cssjanus:core', 'cssjanus:colors']);
377398

378399
// Color schemes task.
379-
grunt.registerTask('colors', ['sass:colors']);
400+
grunt.registerTask('colors', ['sass:colors', 'autoprefixer:colors']);
380401

381402
// Build task.
382403
grunt.registerTask('build', ['clean:all', 'copy:all', 'cssmin:core', 'colors', 'rtl', 'cssmin:rtl', 'cssmin:colors',

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"grunt-contrib-jshint": "~0.8.0",
2222
"grunt-cssjanus": "~0.2.2",
2323
"grunt-sass": "~0.10.0",
24+
"grunt-autoprefixer": "~0.6.5",
2425
"grunt-jsvalidate": "~0.2.2",
2526
"grunt-contrib-imagemin" : "~0.4.1",
2627
"matchdep": "~0.3.0"

‎src/wp-admin/css/color-picker.css‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,27 +9,28 @@
99
.wp-color-result {
1010
background-color: #f7f7f7;
1111
border: 1px solid #ccc;
12+
-webkit-border-radius: 3px;
1213
border-radius: 3px;
1314
cursor: pointer;
1415
display: inline-block;
1516
height: 22px;
1617
margin: 0 6px 6px 0px;
1718
position: relative;
1819
top: 1px;
19-
user-select: none;
20+
-webkit-user-select: none;
2021
-moz-user-select: none;
2122
-ms-user-select: none;
22-
-webkit-user-select: none;
23+
user-select: none;
2324
vertical-align: bottom;
2425
display: inline-block;
2526
padding-left: 30px;
26-
2727
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.08);
2828
box-shadow: 0 1px 0 rgba(0,0,0,.08);
2929
}
3030

3131
.wp-color-result:after {
3232
background: #f7f7f7;
33+
-webkit-border-radius: 0 2px 2px 0;
3334
border-radius: 0 2px 2px 0;
3435
border-left: 1px solid #ccc;
3536
color: #555;
@@ -42,7 +43,6 @@
4243
right: 0;
4344
text-align: center;
4445
top: 0;
45-
4646
-webkit-box-shadow: inset 0 1px 0 #fff;
4747
box-shadow: inset 0 1px 0 #fff;
4848
}
@@ -96,6 +96,7 @@
9696
}
9797

9898
.wp-picker-container .iris-picker {
99+
-webkit-border-radius: 0;
99100
border-radius: 0;
100101
border-color: #dfdfdf;
101102
margin-top: 6px;

‎src/wp-admin/css/colors/_admin.scss‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -439,7 +439,6 @@ ul#adminmenu > li.current > a.current:after {
439439
.wp-slider .ui-slider-handle.focus {
440440
background: $button-color;
441441
border-color: darken( $button-color, 10% );
442-
-webkit-box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
443442
box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
444443
}
445444

‎src/wp-admin/css/colors/_mixins.scss‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,25 @@
11
/*
2-
* Button mixin- creates 3d-ish button effect with correct
2+
* Button mixin- creates 3d-ish button effect with correct
33
* highlights/shadows, based on a base color.
44
*/
55
@mixin button( $button-color, $text-color: white ) {
66
background: $button-color;
77
border-color: darken( $button-color, 10% );
88
color: $text-color;
9-
-webkit-box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
109
box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
1110

1211
&:hover,
1312
&:focus {
1413
background: darken( $button-color, 5% );
1514
border-color: darken( $button-color, 15% );
1615
color: $text-color;
17-
-webkit-box-shadow: inset 0 1px 0 lighten( $button-color, 10% ), 0 1px 0 rgba(0,0,0,.15);
1816
box-shadow: inset 0 1px 0 lighten( $button-color, 10% ), 0 1px 0 rgba(0,0,0,.15);
1917
}
2018

2119
&:active {
2220
background: darken( $button-color, 10% );
2321
border-color: darken( $button-color, 15% );
2422
color: $text-color;
25-
-webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
2623
box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
2724
}
2825

‎src/wp-admin/css/customize-controls.css‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -84,8 +84,8 @@ body {
8484
}
8585

8686
#customize-theme-controls {
87-
-webkit-box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
88-
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
87+
-webkit-box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
88+
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
8989
}
9090

9191
#customize-theme-controls .control-section {
@@ -218,7 +218,9 @@ body {
218218
.collapse-sidebar {
219219
background-color: transparent !important;
220220
border: none !important;
221+
-webkit-box-shadow: none !important;
221222
box-shadow: none !important;
223+
-webkit-border-radius: 0 !important;
222224
border-radius: 0 !important;
223225
}
224226

@@ -256,6 +258,7 @@ body {
256258
border: 2px solid #eeeeee;
257259
-webkit-user-select: none;
258260
-moz-user-select: none;
261+
-ms-user-select: none;
259262
user-select: none;
260263
}
261264

@@ -423,10 +426,7 @@ body {
423426
.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop {
424427
display: block;
425428
-webkit-transition: border-color 0.1s;
426-
-moz-transition: border-color 0.1s;
427-
-ms-transition: border-color 0.1s;
428-
-o-transition: border-color 0.1s;
429-
transition: border-color 0.1s;
429+
transition: border-color 0.1s;
430430
}
431431

432432
.accordion-section .customize-control-upload .library ul li,

‎src/wp-admin/css/install.css‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ abbr {
6868
#logo a {
6969
background-image: url('../images/w-logo-blue.png?ver=20131202');
7070
background-image: none, url('../images/wordpress-logo.svg?ver=20131107');
71+
-webkit-background-size: 80px 80px;
7172
background-size: 80px 80px;
7273
background-position: center top;
7374
background-repeat: no-repeat;
@@ -99,9 +100,8 @@ textarea {
99100
border: 1px solid #dfdfdf;
100101
font-family: "Open Sans", sans-serif;
101102
width: 100%;
102-
-moz-box-sizing: border-box;
103103
-webkit-box-sizing: border-box;
104-
-ms-box-sizing: border-box; /* ie8 only */
104+
-moz-box-sizing: border-box;
105105
box-sizing: border-box;
106106
}
107107

@@ -142,6 +142,7 @@ textarea {
142142
font-size: 15px;
143143
padding: 3px 5px;
144144
border: 1px solid #ddd;
145+
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
145146
box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
146147
}
147148

@@ -304,8 +305,9 @@ body.rtl,
304305
padding: 7px 10px;
305306
display: block;
306307
max-width: none;
307-
box-sizing: border-box;
308+
-webkit-box-sizing: border-box;
308309
-moz-box-sizing: border-box;
310+
box-sizing: border-box;
309311
}
310312

311313
}

‎src/wp-admin/css/media.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -352,21 +352,25 @@ table.not-image tr.image-only {
352352

353353
.image-align-none-label {
354354
background-image: url("../images/align-none-2x.png?ver=20120916");
355+
-webkit-background-size: 21px 15px;
355356
background-size: 21px 15px;
356357
}
357358

358359
.image-align-left-label {
359360
background-image: url("../images/align-left-2x.png?ver=20120916");
361+
-webkit-background-size: 22px 15px;
360362
background-size: 22px 15px;
361363
}
362364

363365
.image-align-center-label {
364366
background-image: url("../images/align-center-2x.png?ver=20120916");
367+
-webkit-background-size: 21px 15px;
365368
background-size: 21px 15px;
366369
}
367370

368371
.image-align-right-label {
369372
background-image: url("../images/align-right-2x.png?ver=20120916");
373+
-webkit-background-size: 22px 15px;
370374
background-size: 22px 15px;
371375
}
372376
}

0 commit comments

Comments
 (0)