Style fixes across the material-sprint branch.
Should bring the build back to a pleasant green color.master
parent
7227ed68fa
commit
cc72b01894
|
@ -16,9 +16,8 @@
|
||||||
* limitations under the License
|
* limitations under the License
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
(function () {
|
(function() {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var querySelector = document.querySelector.bind(document);
|
// TODO: Do we still need this file?
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|
|
@ -3,9 +3,11 @@
|
||||||
function PaperButton(el) {
|
function PaperButton(el) {
|
||||||
var buttonElement = el;
|
var buttonElement = el;
|
||||||
var rippleElement = buttonElement.querySelector('.PaperButton-ripple');
|
var rippleElement = buttonElement.querySelector('.PaperButton-ripple');
|
||||||
var frameCount = 0, x, y;
|
var frameCount = 0;
|
||||||
|
var x;
|
||||||
|
var y;
|
||||||
|
|
||||||
if(rippleElement) {
|
if (rippleElement) {
|
||||||
var bound = buttonElement.getBoundingClientRect();
|
var bound = buttonElement.getBoundingClientRect();
|
||||||
var rippleSize = Math.max(bound.width, bound.height) * 2;
|
var rippleSize = Math.max(bound.width, bound.height) * 2;
|
||||||
|
|
||||||
|
@ -28,7 +30,8 @@ function PaperButton(el) {
|
||||||
};
|
};
|
||||||
|
|
||||||
this.setRippleXY = function(newX, newY) {
|
this.setRippleXY = function(newX, newY) {
|
||||||
x = newX, y = newY;
|
x = newX;
|
||||||
|
y = newY;
|
||||||
};
|
};
|
||||||
|
|
||||||
this.animFrameHandler = function() {
|
this.animFrameHandler = function() {
|
||||||
|
@ -58,7 +61,8 @@ PaperButton.prototype.onClickHandler = function(evt) {
|
||||||
|
|
||||||
this.setFrameCount(1);
|
this.setFrameCount(1);
|
||||||
var bound = evt.currentTarget.getBoundingClientRect();
|
var bound = evt.currentTarget.getBoundingClientRect();
|
||||||
var x, y;
|
var x;
|
||||||
|
var y;
|
||||||
// Check if we are handling a keyboard click
|
// Check if we are handling a keyboard click
|
||||||
if (event.clientX === 0 && event.clientY === 0) {
|
if (event.clientX === 0 && event.clientY === 0) {
|
||||||
x = Math.round(bound.width / 2);
|
x = Math.round(bound.width / 2);
|
||||||
|
@ -71,7 +75,7 @@ PaperButton.prototype.onClickHandler = function(evt) {
|
||||||
var transformString = 'translate(-50%, -50%) ' +
|
var transformString = 'translate(-50%, -50%) ' +
|
||||||
'translate(' + x + 'px, ' + y + 'px) ' +
|
'translate(' + x + 'px, ' + y + 'px) ' +
|
||||||
'scale(0.0001, 0.0001)';
|
'scale(0.0001, 0.0001)';
|
||||||
|
|
||||||
var rippleElement = this.getRippleElement();
|
var rippleElement = this.getRippleElement();
|
||||||
if (rippleElement) {
|
if (rippleElement) {
|
||||||
rippleElement.style.webkitTransform = transformString;
|
rippleElement.style.webkitTransform = transformString;
|
||||||
|
|
|
@ -102,7 +102,6 @@
|
||||||
sidenav.close();
|
sidenav.close();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
menuButton.addEventListener('click', function(evt) {
|
menuButton.addEventListener('click', function(evt) {
|
||||||
sidenav.toggle();
|
sidenav.toggle();
|
||||||
});
|
});
|
||||||
|
|
|
@ -27,14 +27,17 @@ function RadioButton(btnElement, labelElement) {
|
||||||
};
|
};
|
||||||
|
|
||||||
labelElement.addEventListener('click', this.onClick.bind(this));
|
labelElement.addEventListener('click', this.onClick.bind(this));
|
||||||
ripple.addEventListener('webkitTransitionEnd', this.onEndOfRippleTransition.bind(this));
|
ripple.addEventListener('webkitTransitionEnd',
|
||||||
ripple.addEventListener('oTransitionEnd', this.onEndOfRippleTransition.bind(this));
|
this.onEndOfRippleTransition.bind(this));
|
||||||
ripple.addEventListener('transitionEnd', this.onEndOfRippleTransition.bind(this));
|
ripple.addEventListener('oTransitionEnd',
|
||||||
|
this.onEndOfRippleTransition.bind(this));
|
||||||
|
ripple.addEventListener('transitionEnd',
|
||||||
|
this.onEndOfRippleTransition.bind(this));
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('load', function() {
|
window.addEventListener('load', function() {
|
||||||
var radioLabels = document.querySelectorAll('.RadioButton-label');
|
var radioLabels = document.querySelectorAll('.RadioButton-label');
|
||||||
for(var i = 0; i < radioLabels.length; i++) {
|
for (var i = 0; i < radioLabels.length; i++) {
|
||||||
var radioButton = radioLabels[i].querySelector('.RadioButton');
|
var radioButton = radioLabels[i].querySelector('.RadioButton');
|
||||||
new RadioButton(radioButton, radioLabels[i]);
|
new RadioButton(radioButton, radioLabels[i]);
|
||||||
}
|
}
|
||||||
|
|
|
@ -24,9 +24,9 @@ function Slider(element) {
|
||||||
this.updateValue();
|
this.updateValue();
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('load', function(){
|
window.addEventListener('load', function() {
|
||||||
var sliders = document.querySelectorAll('input[type="range"]');
|
var sliders = document.querySelectorAll('input[type="range"]');
|
||||||
for(var i = 0; i < sliders.length; i++) {
|
for (var i = 0; i < sliders.length; i++) {
|
||||||
new Slider(sliders[i]);
|
new Slider(sliders[i]);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -8,8 +8,9 @@ function TextField(element) {
|
||||||
|
|
||||||
if (inputElement.hasAttribute('maxrows')) {
|
if (inputElement.hasAttribute('maxrows')) {
|
||||||
maxRows = parseInt(inputElement.getAttribute('maxrows'), 10);
|
maxRows = parseInt(inputElement.getAttribute('maxrows'), 10);
|
||||||
if(isNaN(maxRows)) {
|
if (isNaN(maxRows)) {
|
||||||
console.log('maxrows attribute provided, but wasn\'t a number: '+maxRows);
|
console.log(
|
||||||
|
'maxrows attribute provided, but wasn\'t a number: ' + maxRows);
|
||||||
maxRows = NO_MAX_ROWS;
|
maxRows = NO_MAX_ROWS;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -24,15 +25,15 @@ function TextField(element) {
|
||||||
|
|
||||||
this.onKeyDown = function(evt) {
|
this.onKeyDown = function(evt) {
|
||||||
var currentRowCount = evt.target.value.split('\n').length;
|
var currentRowCount = evt.target.value.split('\n').length;
|
||||||
if(evt.keyCode === 13) {
|
if (evt.keyCode === 13) {
|
||||||
if(currentRowCount >= maxRows) {
|
if (currentRowCount >= maxRows) {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
inputElement.addEventListener('input', this.onInputChange.bind(this));
|
inputElement.addEventListener('input', this.onInputChange.bind(this));
|
||||||
if(maxRows !== NO_MAX_ROWS) {
|
if (maxRows !== NO_MAX_ROWS) {
|
||||||
// TODO: This should handle pasting multi line text
|
// TODO: This should handle pasting multi line text
|
||||||
// Currently doesn't
|
// Currently doesn't
|
||||||
inputElement.addEventListener('keydown', this.onKeyDown.bind(this));
|
inputElement.addEventListener('keydown', this.onKeyDown.bind(this));
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
// From: http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/
|
// From: http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/
|
||||||
// shim layer with setTimeout fallback
|
// shim layer with setTimeout fallback
|
||||||
window.requestAnimFrame = (function() {
|
window.requestAnimFrame = (function() {
|
||||||
|
|
35
gulpfile.js
35
gulpfile.js
|
@ -41,8 +41,8 @@ var AUTOPREFIXER_BROWSERS = [
|
||||||
];
|
];
|
||||||
|
|
||||||
// Lint JavaScript
|
// Lint JavaScript
|
||||||
gulp.task('jshint', function () {
|
gulp.task('jshint', function() {
|
||||||
return gulp.src('app/scripts/**/*.js')
|
return gulp.src(['app/scripts/**/*.js', 'app/styleguide/**/*.js'])
|
||||||
.pipe(reload({stream: true, once: true}))
|
.pipe(reload({stream: true, once: true}))
|
||||||
.pipe($.jshint())
|
.pipe($.jshint())
|
||||||
.pipe($.jshint.reporter('jshint-stylish'))
|
.pipe($.jshint.reporter('jshint-stylish'))
|
||||||
|
@ -50,7 +50,7 @@ gulp.task('jshint', function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Optimize Images
|
// Optimize Images
|
||||||
gulp.task('images', function () {
|
gulp.task('images', function() {
|
||||||
return gulp.src('app/images/**/*')
|
return gulp.src('app/images/**/*')
|
||||||
.pipe($.cache($.imagemin({
|
.pipe($.cache($.imagemin({
|
||||||
progressive: true,
|
progressive: true,
|
||||||
|
@ -61,7 +61,7 @@ gulp.task('images', function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Copy All Files At The Root Level (app)
|
// Copy All Files At The Root Level (app)
|
||||||
gulp.task('copy', function () {
|
gulp.task('copy', function() {
|
||||||
return gulp.src([
|
return gulp.src([
|
||||||
'app/*',
|
'app/*',
|
||||||
'!app/*.html',
|
'!app/*.html',
|
||||||
|
@ -73,26 +73,25 @@ gulp.task('copy', function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Copy Web Fonts To Dist
|
// Copy Web Fonts To Dist
|
||||||
gulp.task('fonts', function () {
|
gulp.task('fonts', function() {
|
||||||
return gulp.src(['app/fonts/**'])
|
return gulp.src(['app/fonts/**'])
|
||||||
.pipe(gulp.dest('dist/fonts'))
|
.pipe(gulp.dest('dist/fonts'))
|
||||||
.pipe($.size({title: 'fonts'}));
|
.pipe($.size({title: 'fonts'}));
|
||||||
});
|
});
|
||||||
|
|
||||||
// Compile and Automatically Prefix Stylesheets
|
// Compile and Automatically Prefix Stylesheets
|
||||||
gulp.task('styles', function () {
|
gulp.task('styles', function() {
|
||||||
// For best performance, don't add Sass partials to `gulp.src`
|
// For best performance, don't add Sass partials to `gulp.src`
|
||||||
return gulp.src([
|
return gulp.src([
|
||||||
'app/**/*.scss',
|
'app/**/*.scss',
|
||||||
'app/styles/**/*.css'
|
'app/styles/**/*.css'
|
||||||
])
|
])
|
||||||
.pipe($.changed('styles', {extension: '.scss'}))
|
.pipe($.changed('styles', {extension: '.scss'}))
|
||||||
.pipe($.rubySass({
|
.pipe($.rubySass({
|
||||||
style: 'expanded',
|
style: 'expanded',
|
||||||
precision: 10
|
precision: 10
|
||||||
})
|
})
|
||||||
.on('error', console.error.bind(console))
|
.on('error', console.error.bind(console)))
|
||||||
)
|
|
||||||
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
||||||
.pipe(gulp.dest('.tmp'))
|
.pipe(gulp.dest('.tmp'))
|
||||||
// Concatenate And Minify Styles
|
// Concatenate And Minify Styles
|
||||||
|
@ -102,7 +101,7 @@ gulp.task('styles', function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Scan Your HTML For Assets & Optimize Them
|
// Scan Your HTML For Assets & Optimize Them
|
||||||
gulp.task('html', function () {
|
gulp.task('html', function() {
|
||||||
var assets = $.useref.assets({searchPath: '{.tmp,app}'});
|
var assets = $.useref.assets({searchPath: '{.tmp,app}'});
|
||||||
|
|
||||||
return gulp.src('app/**/*.html')
|
return gulp.src('app/**/*.html')
|
||||||
|
@ -141,7 +140,7 @@ gulp.task('html', function () {
|
||||||
gulp.task('clean', del.bind(null, ['.tmp', 'dist']));
|
gulp.task('clean', del.bind(null, ['.tmp', 'dist']));
|
||||||
|
|
||||||
// Watch Files For Changes & Reload
|
// Watch Files For Changes & Reload
|
||||||
gulp.task('serve', ['styles'], function () {
|
gulp.task('serve', ['styles'], function() {
|
||||||
browserSync({
|
browserSync({
|
||||||
notify: false,
|
notify: false,
|
||||||
// Customize the BrowserSync console logging prefix
|
// Customize the BrowserSync console logging prefix
|
||||||
|
@ -160,7 +159,7 @@ gulp.task('serve', ['styles'], function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Build and serve the output from the dist build
|
// Build and serve the output from the dist build
|
||||||
gulp.task('serve:dist', ['default'], function () {
|
gulp.task('serve:dist', ['default'], function() {
|
||||||
browserSync({
|
browserSync({
|
||||||
notify: false,
|
notify: false,
|
||||||
logPrefix: 'WSK',
|
logPrefix: 'WSK',
|
||||||
|
@ -173,7 +172,7 @@ gulp.task('serve:dist', ['default'], function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Build Production Files, the Default Task
|
// Build Production Files, the Default Task
|
||||||
gulp.task('default', ['clean'], function (cb) {
|
gulp.task('default', ['clean'], function(cb) {
|
||||||
runSequence('styles', ['jshint', 'html', 'images', 'fonts', 'copy'], cb);
|
runSequence('styles', ['jshint', 'html', 'images', 'fonts', 'copy'], cb);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue