Update npm packages, remove grunt, lint css, add print styles

This commit is contained in:
Stéphane Goetz 2016-08-06 00:14:15 +02:00
bovenliggende 57f3111a97
commit 80d4646b2d
22 gewijzigde bestanden met toevoegingen van 127 en 158 verwijderingen

Bestand weergeven

@ -1,20 +0,0 @@
module.exports = function (grunt) {
'use strict';
grunt.loadNpmTasks('grunt-php');
grunt.initConfig({
php: {
dist: {
options: {
keepalive: true,
open: true,
port: 8085,
router: "index.php"
}
}
}
});
grunt.registerTask('default', ['php']);
};

Bestand weergeven

@ -1,11 +1,11 @@
var gulp = require('gulp'),
php = require('gulp-connect-php'),
var cssnano = require('cssnano'),
gulp = require('gulp'),
less = require('gulp-less'),
rename = require('gulp-rename'),
plumber = require('gulp-plumber'),
postcss = require('gulp-postcss'),
sourcemaps = require('gulp-sourcemaps');
sourcemaps = require('gulp-sourcemaps'),
stylelint = require('gulp-stylelint');
var resources = {
daux_blue:{source: "themes/daux/less/theme-blue.less", dest: "themes/daux/css/"},
@ -16,93 +16,76 @@ var resources = {
daux_singlepage:{source: "themes/daux_singlepage/less/main.less", dest: "themes/daux_singlepage/css/"}
};
function createTask(source, dest) {
return function() {
var nano_options = {
safe: true, // Disable dangerous optimisations
filterPlugins: false, // This does very weird stuff
autoprefixer: {
add: true, // Add needed prefixes
remove: true // Remove unnecessary prefixes
}
};
var stylelintRules = {
"indentation": 4,
"selector-list-comma-newline-after": "always-multi-line",
"selector-no-id": true,
// Autoprefixer
"at-rule-no-vendor-prefix": true,
"media-feature-name-no-vendor-prefix": true,
"property-no-vendor-prefix": true,
"selector-no-vendor-prefix": true,
"value-no-vendor-prefix": true
};
var cssnanoOptions = {
safe: true, // Disable dangerous optimisations
filterPlugins: false, // This does very weird stuff
autoprefixer: {
add: true, // Add needed prefixes
remove: true // Remove unnecessary prefixes
}
};
function createCSSTask(source, dest) {
return function () {
return gulp.src(source)
//.pipe(sourcemaps.init())
.pipe(plumber())
.pipe(less())
.pipe(postcss([
require('cssnano')(nano_options)
]))
.pipe(postcss([cssnano(cssnanoOptions)]))
.pipe(rename({suffix: '.min'}))
//.pipe(sourcemaps.write())
.pipe(gulp.dest(dest));
}
}
function createLinter() {
var gulpStylelint = require('gulp-stylelint');
var rules = {
"indentation": 4,
"selector-list-comma-newline-after": "always-multi-line",
"selector-no-id": true,
// Autoprefixer
"at-rule-no-vendor-prefix": true,
"media-feature-name-no-vendor-prefix": true,
"property-no-vendor-prefix": true,
"selector-no-vendor-prefix": true,
"value-no-vendor-prefix": true
};
gulp.task('lint-css', function () {
return gulp
.src(['themes/**/less/**/*.less', '!themes/**/vendor/**/*.less'])
.pipe(gulpStylelint({
.pipe(stylelint({
failAfterError: true,
config: {
extends: "stylelint-config-standard",
rules: rules
extends: 'stylelint-config-standard',
rules: stylelintRules
},
syntax: "less",
reporters: [
{formatter: 'string', console: true}
],
syntax: 'less',
reporters: [{
formatter: 'string',
console: true
}],
debug: true
}));
}
});
var style_tasks = [];
for (var style in resources) {
if (resources.hasOwnProperty(style)) {
gulp.task('style_' + style, createTask(resources[style].source, resources[style].dest));
gulp.task('style_' + style, createCSSTask(resources[style].source, resources[style].dest));
style_tasks.push('style_' + style);
}
}
gulp.task('lint-css', createLinter);
style_tasks.push('lint-css');
gulp.task("styles", style_tasks);
gulp.task('watch', function() {
gulp.task('watch', function () {
// Watch .less files
gulp.watch('themes/**/less/**/*.less', ['styles']);
});
gulp.task('php', function() {
php.server({
keepalive: true,
open: true,
port: 8085,
router: "index.php"
});
});
gulp.task('default', ['php']);
gulp.task('default', ['styles']);

Bestand weergeven

@ -1,19 +1,16 @@
{
"name": "daux.io",
"version": "0.1.1",
"version": "0.3.0",
"private": true,
"devDependencies": {
"cssnano": "^3.5.2",
"grunt": "^0.4.1",
"grunt-php": "^1.0.0",
"cssnano": "^3.7.3",
"gulp": "^3.9.1",
"gulp-connect-php": "^0.0.7",
"gulp-less": "^3.0.3",
"gulp-less": "^3.1.0",
"gulp-plumber": "^1.1.0",
"gulp-postcss": "^6.1.0",
"gulp-postcss": "^6.1.1",
"gulp-rename": "^1.2.2",
"gulp-sourcemaps": "^2.0.0-alpha",
"gulp-stylelint": "^2.0.2",
"stylelint-config-standard": "^6.0.0"
"gulp-sourcemaps": "^1.6.0",
"gulp-stylelint": "^3.0.0",
"stylelint-config-standard": "^12.0.0"
}
}

Bestand weergeven

@ -7,11 +7,11 @@
} ?>
<div class="Navbar hidden-print">
<header class="Navbar hidden-print">
<?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>
</div>
</header>
<div class="Columns content">
<div class="Columns__left hidden-print Collapsible">
<aside class="Columns__left Collapsible">
<div class="Collapsible__container">
<button type="button" class="Button Collapsible__trigger">
<span class="Collapsible__trigger--bar"></span>
@ -93,12 +93,8 @@
} ?>
</div>
</div>
<!-- For Mobile -->
</div>
</aside>
<div class="Columns__right <?= $params['html']['float'] ? 'Columns__right--float' : ''; ?>">
<div class="Columns__right__content">
<div class="doc_content">
<?= $this->section('content'); ?>

Bestand weergeven

@ -6,34 +6,40 @@
box-shadow: none !important;
}
.page-break {
display: block;
page-break-before: always;
}
h1, h2 {
h1, h2, h3, h4, h5, h6 {
page-break-after: avoid;
page-break-before: auto;
}
pre, blockquote {
border: 1px solid #999;
font-style: italic;
page-break-inside: avoid;
}
img {
page-break-inside: avoid;
border: 0; /* Some browsers like to show a border around images. Switch it off */
}
a,
a:visited {
text-decoration: underline;
a:visited { text-decoration: underline; }
abbr[title]::after { content: " (" attr(title) ")"; }
q { quotes: none; }
q::before { content: ""; }
q::after { content: " (" attr(cite) ")"; }
.page-break {
display: block;
page-break-before: always;
}
a[href]::after {
content: " (" attr(href) ")";
}
.hidden-print { display: none; }
/* Hide the navigation */
aside { display: none; }
abbr[title]::after {
content: " (" attr(title) ")";
}

Bestand weergeven

@ -6,7 +6,6 @@ h1, h2, h3, h4, h5, h6 {
font-weight: 300;
-webkit-font-smoothing: antialiased;
cursor: text;
line-height: 1.4em;
margin-top: 0.3em;
margin-bottom: 0.3em;

Bestand-diff onderdrukt omdat een of meer regels te lang zijn

Bestand-diff onderdrukt omdat een of meer regels te lang zijn

Bestand-diff onderdrukt omdat een of meer regels te lang zijn

Bestand-diff onderdrukt omdat een of meer regels te lang zijn

Bestand weergeven

@ -87,6 +87,7 @@ Components
// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
&:first-child {
margin-left: 0;
&:not(:last-child):not(.dropdown-toggle) {
.border-right-radius(0);
}
@ -111,10 +112,8 @@ Components
font-size: 18px;
line-height: 20px;
height: @navbar-height;
color: @light;
text-shadow: none;
font-family: @font-family-heading;
font-weight: 700;
}
@ -225,7 +224,7 @@ Components
}
.Page__header {
margin: 0 0 10px 0;
margin: 0 0 10px;
padding: 0;
border-bottom: 1px solid #eee;
@ -267,14 +266,12 @@ Components
position: relative;
float: right;
margin: 8px 20px;
vertical-align: middle;
&__field {
display: block;
width: 100%;
height: 34px;
padding: 6px 30px 6px 0;
color: #555;
background: #fff;
border: 1px solid #ccc;
@ -293,7 +290,6 @@ Components
position: absolute;
right: 9px;
top: 9px;
width: 16px;
height: 16px;
}
@ -332,7 +328,6 @@ Components
> a {
display: inline-block;
padding: 5px 14px;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 15px;

Bestand weergeven

@ -39,13 +39,14 @@ Homepage
.Homepage {
padding-top: 60px !important;
background-color: @light;
.kill-box-shadow;
border-radius: 0;
border: none;
color: @dark;
overflow: hidden;
padding-bottom: 0;
margin-bottom: 0;
.kill-box-shadow;
}
.HomepageTitle {
@ -73,19 +74,18 @@ Homepage
.Button--hero {
padding: 20px 30px;
.kill-background-image;
.kill-box-shadow;
border-radius: 0;
text-shadow: none;
border: none;
opacity: 0.8;
margin: 0 10px;
text-transform: uppercase;
border: 5px solid @dark;
font-family: @font-family-heading;
font-weight: 700;
.kill-background-image;
.kill-box-shadow;
@media (max-width: 768px) {
display: block;
margin-bottom: 10px;
@ -119,7 +119,6 @@ Homepage
.col-third {
width: 33.333333%;
float: left;
position: relative;
min-height: 1px;
padding-left: 15px;
@ -164,11 +163,12 @@ Homepage
.HomepageFooter {
background-color: @dark;
.kill-box-shadow;
border-radius: 0;
color: @light;
border: none;
.kill-box-shadow;
@media (max-width: 768px) {
padding: 0 20px;
text-align: center;
@ -195,7 +195,6 @@ Homepage
li {
a {
line-height: 32px;
font-size: 16px;
font-family: @font-family-heading;
font-weight: 700;

Bestand weergeven

@ -55,6 +55,7 @@ Mixins
content: " "; // 1
display: table; // 2
}
&::after {
clear: both;
}

Bestand weergeven

@ -0,0 +1,20 @@
@import "../../common/less/_print.less";
.Pager { display: none; }
.Columns__right {
width: 100% !important;
}
.s-content a::after {
content: " (" attr(href) ")";
font-size: 80%;
word-wrap: break-word; /* break long urls that donìt fit the page width */
}
/* Anchors don't need that */
.s-content a[href^="#"]::after { content: ""; }
h1 a[href]::after {
font-size: 50%;
}

Bestand weergeven

@ -46,11 +46,12 @@ html, body {
&__trigger {
padding: 7px 10px;
.kill-background-image;
.kill-box-shadow;
background-color: @sidebar-hover;
border: none;
.kill-background-image;
.kill-box-shadow;
&--bar {
display: block;
width: 18px;
@ -62,8 +63,8 @@ html, body {
}
&:hover {
.kill-box-shadow;
background-color: @dark;
.kill-box-shadow;
.icon-bar {
background-color: @light;
@ -74,7 +75,6 @@ html, body {
}
@media screen and (min-width: 768px) {
body {
//Needed only for floating code blocks
background-color: @light;
@ -126,6 +126,7 @@ html, body {
&__right {
width: 75%;
&__content {
padding: 20px;
min-height: 100%;
@ -133,17 +134,3 @@ html, body {
}
}
}
@media print {
.Columns__right {
width: 100% !important;
}
h1 a[href]::after {
font-size: 50%;
}
.hidden-print {
display: none;
}
}

Bestand weergeven

@ -6,7 +6,6 @@ body {
font-family: @font-family-text;
text-rendering: optimizeLegibility;
font-smoothing: antialiased;
font-size: 14px;
line-height: 1.5;
}
@ -123,7 +122,7 @@ h1, h2, h3, h4, h5, h6 {
width: 50%;
border: none;
border-left: 10px solid white;
margin: 0 0 10px 0;
margin: 0 0 10px;
padding: 0;
code {

Bestand weergeven

@ -18,3 +18,7 @@
@import "_components.less";
@import "_homepage.less";
@import "../../common/less/vendor/highlight.less";
@media print {
@import "_print.less";
}

Bestand-diff onderdrukt omdat een of meer regels te lang zijn

Bestand weergeven

@ -0,0 +1,6 @@
@import "../../common/less/_print.less";
a[href]::after {
content: " (" attr(href) ")";
}

Bestand weergeven

@ -1,8 +1,7 @@
// Core variables and mixins
@import "variables.less";
@import "../../common/less/_fonts.less";
@import "vendor/highlight.less";
@import "typography.less";
@import "_typography.less";
* {
-webkit-overflow-scrolling: touch;
@ -55,5 +54,5 @@ img {
}
@media print {
@import "print.less";
@import "_print.less";
}