handle default sizing using preprocesses css
This commit is contained in:
parent
41c3007821
commit
fe73ffc21e
32
gulpfile.js
32
gulpfile.js
|
@ -269,6 +269,18 @@ gulp.task('dist:move', function () {
|
|||
});
|
||||
|
||||
gulp.task('dist:css', function () {
|
||||
distCss({});
|
||||
});
|
||||
|
||||
gulp.task('dist:css:edge', function () {
|
||||
distCss({ edge: true });
|
||||
});
|
||||
|
||||
gulp.task('dist:css:firefox', function () {
|
||||
distCss({ firefox: true });
|
||||
});
|
||||
|
||||
function distCss(preprocessContext) {
|
||||
return gulp
|
||||
.src([
|
||||
// libs
|
||||
|
@ -277,9 +289,10 @@ gulp.task('dist:css', function () {
|
|||
// app
|
||||
paths.cssDir + 'popup.css'
|
||||
])
|
||||
.pipe(preprocess({ context: preprocessContext }))
|
||||
.pipe(concat(paths.dist + 'popup/css/popup.css'))
|
||||
.pipe(gulp.dest('.'));
|
||||
});
|
||||
}
|
||||
|
||||
gulp.task('dist:js', function () {
|
||||
return distJs(false);
|
||||
|
@ -334,17 +347,24 @@ gulp.task('dist:preprocess', function () {
|
|||
});
|
||||
|
||||
gulp.task('dist', ['build'], function (cb) {
|
||||
return dist(false, cb);
|
||||
return dist({}, cb);
|
||||
});
|
||||
|
||||
gulp.task('dist:edge', ['build'], function (cb) {
|
||||
return dist(true, cb);
|
||||
return dist({ edge: true }, cb);
|
||||
});
|
||||
|
||||
function dist(edge, cb) {
|
||||
gulp.task('dist:firefox', ['build'], function (cb) {
|
||||
return dist({ firefox: true }, cb);
|
||||
});
|
||||
|
||||
function dist(o, cb) {
|
||||
var distCss = o.edge ? 'dist:css:edge' : o.firefox ? 'dist:css:firefox' : 'dist:css';
|
||||
var distJs = o.edge ? 'dist:js:edge' : 'dist:js';
|
||||
|
||||
return runSequence(
|
||||
'dist:clean',
|
||||
['dist:move', 'dist:css', edge ? 'dist:js:edge' : 'dist:js'],
|
||||
['dist:move', distCss, distJs],
|
||||
'dist:preprocess',
|
||||
cb);
|
||||
}
|
||||
|
@ -355,7 +375,7 @@ var sidebarActionManifestObj = {
|
|||
"default_icon": "images/icon19.png"
|
||||
};
|
||||
|
||||
gulp.task('dist-firefox', ['dist'], function (cb) {
|
||||
gulp.task('dist-firefox', ['dist:firefox'], function (cb) {
|
||||
gulp.src(paths.dist + 'manifest.json')
|
||||
.pipe(jeditor(function (manifest) {
|
||||
manifest.applications = {
|
||||
|
|
|
@ -8,7 +8,6 @@ angular
|
|||
self.animation = '';
|
||||
self.xsBody = $window.screen.availHeight < 600;
|
||||
self.smBody = !self.xsBody && $window.screen.availHeight <= 800;
|
||||
self.lgBody = !self.xsBody && !self.smBody && utilsService && !utilsService.isFirefox() && !utilsService.isEdge();
|
||||
self.disableSearch = utilsService && utilsService.isEdge();
|
||||
self.inSidebar = utilsService && utilsService.inSidebar($window);
|
||||
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
<!-- @endexclude -->
|
||||
</head>
|
||||
<body ng-controller="mainController as main" class="{{main.animation}}"
|
||||
ng-class="{lg: main.lgBody, sm: main.smBody, xs: main.xsBody }">
|
||||
ng-class="{sm: main.smBody, xs: main.xsBody }">
|
||||
<div ui-view class="main-view"></div>
|
||||
|
||||
<!-- @if true !>
|
||||
|
|
|
@ -18,10 +18,14 @@ body {
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
body.lg {
|
||||
/* @ifndef firefox */
|
||||
/* @ifndef edge */
|
||||
body {
|
||||
width: 375px !important;
|
||||
height: 667px !important;
|
||||
}
|
||||
/* @endif */
|
||||
/* @endif */
|
||||
|
||||
body.sm {
|
||||
width: 375px !important;
|
||||
|
|
Loading…
Reference in New Issue