Update npm packages, remove grunt, lint css, add print styles
This commit is contained in:
Stéphane Goetz
bovenliggende
57f3111a97
commit
80d4646b2d
20
Gruntfile.js
20
Gruntfile.js
|
|
@ -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']);
|
||||
};
|
||||
103
gulpfile.js
103
gulpfile.js
|
|
@ -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']);
|
||||
|
|
|
|||
17
package.json
17
package.json
|
|
@ -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"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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'); ?>
|
||||
|
|
|
|||
34
themes/daux_singlepage/less/print.less → themes/common/less/_print.less
Executable file → Normal file
34
themes/daux_singlepage/less/print.less → themes/common/less/_print.less
Executable file → Normal file
|
|
@ -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) ")";
|
||||
}
|
||||
|
|
@ -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
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -55,6 +55,7 @@ Mixins
|
|||
content: " "; // 1
|
||||
display: table; // 2
|
||||
}
|
||||
|
||||
&::after {
|
||||
clear: both;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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%;
|
||||
}
|
||||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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
|
|
@ -0,0 +1,6 @@
|
|||
|
||||
@import "../../common/less/_print.less";
|
||||
|
||||
a[href]::after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
|
@ -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";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,2 +0,0 @@
|
|||
|
||||
|
||||
Laden…
Verwijs in nieuw issue