Remove zen-grid and styleguide.

This commit is contained in:
Fredrik Jonsson 2017-07-16 13:02:05 +02:00
commit ccb8a2637a
176 changed files with 8 additions and 28546 deletions

View file

@ -16,7 +16,6 @@ var options = {};
// accordingly.
options.rootPath = {
project : __dirname + '/',
styleGuide : __dirname + '/styleguide/',
theme : __dirname + '/'
};
@ -35,8 +34,7 @@ options.sass = {
options.rootPath.project + 'node_modules/breakpoint-sass/stylesheets',
options.rootPath.project + 'node_modules/chroma-sass/sass',
options.rootPath.project + 'node_modules/support-for/sass',
options.rootPath.project + 'node_modules/typey/stylesheets',
options.rootPath.project + 'node_modules/zen-grids/sass'
options.rootPath.project + 'node_modules/typey/stylesheets'
],
outputStyle: 'expanded'
};
@ -49,30 +47,6 @@ options.autoprefixer = {
]
};
// Define the style guide paths and options.
options.styleGuide = {
source: [
options.theme.sass,
options.theme.css + 'style-guide/'
],
destination: options.rootPath.styleGuide,
builder: 'builder/twig',
// The css and js paths are URLs, like '/misc/jquery.js'.
// The following paths are relative to the generated style guide.
css: [
path.relative(options.rootPath.styleGuide, options.theme.css + 'styles.css'),
path.relative(options.rootPath.styleGuide, options.theme.css + 'style-guide/chroma-kss-styles.css'),
path.relative(options.rootPath.styleGuide, options.theme.css + 'style-guide/kss-only.css')
],
js: [
],
homepage: 'homepage.md',
title: 'Hugo Zen Style Guide'
};
// Define the paths to the JS files to lint.
options.eslint = {
files : [
@ -104,7 +78,7 @@ gulp.task('default', ['build']);
// #################
// Build everything.
// #################
gulp.task('build', ['styles:production', 'styleguide', 'lint']);
gulp.task('build', ['styles:production', 'lint']);
// ##########
// Build CSS.
@ -112,9 +86,7 @@ gulp.task('build', ['styles:production', 'styleguide', 'lint']);
var sassFiles = [
options.theme.sass + '**/*.scss',
// Do not open Sass partials as they will be included as needed.
'!' + options.theme.sass + '**/_*.scss',
// Chroma markup has its own gulp task.
'!' + options.theme.sass + 'style-guide/kss-example-chroma.scss'
'!' + options.theme.sass + '**/_*.scss'
];
gulp.task('styles', ['clean:css'], function() {
@ -136,28 +108,6 @@ gulp.task('styles:production', ['clean:css'], function() {
.pipe(gulp.dest(options.theme.css));
});
// ##################
// Build style guide.
// ##################
gulp.task('styleguide', ['clean:styleguide', 'styleguide:kss-example-chroma'], function() {
return kss(options.styleGuide);
});
gulp.task('styleguide:kss-example-chroma', function() {
return gulp.src(options.theme.sass + 'style-guide/kss-example-chroma.scss')
.pipe(sass(options.sass).on('error', sass.logError))
.pipe($.replace(/(\/\*|\*\/)\n/g, ''))
.pipe($.rename('kss-example-chroma.twig'))
.pipe($.size({showFiles: true}))
.pipe(gulp.dest(options.theme.css + 'style-guide'));
});
// Debug the generation of the style guide with the --verbose flag.
gulp.task('styleguide:debug', ['clean:styleguide', 'styleguide:kss-example-chroma'], function() {
options.styleGuide.verbose = true;
return kss(options.styleGuide);
});
// #########################
// Lint Sass and JavaScript.
// #########################
@ -196,17 +146,14 @@ gulp.task('lint:sass-with-fail', function() {
// ##############################
// Watch for changes and rebuild.
// ##############################
gulp.task('watch', ['watch:lint-and-styleguide', 'watch:js']);
gulp.task('watch', ['watch:lint', 'watch:js']);
gulp.task('watch:css', ['styles'], function() {
return gulp.watch(options.theme.sass + '**/*.scss', options.gulpWatchOptions, ['styles']);
});
gulp.task('watch:lint-and-styleguide', ['styleguide', 'lint:sass'], function() {
return gulp.watch([
options.theme.sass + '**/*.scss',
options.theme.sass + '**/*.twig'
], options.gulpWatchOptions, ['styleguide', 'lint:sass']);
gulp.task('watch:lint', ['lint:sass'], function() {
return gulp.watch(options.theme.sass + '**/*.scss', options.gulpWatchOptions, ['lint:sass']);
});
gulp.task('watch:js', ['lint:js'], function() {
@ -216,17 +163,7 @@ gulp.task('watch:js', ['lint:js'], function() {
// ######################
// Clean all directories.
// ######################
gulp.task('clean', ['clean:css', 'clean:styleguide']);
// Clean style guide files.
gulp.task('clean:styleguide', function() {
// You can use multiple globbing patterns as you would with `gulp.src`
return del([
options.styleGuide.destination + '*.html',
options.styleGuide.destination + 'public',
options.theme.css + '**/*.twig'
], {force: true});
});
gulp.task('clean', ['clean:css']);
// Clean CSS files.
gulp.task('clean:css', function() {

View file

@ -29,8 +29,7 @@
"node-sass-import-once": "^1.2.0",
"sass-lint": "^1.10.2",
"support-for": "^1.0.7",
"typey": "^1.1.1",
"zen-grids": "^2.0.3"
"typey": "^1.1.1"
},
"engines": {
"node": ">=7.0.0"

View file

@ -1,6 +0,0 @@
<p>An image <img class="{{modifier_class}}" src="kss-assets/sample-inline.png"> that is inline with other text.</p>
<figure style="width: 50%; max-width: 300px;">
<figcaption>An image inside a figure.</figcaption>
<img class="{{modifier_class}}" src="kss-assets/sample.png">
</figure>

View file

@ -1,8 +0,0 @@
<p>A svg image <svg class="{{modifier_class}}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="10px" height="10px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"><polygon fill="#bdad94" stroke="#bdad94" stroke-width="37.6152" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points=" 259.216,29.942 330.27,173.919 489.16,197.007 374.185,309.08 401.33,467.31 259.216,392.612 117.104,467.31 144.25,309.08 29.274,197.007 188.165,173.919 "/></svg> that is inline with other text.</p>
<figure style="width: 50%; max-width: 300px;">
<figcaption>A svg inside a figure.</figcaption>
<svg class="{{modifier_class}}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
<polygon fill="#bdad94" stroke="#bdad94" stroke-width="37.6152" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points=" 259.216,29.942 330.27,173.919 489.16,197.007 374.185,309.08 401.33,467.31 259.216,392.612 117.104,467.31 144.25,309.08 29.274,197.007 188.165,173.919 "/>
</svg>
</figure>

View file

@ -1,24 +0,0 @@
<p>
<button type="button" class="{{modifier_class}}">Standard button</button>
<button type="button" class="{{modifier_class}}" disabled>disabled button</button>
</p>
<p>
<button type="submit" class="{{modifier_class}}">Submit button</button>
<button type="submit" class="{{modifier_class}}" disabled>Disabled submit button</button>
</p>
<p>
<button type="reset" class="{{modifier_class}}">Reset button</button>
<button type="reset" class="{{modifier_class}}" disabled>Disabled reset button</button>
</p>
<p>
<input type="button" class="{{modifier_class}}" value="Input button">
<input type="button" class="{{modifier_class}}" value="Disabled input button" disabled>
</p>
<p>
<input type="submit" class="{{modifier_class}}" value="Input submit button">
<input type="submit" class="{{modifier_class}}" value="Disabled input submit button" disabled>
</p>
<p>
<input type="reset" class="{{modifier_class}}" value="Input reset button">
<input type="reset" class="{{modifier_class}}" value="Disabled input reset button" disabled>
</p>

View file

@ -1,22 +0,0 @@
<fieldset class="{{modifier_class}}">
<legend>A fieldset</legend>
<label for="fieldsetText">Text input</label>
<input type="text" id="fieldsetText" placeholder="Text input">
</fieldset>
<fieldset class="{{modifier_class}}" disabled>
<legend>A disabled fieldset</legend>
<div>
<label for="fieldsetText2">Disabled text input</label>
<input type="text" id="fieldsetText2" placeholder="Disabled input">
</div>
<div>
<label for="fieldsetSelect">Disabled select menu</label>
<select id="fieldsetSelect">
<option>Disabled select</option>
</select>
</div>
<div>
<label><input type="checkbox"> Can't check this</label>
</div>
</fieldset>

View file

@ -1,7 +0,0 @@
<div>
<label><input type="checkbox" class="{{modifier_class}}"> Check me out</label>
</div>
<div>
<label><input type="checkbox" class="{{modifier_class}}" value="" disabled> Option two is disabled</label>
</div>

View file

@ -1,11 +0,0 @@
<div>
<label><input type="radio" class="{{modifier_class}}" value="option1" name="example-radio" checked> Option one</label>
</div>
<div>
<label><input type="radio" class="{{modifier_class}}" value="option2" name="example-radio"> Option two</label>
</div>
<div>
<label><input type="radio" class="{{modifier_class}}" value="option3" name="example-radio" disabled> Option three is disabled</label>
</div>

View file

@ -1,97 +0,0 @@
<div>
<label for="inputText">Text</label>
<input type="text" class="{{modifier_class}}" id="inputText" placeholder="Enter some text">
</div>
<div>
<label for="inputSearch">Search</label>
<input type="search" class="{{modifier_class}}" id="inputSearch" placeholder="Search">
</div>
<div>
<label for="inputTel">Telephone</label>
<input type="text" class="{{modifier_class}}" id="inputTel" placeholder="Enter some text">
</div>
<div>
<label for="inputURL">URL</label>
<input type="url" class="{{modifier_class}}" id="inputURL" placeholder="Enter a URL">
</div>
<div>
<label for="inputEmail">Email address</label>
<input type="email" class="{{modifier_class}}" id="inputEmail" placeholder="Enter email">
</div>
<div>
<label for="inputPassword">Password</label>
<input type="password" class="{{modifier_class}}" id="inputPassword" placeholder="Password">
</div>
<div>
<label for="inputDate">Date</label>
<input type="date" class="{{modifier_class}}" id="inputDate" placeholder="Enter a date">
</div>
<div>
<label for="inputTime">Time</label>
<input type="time" class="{{modifier_class}}" id="inputTime" placeholder="Enter a time">
</div>
<div>
<label for="inputNumber">Number</label>
<input type="number" class="{{modifier_class}}" id="inputNumber" placeholder="Enter a number">
</div>
<div>
<label for="inputRange">Range</label>
<input type="range" class="{{modifier_class}}" id="inputRange" placeholder="Enter a range">
</div>
<div>
<label for="inputColor">Color</label>
<input type="color" class="{{modifier_class}}" id="inputColor" placeholder="Enter a color">
</div>
<div>
<label for="inputFile">File input</label>
<input type="file" class="{{modifier_class}}" id="inputFile">
</div>
<div>
<label for="inputText">Disabled text</label>
<input type="text" class="{{modifier_class}}" disabled id="inputText" placeholder="Disabled text">
</div>
<div>
<label for="inputSearch">Disabled search</label>
<input type="search" class="{{modifier_class}}" disabled id="inputSearch" placeholder="Disabled search">
</div>
<div>
<label for="inputTel">Disabled telephone</label>
<input type="text" class="{{modifier_class}}" disabled id="inputTel" placeholder="Disabled telephone">
</div>
<div>
<label for="inputURL">Disabled URL</label>
<input type="url" class="{{modifier_class}}" disabled id="inputURL" placeholder="Disabled URL">
</div>
<div>
<label for="inputEmail">Disabled email address</label>
<input type="email" class="{{modifier_class}}" disabled id="inputEmail" placeholder="Disabled email">
</div>
<div>
<label for="inputPassword">Disabled password</label>
<input type="password" class="{{modifier_class}}" disabled id="inputPassword" placeholder="Disabled password">
</div>
<div>
<label for="inputDate">Disabled date</label>
<input type="date" class="{{modifier_class}}" disabled id="inputDate" placeholder="Disabled date">
</div>
<div>
<label for="inputTime">Disabled time</label>
<input type="time" class="{{modifier_class}}" disabled id="inputTime" placeholder="Disabled time">
</div>
<div>
<label for="inputNumber">Disabled number</label>
<input type="number" class="{{modifier_class}}" disabled id="inputNumber" placeholder="Disabled number">
</div>
<div>
<label for="inputRange">Disabled range</label>
<input type="range" class="{{modifier_class}}" disabled id="inputRange" placeholder="Disabled range">
</div>
<div>
<label for="inputColor">Disabled color</label>
<input type="color" class="{{modifier_class}}" disabled id="inputColor" placeholder="Disabled color">
</div>
<div>
<label for="inputFile">Disabled file input</label>
<input type="file" class="{{modifier_class}}" disabled id="inputFile">
</div>

View file

@ -1,8 +0,0 @@
<div>
<label class="{{modifier_class}}" for="lableInputText">A label for a text input</label>
<input type="text" id="lableInputText" placeholder="Enter some text">
</div>
<div>
<label class="{{modifier_class}}"><input type="checkbox"> A label wrapped around a checkbox</label>
</div>

View file

@ -1,38 +0,0 @@
<div>
<label for="selectDropdown">A standard drop-down</label>
<select class="{{modifier_class}}" id="selectDropdown">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<optgroup label="More options">
<option>Option 4</option>
<option>Option 5</option>
</optgroup>
</select>
</div>
<div>
<label for="selectMultiItem">A multi-item select field</label>
<select class="{{modifier_class}}" id="selectMultiItem" multiple>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<optgroup label="More options">
<option>Option 4</option>
<option>Option 5</option>
</optgroup>
</select>
</div>
<div>
<label for="selectDisabled">A disabled drop-down</label>
<select class="{{modifier_class}}" id="selectDisabled" disabled>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<optgroup label="More options">
<option>Option 4</option>
<option>Option 5</option>
</optgroup>
</select>
</div>

View file

@ -1,8 +0,0 @@
<div>
<label for="exampleTextarea">Text area</label>
<textarea class="{{modifier_class}}" rows="3" id="exampleTextarea"></textarea>
</div>
<div>
<label for="exampleTextarea">Disabled text area</label>
<textarea class="{{modifier_class}}" rows="3" id="exampleTextarea" disabled></textarea>
</div>

View file

@ -1,11 +0,0 @@
<blockquote class="{{modifier_class}}">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere
erat a ante.</p>
</blockquote>
<blockquote class="{{modifier_class}}">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere
erat a ante.</p>
<footer>J. Smith in <cite title="Source Title, 2nd Edition">Source
Title</cite></footer>
</blockquote>

View file

@ -1,9 +0,0 @@
<dl class="{{modifier_class}}">
<dt>Description lists</dt>
<dd>A description list is perfect for defining terms.</dd>
<dt>Euismod</dt>
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
<dt>Malesuada porta</dt>
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
</dl>

View file

@ -1,8 +0,0 @@
<figure class="{{modifier_class}}">
An illustration, diagram, photo, code listing, etc.
</figure>
<figure class="{{modifier_class}}">
An illustration, diagram, photo, code listing, etc.
<figcaption>Figure 1</figcaption>
</figure>

View file

@ -1,8 +0,0 @@
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque
penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id
dolor id nibh ultricies vehicula.</p>
<hr class="{{modifier_class}}">
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur
ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.</p>

View file

@ -1,17 +0,0 @@
<ol class="{{modifier_class}}">
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit</li>
<li>Integer molestie lorem at massa</li>
<li>Facilisis in pretium nisl aliquet</li>
<li>Nulla volutpat aliquam velit
<ol class="{{modifier_class}}">
<li>Phasellus iaculis neque</li>
<li>Purus sodales ultricies</li>
<li>Vestibulum laoreet porttitor sem</li>
<li>Ac tristique libero volutpat at</li>
</ol>
</li>
<li>Faucibus porta lacus fringilla vel</li>
<li>Aenean sit amet erat nunc</li>
<li>Eget porttitor lorem</li>
</ol>

View file

@ -1,12 +0,0 @@
<p class="{{modifier_class}}">Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque
penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id
dolor id nibh ultricies vehicula.</p>
<p class="{{modifier_class}}">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur
ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis,
est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec
elit. Donec ullamcorper nulla non metus auctor fringilla.</p>
<p class="{{modifier_class}}">Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit
non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi
erat porttitor ligula, eget lacinia odio sem nec elit.</p>

View file

@ -1,4 +0,0 @@
The following text is preformatted:
<pre class="{{modifier_class}}">
(ノ゜Д゜)ノ ︵ ┻━┻
</pre>

View file

@ -1,17 +0,0 @@
<ul class="{{modifier_class}}">
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit</li>
<li>Integer molestie lorem at massa</li>
<li>Facilisis in pretium nisl aliquet</li>
<li>Nulla volutpat aliquam velit
<ul class="{{modifier_class}}">
<li>Phasellus iaculis neque</li>
<li>Purus sodales ultricies</li>
<li>Vestibulum laoreet porttitor sem</li>
<li>Ac tristique libero volutpat at</li>
</ul>
</li>
<li>Faucibus porta lacus fringilla vel</li>
<li>Aenean sit amet erat nunc</li>
<li>Eget porttitor lorem</li>
</ul>

Some files were not shown because too many files have changed in this diff Show more