mmoser/grunt-assemble.io
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

init

Browse Source
This commit is contained in:
Mark Moser
2017-09-06 13:54:48 -05:00
commit be34c5148b
29 changed files with 5120 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
site/assets/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 97 KiB

0
site/assets/fonts/.keep Normal file
View File

0
site/assets/img/.keep Normal file
View File

0
site/assets/js/site.js Normal file
View File

23
site/assets/scss/components/_styleguide.scss Normal file
View File

@ -0,0 +1,23 @@
.color-samples {
> div {
display: flex;
margin: $gutter 0;
height: 100px;
div { flex: 1 1 auto; }
:nth-child(1) { background-color: $white; }
:nth-child(2) { background-color: $light; }
:nth-child(3) { background-color: $light-grey; }
:nth-child(4) { background-color: $dark-grey; }
:nth-child(5) { background-color: $black; }
:nth-child(6) { background-color: $dark-blue; }
:nth-child(7) { background-color: $blue; }
:nth-child(8) { background-color: $red; }
:nth-child(9) { background-color: $orange; }
:nth-child(10) { background-color: $yellow; }
}
}

25
site/assets/scss/elements/_layout.scss Normal file
View File

@ -0,0 +1,25 @@
body {
min-width: 300px;
}
header,
main {
margin: 0;
padding: 0;
}
section {
margin-bottom: $gutter;
padding: $gutter;
&:last-of-type {
margin-bottom: 0;
}
}
@media screen and (min-width: 900px) {
section {
padding: ($gutter * 2) calc((100% - 850px) / 2);
width: 850px;
}
}

27
site/assets/scss/generic/_reset.scss Normal file
View File

@ -0,0 +1,27 @@
// normalize css is loaded, then these additions:
html {
margin: 0;
padding: 0;
font-size: 16px;
box-sizing: border-box;
}
main,
section,
article,
aside,
footer,
h1,
h2,
h3,
h4,
h5,
h6,
div,
p,
ul,
*::before,
*::after {
box-sizing: inherit;
}

11
site/assets/scss/main.scss Normal file
View File

@ -0,0 +1,11 @@
@import 'tools/fonts';
@import 'tools/mixins';
@import 'settings/variables';
@import 'settings/colors';
@import 'generic/reset';
@import 'elements/layout';
@import 'components/styleguide';

14
site/assets/scss/settings/_colors.scss Normal file
View File

@ -0,0 +1,14 @@
$white: #fff;
$light: rgba(246, 244, 243, 1);
$light-grey: rgba(191, 189, 193, 1);
$dark-grey: rgba(46, 47, 47, 1);
$black: #000;
$yellow: rgba(255, 200, 87, 1);
$orange: rgba(233, 114, 76, 1);
$red: rgba(197, 40, 61, 1);
$blue: rgba(37, 95, 133, 1);
$dark-blue: rgba(24, 48, 89, 1);
$copy-light: $white;
$copy-dark: $black;

1
site/assets/scss/settings/_variables.scss Normal file
View File

@ -0,0 +1 @@
$gutter: 15px;

0
site/assets/scss/tools/_fonts.scss Normal file
View File

7
site/assets/scss/tools/_mixins.scss Normal file
View File

@ -0,0 +1,7 @@
@mixin slim-ul {
margin-right: 0;
margin-left: 0;
padding: 0;
list-style-type: none;
}

14
site/data/things.yml Normal file
View File

@ -0,0 +1,14 @@
things:
-
name: ball
color: red
size: 6in
-
name: stick
color: brown
size: 1.2mm x 1m
-
name: table
color: black
size: 48in x 24in x 36in

21
site/layouts/default.hbs Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="en">
<head>
{{> head }}
</head>
<body>
<header>
{{> header }}
</header>
<main>
{{> body }}
</main>
<footer>
{{> footer }}
</footer>
{{> javascripts }}
</body>
</html>

5
site/pages/index.hbs Normal file
View File

@ -0,0 +1,5 @@
---
title: Sample things
---
<h1>{{title}}</h1>

47
site/pages/styleguide.hbs Normal file
View File

@ -0,0 +1,47 @@
---
title: Styleguide
---
<section>
<h1>Looking at styling for an h1</h1>
<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<h2>Looking at styling for an h2</h2>
<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<h3>Looking at styling for an h3</h3>
<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<ul>
<li>item 1 in unordered list</li>
<li>item 2 in unordered list</li>
<li>item 3 in unordered list</li>
<li>item 4 in unordered list</li>
<li>item 5 in unordered list</li>
</ul>
<h4>Looking at styling for an h4</h4>
<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<h5>Looking at styling for an h5</h5>
<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<h6>Looking at styling for an h6</h6>
<p class="small">Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<a class="cta-primary" href="#cta-primary">Do a Thing!</a>
<a class="cta-secondary" href="#cta-secondary">Do another thing</a>
<h2>Colors</h2>
<div class="color-samples">
<div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
</section>

1
site/partials/footer.hbs Normal file
View File

@ -0,0 +1 @@
<div>footer</div>

9
site/partials/head.hbs Normal file
View File

@ -0,0 +1,9 @@
<meta charset='utf-8'>
<meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible'>
<meta content='width=device-width,initial-scale=1.0' name='viewport'>
<meta content="{{description}}" name='description'>
<title>{{title}}</title>
<link href="{{assets}}/vendor/normalize.css" rel="stylesheet" type="text/css" />
<link href="{{assets}}/css/main.css" rel="stylesheet" type="text/css" />

1
site/partials/header.hbs Normal file
View File

@ -0,0 +1 @@
<div>header</div>

1
site/partials/javascripts.hbs Normal file
View File

@ -0,0 +1 @@
<script src="{{assets}}/site.js"></script>