mirror of
https://github.com/google/material-design-lite.git
synced 2024-09-11 12:25:38 +03:00
Build boilerplate for microsite
commit d2da95318bd4ebe394ba05ec2bc0547dcabeb06b Merge:ecf5cf7b2e7d87Author: Alexander Surma <surma@surmair.de> Date: Wed Apr 29 10:55:52 2015 +0100 Merge branch 'master' into microsite Conflicts: docs/_templates/layout.html commitecf5cf7508Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 13:50:20 2015 +0100 Fix max-width for template listing commit78a64d2640Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 13:49:17 2015 +0100 Put index.md click handlers in separate JS file commite1faa43e16Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 12:05:54 2015 +0100 Turn dt into one-liner commiteb683be527Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 12:05:33 2015 +0100 Add TODO to index.md commitbb89b1bbd0Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 12:04:13 2015 +0100 Fix template listing commit0daecfb80fAuthor: Alexander Surma <surma@surmair.de> Date: Tue Apr 28 11:59:23 2015 +0100 Optimize SVGs in microsite commita1d05be3beMerge:4bbebf0b5a1abdAuthor: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 17:53:55 2015 +0100 Merge branch 'master' into microsite Conflicts: docs/_pages/index.md docs/_templates/layout.html commit4bbebf0971Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 17:47:04 2015 +0100 Make about page panels clickable commitb8ca6d11afAuthor: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 17:25:31 2015 +0100 Define own template for templates listing commit4d7ed02486Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 17:17:40 2015 +0100 Start template page commit3431192bcfAuthor: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 15:37:56 2015 +0100 Add pages commitce540db478Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 15:14:41 2015 +0100 Add header images for subpages commit6313ccdc69Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 13:19:46 2015 +0100 Update SVGs for consistent sizing commitdeeb99fb04Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 13:19:40 2015 +0100 Use grid commit097b3b30c3Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 27 12:02:26 2015 +0100 Fix box-shadow on header commit1acf796989Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 21 18:00:18 2015 +0100 Add actual hover pictures to microsite commit4be107e481Author: Alexander Surma <surma@surmair.de> Date: Tue Apr 21 16:23:55 2015 +0100 Implement landing page commit8aa6eb86ddAuthor: Alexander Surma <surma@surmair.de> Date: Mon Apr 20 16:46:26 2015 +0100 Implement layout commit63504ea175Author: Alexander Surma <surma@surmair.de> Date: Mon Apr 20 16:13:51 2015 +0100 Make gulp.watch() work properly with microsite
This commit is contained in:
Alexander Surma
parent
b2e7d87e01
commit
50bfaeb9d7
26
docs/_assets/components.svg
Normal file
26
docs/_assets/components.svg
Normal file
@ -0,0 +1,26 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="174px" height="279px" viewBox="0 0 174 279" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.1 (12005) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>components</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="components" sketch:type="MSLayerGroup">
|
||||
<g id="Page-1" transform="translate(2.000000, 3.000000)" stroke-width="3" sketch:type="MSShapeGroup">
|
||||
<g id="About">
|
||||
<g id="mo">
|
||||
<g id="Group">
|
||||
<ellipse id="Oval-1" stroke="#F6A623" cx="85" cy="45.5" rx="85" ry="45.5"></ellipse>
|
||||
<path d="M85,36 L85,59" id="Line" stroke="#FFFFFF"></path>
|
||||
<path d="M105,48 L66,48" id="Line-2" stroke="#FFFFFF"></path>
|
||||
<path d="M169,227 C169,252.405098 131.168061,273 84.5,273 C37.8319386,273 0,252.405098 0,227" id="Oval-2" stroke="#F6A623"></path>
|
||||
<path d="M0.5,51.2018141 L0.5,228.928853" id="Line-3" stroke="#F6A623"></path>
|
||||
<path d="M169.5,51.2018141 L169.5,228.928853" id="Line" stroke="#F6A623"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect id="Rectangle-1" stroke-opacity="0.01" stroke="#979797" sketch:type="MSShapeGroup" x="0" y="0" width="174" height="279"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
26
docs/_assets/components_mo.svg
Normal file
26
docs/_assets/components_mo.svg
Normal file
@ -0,0 +1,26 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="174px" height="279px" viewBox="0 0 174 279" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.1 (12005) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>components_mo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="components_mo" sketch:type="MSLayerGroup">
|
||||
<g id="Page-1" transform="translate(2.000000, 110.000000)" stroke-width="3" sketch:type="MSShapeGroup">
|
||||
<g id="About">
|
||||
<g id="mo">
|
||||
<g id="Group">
|
||||
<ellipse id="Oval-1" stroke="#F6A623" cx="85" cy="45.5" rx="85" ry="45.5"></ellipse>
|
||||
<path d="M85,36 L85,59" id="Line" stroke="#FFFFFF"></path>
|
||||
<path d="M105,48 L66,48" id="Line-2" stroke="#FFFFFF"></path>
|
||||
<path d="M169,120 C169,145.405098 131.168061,166 84.5,166 C37.8319386,166 0,145.405098 0,120" id="Oval-2" stroke="#F6A623"></path>
|
||||
<path d="M0,52.0793651 L0,121.972021" id="Line-3" stroke="#F6A623"></path>
|
||||
<path d="M169,52.0793651 L169,121.972021" id="Line" stroke="#F6A623"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect id="Rectangle-1" stroke-opacity="0.01" stroke="#979797" sketch:type="MSShapeGroup" x="0" y="0" width="174" height="279"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
23
docs/_assets/customize.svg
Normal file
23
docs/_assets/customize.svg
Normal file
@ -0,0 +1,23 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="156px" height="171px" viewBox="0 0 156 171" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Group</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="About" sketch:type="MSArtboardGroup" transform="translate(-637.000000, -2280.000000)" stroke-linecap="square" stroke="#FFCCBA" stroke-width="2.43">
|
||||
<g id="Group" sketch:type="MSLayerGroup" transform="translate(0.000000, 2187.000000)">
|
||||
<g transform="translate(637.000000, 93.000000)" id="Line" sketch:type="MSShapeGroup">
|
||||
<path d="M78.3506806,80.2458245 L119.421309,122.314653"></path>
|
||||
<path d="M74.3449812,169.273813 L119.686418,122.830374"></path>
|
||||
<path d="M40.2965361,122.08867 L2.18972151,83.0556888"></path>
|
||||
<path d="M1.7583555,60.5428316 L1.7583555,5.15157666"></path>
|
||||
<path d="M42.2993859,44.1306079 L76.3478309,7.20310462"></path>
|
||||
<path d="M100.382027,1.2483711 L154.496048,1.2483711"></path>
|
||||
<path d="M114.401975,44.1306079 L150.675128,81.2853613"></path>
|
||||
<path d="M152.070856,105.676447 L152.070856,156.964646"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
23
docs/_assets/customize_mo.svg
Normal file
23
docs/_assets/customize_mo.svg
Normal file
@ -0,0 +1,23 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="176px" height="201px" viewBox="0 0 176 201" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>mo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="About" sketch:type="MSArtboardGroup" transform="translate(-656.000000, -2263.000000)" stroke-linecap="square" stroke="#FFCCBA" stroke-width="2.43">
|
||||
<g id="Group" sketch:type="MSLayerGroup" transform="translate(0.000000, 2187.000000)">
|
||||
<g id="mo" transform="translate(715.000000, 212.500000) rotate(22.000000) translate(-715.000000, -212.500000) translate(637.000000, 93.000000)" sketch:type="MSShapeGroup">
|
||||
<path d="M78.3506806,80.2458245 L119.421309,122.314653" id="Line"></path>
|
||||
<path d="M74.3449812,169.273813 L119.686418,122.830374" id="Line"></path>
|
||||
<path d="M40.2965361,122.08867 L2.18972151,83.0556888" id="Line"></path>
|
||||
<path d="M1.7583555,60.5428316 L1.7583555,5.15157666" id="Line"></path>
|
||||
<path d="M42.2993859,44.1306079 L76.3478309,7.20310462" id="Line"></path>
|
||||
<path d="M100.382027,1.2483711 L154.496048,1.2483711" id="Line"></path>
|
||||
<path d="M114.401975,44.1306079 L150.675128,81.2853613" id="Line"></path>
|
||||
<path d="M152.070856,105.676447 L152.070856,156.964646" id="Line"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
8
docs/_assets/index.js
Normal file
8
docs/_assets/index.js
Normal file
@ -0,0 +1,8 @@
|
||||
(function() {
|
||||
Array.prototype.forEach.call(document.querySelectorAll('[data-target]'), function(el) {
|
||||
var target = el.getAttribute('data-target');
|
||||
el.addEventListener('click', function() {
|
||||
location.href = target;
|
||||
});
|
||||
});
|
||||
})();
|
||||
17
docs/_assets/logo.svg
Normal file
17
docs/_assets/logo.svg
Normal file
@ -0,0 +1,17 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>MDL logo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="Template-1---Left-nav" sketch:type="MSArtboardGroup" transform="translate(-56.000000, -56.000000)" stroke-width="3" stroke="#FFFFFF">
|
||||
<g id="Header-icons-+-logo" sketch:type="MSLayerGroup" transform="translate(56.000000, 56.000000)">
|
||||
<g id="MDL-logo" sketch:type="MSShapeGroup">
|
||||
<path d="M0,0 L35,0 L35,35 L0,35 L0,0 Z" id="Shape"></path>
|
||||
<path d="M35,0 L17.5,35 L0,0 L35,0 Z" id="Shape"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
@ -1,6 +1,241 @@
|
||||
.mdl-layout__content {
|
||||
padding: 20px;
|
||||
html > body {
|
||||
font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif !important;
|
||||
}
|
||||
.mdl-layout__header {
|
||||
height: 50vh;
|
||||
align-items: flex-start;
|
||||
padding: 32px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.mdl-layout-title {
|
||||
font-weight: 300;
|
||||
text-transform: uppercase;
|
||||
line-height: 1.5em;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.mdl-layout-title a {
|
||||
font-weight: inherit;
|
||||
}
|
||||
.mdl-layout__header {
|
||||
background-size: auto 30%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.about .mdl-layout__header {
|
||||
background-color: #37474f;
|
||||
background-image: url('logo.svg');
|
||||
}
|
||||
.about .mdl-navigation {
|
||||
background-color: #37474f;
|
||||
}
|
||||
.templates .mdl-layout__header {
|
||||
background-color: #00ACC2;
|
||||
background-image: url('templates.svg');
|
||||
}
|
||||
.templates .mdl-navigation {
|
||||
background-color: #00ACC2;
|
||||
}
|
||||
.components .mdl-layout__header {
|
||||
background-color: #E90974;
|
||||
background-image: url('components.svg');
|
||||
}
|
||||
.components .mdl-navigation {
|
||||
background-color: #E90974;
|
||||
}
|
||||
.styles .mdl-layout__header {
|
||||
background-color: #8F4099;
|
||||
background-image: url('styles.svg');
|
||||
}
|
||||
.styles .mdl-navigation {
|
||||
background-color: #8F4099;
|
||||
}
|
||||
.customize .mdl-layout__header {
|
||||
background-color: #191E80;
|
||||
background-image: url('customize.svg');
|
||||
}
|
||||
.customize .mdl-navigation {
|
||||
background-color: #191E80;
|
||||
}
|
||||
.mdl-navigation {
|
||||
box-shadow: none !important;
|
||||
border: 0 !important;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.mdl-navigation a {
|
||||
font-weight: 300;
|
||||
line-height: 64px;
|
||||
padding: 0 24px;
|
||||
color: white;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
.mdl-navigation a:hover {
|
||||
background-color: inherit;
|
||||
}
|
||||
.mdl-navigation a:not(.download) {
|
||||
opacity: 0.65;
|
||||
}
|
||||
.mdl-navigation a.download {
|
||||
text-decoration: none;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.mdl-navigation a.download button {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.mdl-navigation a.download .mdl-icon {
|
||||
color: black;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.about .mdl-navigation .about,
|
||||
.templates .mdl-navigation .templates,
|
||||
.components .mdl-navigation .components,
|
||||
.styles .mdl-navigation .styles,
|
||||
.customize .mdl-navigation .customize {
|
||||
opacity: 1;
|
||||
border-bottom-color: #18FFFF;
|
||||
}
|
||||
.mdl-layout__content {
|
||||
overflow: visible;
|
||||
}
|
||||
.mdl-layout__content > section.download {
|
||||
width: 100%;
|
||||
height: 6rem;
|
||||
font-size: 1.5rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.mdl-layout__content > section.download > a {
|
||||
font-weight: 300;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.mdl-layout__content > footer {
|
||||
height: 120px;
|
||||
}
|
||||
.mdl-mini-footer {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
justify-content: center;
|
||||
}
|
||||
.mdl-mini-footer ul {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.mdl-mini-footer ul > * {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.about-panel {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
}
|
||||
.about-panel--text {
|
||||
padding: 100px;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
line-height: 2em;
|
||||
}
|
||||
.about-panel--text dl {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
}
|
||||
.about-panel--text dl dt {
|
||||
text-align: right;
|
||||
vertical-align: top;
|
||||
width: 33%;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.about-panel--text dl dd {
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
width: 66%;
|
||||
margin: 0;
|
||||
margin-left: 24px;
|
||||
}
|
||||
.about-panel--components,
|
||||
.about-panel--styles,
|
||||
.about-panel--customize,
|
||||
.about-panel--templates {
|
||||
height: 500px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
padding: 40px;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.6rem;
|
||||
width: auto;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: auto 50%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.about-panel--templates {
|
||||
background-color: #B3E0E1;
|
||||
background-image: url(/assets/templates.svg);
|
||||
}
|
||||
.about-panel--templates:hover {
|
||||
background-image: url(/assets/templates_mo.svg);
|
||||
}
|
||||
.about-panel--components {
|
||||
background-color: #E90974;
|
||||
background-image: url(/assets/components.svg);
|
||||
}
|
||||
.about-panel--components:hover {
|
||||
background-image: url(/assets/components_mo.svg);
|
||||
}
|
||||
.about-panel--styles {
|
||||
background-color: #8F4099;
|
||||
background-image: url(/assets/styles.svg);
|
||||
}
|
||||
.about-panel--styles:hover {
|
||||
background-image: url(/assets/styles_mo.svg);
|
||||
}
|
||||
.about-panel--customize {
|
||||
background-color: #191E80;
|
||||
background-image: url(/assets/customize.svg);
|
||||
}
|
||||
.about-panel--customize:hover {
|
||||
background-image: url(/assets/customize_mo.svg);
|
||||
}
|
||||
|
||||
.templates .content {
|
||||
max-width: 1280px;
|
||||
}
|
||||
.templates .mdl-layout__content .content {
|
||||
padding: 72px 0;
|
||||
}
|
||||
.template {
|
||||
width: 100%;
|
||||
margin-bottom: 72px;
|
||||
}
|
||||
.template > .template__meta a {
|
||||
color:inherit;
|
||||
}
|
||||
.template > .template__preview {
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
min-height: 30vh;
|
||||
}
|
||||
.template.template--product > .template__preview {
|
||||
background-image: url('/assets/template_product.jpg');
|
||||
}
|
||||
.template.template--general > .template__preview {
|
||||
background-image: url('/assets/template_general.jpg');
|
||||
}
|
||||
|
||||
|
||||
.mdl-layout__content p {
|
||||
font-size: 15px;
|
||||
@ -46,33 +281,3 @@ button a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* TOC */
|
||||
|
||||
.chapter-toc h1 {
|
||||
font-size: 15px;
|
||||
line-height: 16px;
|
||||
padding-bottom: 12px;
|
||||
font-weight: 400;
|
||||
color: #757575;
|
||||
}
|
||||
|
||||
.chapter-toc {
|
||||
border-left: 5px solid #e1bee7;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.chapter-toc ul {
|
||||
list-style: none;
|
||||
margin-top: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.chapter-toc li:last-child {
|
||||
line-height: 20px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.chapter-toc li {
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
22
docs/_assets/mo.svg
Normal file
22
docs/_assets/mo.svg
Normal file
@ -0,0 +1,22 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="174px" height="277px" viewBox="0 0 174 277" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>mo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="About" sketch:type="MSArtboardGroup" transform="translate(-273.000000, -1765.000000)">
|
||||
<g id="mo" sketch:type="MSLayerGroup" transform="translate(274.000000, 1767.000000)">
|
||||
<g id="Group" sketch:type="MSShapeGroup">
|
||||
<ellipse id="Oval-1" stroke="#F6A623" stroke-width="3" cx="86" cy="45.5" rx="85" ry="45.5"></ellipse>
|
||||
<path d="M86,36 L86,59" id="Line" stroke="#FFFFFF" stroke-width="3" stroke-linecap="square"></path>
|
||||
<path d="M106,48 L67,48" id="Line-2" stroke="#FFFFFF" stroke-width="3" stroke-linecap="square"></path>
|
||||
<path d="M170,227 C170,252.405098 132.168061,273 85.5,273 C38.8319386,273 1,252.405098 1,227" id="Oval-2" stroke="#F6A623" stroke-width="3"></path>
|
||||
<path d="M26.5,157.5 L28,159" id="Line-2" stroke="#F6A623" stroke-linecap="square"></path>
|
||||
<path d="M1.5,51.2018141 L1.5,228.928853" id="Line-3" stroke="#F6A623" stroke-width="3" stroke-linecap="square"></path>
|
||||
<path d="M170.5,51.2018141 L170.5,228.928853" id="Line" stroke="#F6A623" stroke-width="3" stroke-linecap="square"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
24
docs/_assets/styles.svg
Normal file
24
docs/_assets/styles.svg
Normal file
@ -0,0 +1,24 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="333px" height="297px" viewBox="0 0 333 297" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.1 (12005) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>styles</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="styles" sketch:type="MSLayerGroup" transform="translate(2.000000, 0.000000)">
|
||||
<g id="Page-1" transform="translate(2.000000, 2.000000)" stroke-width="3" sketch:type="MSShapeGroup">
|
||||
<g id="About">
|
||||
<g id="Group-5">
|
||||
<path d="M125,136.297592 L125,291.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M247,61.2975922 L247,216.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M0,77.2975922 L0,232.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M0.5,233.5 L126,293" id="Line" stroke="#EA5B61"></path>
|
||||
<path d="M126.5,292.5 L245.5,218.5" id="Line" stroke="#EA5B61"></path>
|
||||
<path d="M0,76 L124,0 L246,59 L124,135 L0,76 L0,76 Z" id="Path-3" stroke="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect id="Rectangle-2" stroke-opacity="0.01" stroke="#979797" sketch:type="MSShapeGroup" x="0" y="0" width="331" height="297"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
24
docs/_assets/styles_mo.svg
Normal file
24
docs/_assets/styles_mo.svg
Normal file
@ -0,0 +1,24 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="333px" height="297px" viewBox="0 0 333 297" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.1 (12005) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>styles_mo</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="styles_mo" sketch:type="MSLayerGroup" transform="translate(2.000000, 0.000000)">
|
||||
<g id="Page-1" transform="translate(2.000000, 2.000000)" stroke-width="3" sketch:type="MSShapeGroup">
|
||||
<g id="About">
|
||||
<g id="mo">
|
||||
<path d="M125,136.297592 L205,291.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M247,61.2975922 L327,216.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M0,77.2975922 L80,232.5" id="Line-3" stroke="#EA5B61"></path>
|
||||
<path d="M80.5,233.5 L206,293" id="Line" stroke="#EA5B61"></path>
|
||||
<path d="M206.5,292.5 L325.5,218.5" id="Line" stroke="#EA5B61"></path>
|
||||
<path d="M0,76 L124,0 L246,59 L124,135 L0,76 L0,76 Z" id="Path-3" stroke="#FFFFFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect id="Rectangle-2" stroke-opacity="0.01" stroke="#979797" sketch:type="MSShapeGroup" x="0" y="0" width="331" height="297"></rect>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
BIN
docs/_assets/template_blog.jpg
Normal file
BIN
docs/_assets/template_blog.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
docs/_assets/template_dashboard.jpg
Normal file
BIN
docs/_assets/template_dashboard.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
BIN
docs/_assets/template_general.jpg
Normal file
BIN
docs/_assets/template_general.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
BIN
docs/_assets/template_product.jpg
Normal file
BIN
docs/_assets/template_product.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
16
docs/_assets/templates.svg
Normal file
16
docs/_assets/templates.svg
Normal file
@ -0,0 +1,16 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="279px" height="251px" viewBox="0 0 279 251" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Path 1 + Path 1 + Path 1</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="About" sketch:type="MSArtboardGroup" transform="translate(-582.000000, -1056.000000)" stroke-width="3">
|
||||
<g id="Path-1-+-Path-1-+-Path-1" sketch:type="MSLayerGroup" transform="translate(582.000000, 1056.000000)">
|
||||
<path d="M123.409063,112 L279,180.394072 L155.590937,251 L0,182.605928 L123.409063,112 L123.409063,112 Z" id="Rectangle-8" stroke="#204489" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M279,124.394072 L155.590937,195 L0,126.605928 L123.409063,56 L279,124.394072 Z" id="Rectangle-8" stroke="#18BFD6" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M279,68.3940718 L155.590937,139 L0,70.6059282 L123.409063,0 L279,68.3940718 Z" id="Rectangle-8" stroke="#FFFFFF" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
16
docs/_assets/templates_mo.svg
Normal file
16
docs/_assets/templates_mo.svg
Normal file
@ -0,0 +1,16 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="279px" height="251px" viewBox="0 0 279 251" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3 (11970) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Path 1 + Path 1 + Path 1</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="About" sketch:type="MSArtboardGroup" transform="translate(-582.000000, -1056.000000)" stroke-width="3">
|
||||
<g id="Path-1-+-Path-1-+-Path-1" sketch:type="MSLayerGroup" transform="translate(582.000000, 1056.000000)">
|
||||
<path d="M123.409063,112 L279,180.394072 L155.590937,251 L0,182.605928 L123.409063,112 L123.409063,112 Z" id="Rectangle-8" stroke="#204489" fill="#204489" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M279,124.394072 L155.590937,195 L0,126.605928 L123.409063,56 L279,124.394072 Z" id="Rectangle-8" stroke="#18BFD6" fill="#18BFD6" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M279,68.3940718 L155.590937,139 L0,70.6059282 L123.409063,0 L279,68.3940718 Z" id="Rectangle-8" stroke="#FFFFFF" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@ -1,5 +1,5 @@
|
||||
---
|
||||
layout: components
|
||||
title: Components
|
||||
bodyclass: components
|
||||
---
|
||||
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
---
|
||||
layout: customize
|
||||
title: Customize & Download
|
||||
bodyclass: customize
|
||||
---
|
||||
|
||||
|
||||
|
||||
@ -1,24 +1,36 @@
|
||||
---
|
||||
layout: page
|
||||
title: Welcome
|
||||
layout: layout
|
||||
bodyclass: about
|
||||
---
|
||||
<!-- TODO: Try to separate markup and content -->
|
||||
<section class="about-panel about-panel--text mdl-cell mdl-cell--12-col">
|
||||
<dl>
|
||||
<dt>Material Design Lite</dt>
|
||||
<dd>
|
||||
Material Design Lite lets you add a [Material Design](http://google.com/design/spec) look and feel to your static content websites. It doesn’t rely on any JavaScript frameworks and aims to optimise for cross-device use, gracefully degrade in older browsers and offer an experience that is accessible from the get-go.
|
||||
</dd>
|
||||
</dl>
|
||||
</section>
|
||||
|
||||
<section class="about-panel about-panel--templates mdl-cell mdl-cell--12-col" data-target="/templates">
|
||||
Templates
|
||||
</section>
|
||||
|
||||
Material Design Lite lets you add a [Material Design](http://google.com/design/spec) look and feel to your static content websites. It doesn’t rely on any JavaScript frameworks and aims to optimise for cross-device use, gracefully degrade in older browsers and offer an experience that is accessible from the get-go.
|
||||
<section class="about-panel about-panel--text mdl-cell mdl-cell--12-col">
|
||||
Esse dolor ullamco ipsum enim aliquip minim. Sunt ullamco excepteur laboris nulla sunt. Consequat labore irure sint cillum aute labore est cupidatat eu. Culpa sint do non amet quis quis fugiat laboris sit sint id Lorem. Dolor adipisicing eu nostrud eiusmod sint consequat enim est velit et non mollit minim.
|
||||
</section>
|
||||
|
||||
<a href="https://github.com/google/material-design-lite/archive/master.zip" class="mdl-download mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">Download Package</a>
|
||||
<section class="about-panel about-panel--components mdl-color-text--white mdl-cell mdl-cell--6-col-desktop mdl-cell--4-col" data-target="/components">
|
||||
Components
|
||||
</section>
|
||||
<section class="about-panel about-panel--styles mdl-color-text--white mdl-cell mdl-cell--6-col-desktop mdl-cell--4-col" data-target="/styles">
|
||||
Styles
|
||||
</section>
|
||||
<section class="about-panel about-panel--customize mdl-color-text--white mdl-cell mdl-cell--12-col" data-target="/customize">
|
||||
Customize
|
||||
</section>
|
||||
|
||||
|
||||
<img src="assets/shapes.svg" alt="Material Shapes">
|
||||
|
||||
## Cross-device by default
|
||||
|
||||
Develop with a single underlying system for your site that allows for a unified experience across platforms and device sizes. Mobile precepts are fundamental, but touch, mouse, and keyboard are all first-class input methods.
|
||||
|
||||
## Built with <abbr title="Block Element Modifier">BEM</abbr> & Sass
|
||||
|
||||
Material Design Lite provides vanilla CSS. Our source utilises Sass, the popular CSS preprocessor and BEM - [the front-end naming methodology](https://github.com/google/material-design-lite/wiki/Understanding-BEM). Quickly get started with the pre-built CSS or build the source yourself.
|
||||
|
||||
## Components
|
||||
|
||||
With Material Design Lite, you get dozens of custom HTML and CSS components. They're documented, lightweight and bring the beauty of Material Design to content sites.
|
||||
<section class="about-panel about-panel--text mdl-cell--12-col">
|
||||
Cillum magna sit ea exercitation excepteur enim pariatur ex deserunt. Deserunt aute nisi in laboris anim proident sunt enim pariatur quis. Aliqua anim voluptate veniam ad eiusmod ullamco deserunt. Laborum duis proident ipsum ex velit sint sint veniam amet eu Lorem. Nostrud adipisicing consequat deserunt magna consectetur pariatur culpa qui do. Ex dolor incididunt laborum ex ea non ea incididunt labore laboris minim consequat cillum. Proident nisi pariatur amet velit exercitation Lorem officia irure occaecat in deserunt. Tempor enim culpa do eu ipsum consequat irure amet officia.
|
||||
</section>
|
||||
<script src="assets/index.js" async></script>
|
||||
|
||||
5
docs/_pages/styles.md
Normal file
5
docs/_pages/styles.md
Normal file
@ -0,0 +1,5 @@
|
||||
---
|
||||
layout: layout
|
||||
title: Styles
|
||||
bodyclass: styles
|
||||
---
|
||||
18
docs/_pages/templates.md
Normal file
18
docs/_pages/templates.md
Normal file
@ -0,0 +1,18 @@
|
||||
---
|
||||
layout: templates
|
||||
title: Templates
|
||||
bodyclass: templates
|
||||
templates:
|
||||
- name: product
|
||||
title: Product
|
||||
description: Laborum quis laboris veniam minim labore id excepteur.
|
||||
- name: blog
|
||||
title: Blog
|
||||
description: Deserunt dolor dolore ut excepteur tempor occaecat aliqua sunt eu velit incididunt irure irure in.
|
||||
- name: general
|
||||
title: Universal
|
||||
description: Esse irure aliqua amet ullamco aliqua ullamco est exercitation adipisicing nisi laborum sit labore voluptate.
|
||||
- name: dashboard
|
||||
title: Dashboard
|
||||
description: Non laboris consequat ullamco aute cillum ad.
|
||||
---
|
||||
85
docs/_templates/layout.html
vendored
85
docs/_templates/layout.html
vendored
@ -37,43 +37,56 @@
|
||||
<link rel="stylesheet" href="/assets/main.css">
|
||||
<script src="/material.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="demo-layout">
|
||||
<div class="mdl-layout mdl-js-layout">
|
||||
<header class="mdl-layout__header">
|
||||
<!-- Icon -->
|
||||
<img class="mdl-layout-icon" src="/assets/app-icon.png">
|
||||
<!-- Title -->
|
||||
<span class="mdl-layout-title"><a href="/">Material Design Lite</a></span>
|
||||
<!-- Add spacer, to align navigation to the right -->
|
||||
<div class="mdl-layout-spacer"></div>
|
||||
<!-- Navigation -->
|
||||
<nav class="mdl-navigation">
|
||||
<a class="mdl-navigation__link" href="/">Home
|
||||
<a class="mdl-navigation__link" href="/getting_started">Getting started
|
||||
</a>
|
||||
<a class="mdl-navigation__link" href="/components">Components</a>
|
||||
<a class="mdl-navigation__link" href="/customize">Customize</a>
|
||||
<a class="mdl-navigation__link" href="http://github.com/google/material-design-lite">Github</a>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="mdl-layout__drawer">
|
||||
<span class="mdl-layout-title">Material Design Lite</span>
|
||||
<nav class="mdl-navigation">
|
||||
<a class="mdl-navigation__link" href="/">Home
|
||||
</a>
|
||||
<a class="mdl-navigation__link" href="/getting_started">Getting started
|
||||
</a>
|
||||
<a class="mdl-navigation__link" href="/components">Components</a>
|
||||
<a class="mdl-navigation__link" href="/customize">Customize</a>
|
||||
<a class="mdl-navigation__link" href="http://github.com/google/material-design-lite">Github</a>
|
||||
</nav>
|
||||
<body class="{{page.bodyclass}}">
|
||||
<div class="mdl-layout mdl-js-layout">
|
||||
<header class="mdl-layout__header">
|
||||
<span class="mdl-layout-title"><a href="/">Material<br>Design<br>Lite</a></span>
|
||||
<div class="mdl-layout-spacer"></div>
|
||||
<div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable">
|
||||
<label class="mdl-button mdl-js-button mdl-button--icon" for="search">
|
||||
<span class="mdl-icon mdl-icon--search"></span>
|
||||
</label>
|
||||
<div class="mdl-textfield__expandable-holder">
|
||||
<input class="mdl-textfield__input" type="text" id="search" />
|
||||
<label class="mdl-textfield__label" for="expando1">Enter your query...</label>
|
||||
</div>
|
||||
</div>
|
||||
<main class="mdl-layout__content">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
</div>
|
||||
</header>
|
||||
<nav class="mdl-navigation mdl-js-ripple-effect">
|
||||
<a href="/" class="mdl-navigation__link frontpage">About</a>
|
||||
<a href="/templates" class="mdl-navigation__link templates">Templates</a>
|
||||
<a href="/components" class="mdl-navigation__link components">Components</a>
|
||||
<a href="/styles" class="mdl-navigation__link styles">Styles</a>
|
||||
<a href="/customize" class="mdl-navigation__link customize">Customize</a>
|
||||
<a href="https://github.com/google/material-design-lite" class="mdl-navigation__link">GitHub</a>
|
||||
<div class="mdl-layout-spacer"></div>
|
||||
<a href="#" class="download">
|
||||
Download
|
||||
<button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--fab mdl-button--mini-fab mdl-color--lime-A200"><span class="mdl-icon mdl-icon--file-download"></span></button>
|
||||
</a>
|
||||
</nav>
|
||||
<main class="mdl-layout__content mdl-color-text--grey-600">
|
||||
<div class="content mdl-grid mdl-grid--no-spacing">
|
||||
{% block content %}
|
||||
{{content|safe}}
|
||||
{% endblock %}
|
||||
</div>
|
||||
<section class="download mdl-color--grey-800">
|
||||
<a href="#" class="mdl-color-text--grey-50">Download Kit</a>
|
||||
</section>
|
||||
<footer class="mdl-mini-footer mdl-color--grey-900">
|
||||
<ul>
|
||||
<button class="mdl-mini-footer--social-btn"></button>
|
||||
<button class="mdl-mini-footer--social-btn"></button>
|
||||
<button class="mdl-mini-footer--social-btn"></button>
|
||||
</ul>
|
||||
<ul>
|
||||
<a href="https://developers.google.com/web/starter-kit/">Web Starter Kit</a>
|
||||
<a href="#">Help</a>
|
||||
<a href="#">Privacy & Terms</a>
|
||||
</ul>
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
27
docs/_templates/templates.html
vendored
Normal file
27
docs/_templates/templates.html
vendored
Normal file
@ -0,0 +1,27 @@
|
||||
{% extends 'layout.html' %}
|
||||
{% block content %}
|
||||
{% for template in page.templates %}
|
||||
<section class="template template--{{ template.name }} mdl-grid mdl-cell mdl-cell--12-col">
|
||||
<div class="template__meta mdl-cell mdl-cell--4-col mdl-grid mdl-grid--no-spacing">
|
||||
<h3 class="template__header mdl-cell mdl-cell--12-col">{{ template.title }}</h3>
|
||||
<p class="mdl-cell mdl-cell--12-col">
|
||||
{{ template.description }}
|
||||
</p>
|
||||
<a href="#" class="mdl-cell mdl-cell--6-col-desktop mdl-cell--4-col-tablet mdl-cell--2-col-phone">
|
||||
<button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
|
||||
<span class="mdl-icon mdl-icon--file-download"></span>
|
||||
</button>
|
||||
Download
|
||||
</a>
|
||||
<a href="/templates/{{ template.name }}" target="_blank" class="mdl-cell mdl-cell--6-col-desktop mdl-cell--4-col-tablet mdl-cell--2-col-phone">
|
||||
<button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
|
||||
<span class="mdl-icon mdl-icon--arrow-forward"></span>
|
||||
</button>
|
||||
Preview
|
||||
</a>
|
||||
</div>
|
||||
<div class="template__preview mdl-cell mdl-cell--8-col" style="background-image: url('/assets/template_{{ template.name }}.jpg');">
|
||||
</div>
|
||||
</section>
|
||||
{% endfor %}
|
||||
{% endblock %}
|
||||
29
gulpfile.js
29
gulpfile.js
@ -245,14 +245,6 @@ gulp.task('test:visual', function() {
|
||||
*/
|
||||
var site = {};
|
||||
|
||||
|
||||
/**
|
||||
* Compiled swig templates cache.
|
||||
* @type {Object}
|
||||
*/
|
||||
var templates = {};
|
||||
|
||||
|
||||
/**
|
||||
* Generates an HTML file based on a template and file metadata.
|
||||
*/
|
||||
@ -263,14 +255,10 @@ function applyTemplate() {
|
||||
page: file.page,
|
||||
content: file.contents.toString()
|
||||
};
|
||||
// If template not in template cache, compile and add it.
|
||||
if (!templates[file.page.layout]) {
|
||||
var templateFile = path.join(
|
||||
__dirname, 'docs', '_templates', file.page.layout + '.html');
|
||||
$.util.log('Compiling template:', $.util.colors.yellow(file.page.layout));
|
||||
templates[file.page.layout] = swig.compileFile(templateFile);
|
||||
}
|
||||
var tpl = templates[file.page.layout];
|
||||
|
||||
var templateFile = path.join(
|
||||
__dirname, 'docs', '_templates', file.page.layout + '.html');
|
||||
var tpl = swig.compileFile(templateFile, {cache: false});
|
||||
file.contents = new Buffer(tpl(data), 'utf8');
|
||||
this.push(file);
|
||||
cb();
|
||||
@ -284,7 +272,7 @@ function applyTemplate() {
|
||||
gulp.task('components', function() {
|
||||
return gulp.src('./src/**/README.md', {base: './src'})
|
||||
// Add basic front matter.
|
||||
.pipe($.header('---\nlayout: component\n---\n\n'))
|
||||
.pipe($.header('---\nlayout: component\nbodyclass: components\n---\n\n'))
|
||||
.pipe($.frontMatter({property: 'page', remove: true}))
|
||||
.pipe($.marked())
|
||||
.pipe((function () {
|
||||
@ -351,6 +339,10 @@ gulp.task('pages', ['components'], function() {
|
||||
*/
|
||||
gulp.task('assets', function () {
|
||||
return gulp.src(['docs/_assets/**'])
|
||||
.pipe($.if(/\.(svg|jpg|png)$/i, $.imagemin({
|
||||
progressive: true,
|
||||
interlaced: true
|
||||
})))
|
||||
.pipe(gulp.dest('docs/out/assets'));
|
||||
});
|
||||
|
||||
@ -358,7 +350,7 @@ gulp.task('assets', function () {
|
||||
/**
|
||||
* Serves the landing page from "out" directory.
|
||||
*/
|
||||
gulp.task('serve', ['assets', 'pages', 'demos', 'templates'], function () {
|
||||
gulp.task('serve', ['scripts', 'styles', 'assets', 'pages', 'demos', 'templates'], function () {
|
||||
browserSync({
|
||||
notify: false,
|
||||
server: {
|
||||
@ -375,6 +367,7 @@ gulp.task('serve', ['assets', 'pages', 'demos', 'templates'], function () {
|
||||
gulp.watch(['src/**/*.html'], ['demos', reload]);
|
||||
gulp.watch(['src/**/README.md'], ['components', reload]);
|
||||
gulp.watch(['templates/**/*'], ['templates', reload]);
|
||||
gulp.watch(['docs/**/*', '!docs/out/**/*'], ['pages', 'assets', reload]);
|
||||
});
|
||||
|
||||
gulp.task('publish', ['default', 'templates', 'assets', 'pages', 'demos'], function() {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user