Skip to content

Commit a6b9e2b

Browse files
author
mrmrs
committed
Update the src css with box-shadow. Add box-shadow documentation.
1 parent 52d9d44 commit a6b9e2b

File tree

5 files changed

+99
-1
lines changed

5 files changed

+99
-1
lines changed

‎src/css/tachyons.css

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88

99
/* Modules */
1010
@import './_box-sizing';
11+
@import './_box-shadow';
1112
@import './_background-size';
1213
@import './_borders';
1314
@import './_border-colors';

‎src/modules/box-shadow.js

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
var _ = require('lodash')
2+
var fs = require('fs')
3+
var gzip = require('gzip-size')
4+
var filesize = require('filesize')
5+
var cssstats = require('cssstats')
6+
7+
8+
var module = require('tachyons-box-shadow/package.json')
9+
var moduleCss = fs.readFileSync('./node_modules/tachyons-box-shadow/css/tachyons-box-shadow.min.css', 'utf8')
10+
var moduleObj = cssstats(moduleCss)
11+
var moduleSize = filesize(moduleObj.gzipSize)
12+
var moduleName = module.name
13+
14+
var srcCSS = fs.readFileSync('./src/css/_box-shadow.css', 'utf8')
15+
var navDocs = fs.readFileSync('./src/templates/nav_docs.html', 'utf8')
16+
var siteFooter = fs.readFileSync('./src/templates/footer.html', 'utf8')
17+
var siteHeader = fs.readFileSync('./src/templates/header.html', 'utf8')
18+
var head = fs.readFileSync('./src/templates/head.html', 'utf8')
19+
var googleAnalytics = fs.readFileSync('./src/templates/ga.html', 'utf8')
20+
21+
var template = fs.readFileSync('./src/templates/docs/box-shadow/index.html', 'utf8')
22+
var tpl = _.template(template)
23+
var html = tpl({
24+
moduleVersion: module.version,
25+
moduleSize: moduleSize,
26+
name: moduleName,
27+
moduleObj: moduleObj,
28+
srcCSS: srcCSS,
29+
navDocs: navDocs,
30+
siteFooter: siteFooter,
31+
googleAnalytics: googleAnalytics,
32+
head: head,
33+
siteHeader: siteHeader
34+
})
35+
36+
fs.writeFileSync('./docs/themes/box-shadow/index.html', html)
37+

‎src/templates/docs/box-shadow/index.html

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>
5+
Box-Shadow / Theming / Docs / TACHYONS
6+
</title>
7+
<meta name="description" content="CSS">
8+
<%= head %>
9+
</head>
10+
<body class="w-100 sans-serif">
11+
<%= siteHeader %>
12+
<main class="">
13+
<article class="bg-near-white bt b--black-10 pa3 ph5-ns">
14+
<h4 class="f4 mv0 fw6 dib mr4"><%=name %></h4>
15+
<p class="measure lh-copy f5 f4-ns">
16+
This module provides several options for box-shadow. Feel free to customize if
17+
they do not suit your needs.
18+
</p>
19+
</article>
20+
<div class="ph3 ph5-ns pt4 pb5">
21+
<h2 class="f3 bold">Examples</h2>
22+
<h3 class="f5 book pt4 caps">Box Shadow</h3>
23+
<code class="f6 db mv3"></code>
24+
<div class="shadow-1 ph3 pv4 tc mw6 mb4"><code>.shadow-1</code></div>
25+
<div class="shadow-2 ph3 pv4 tc mw6 mb4"><code>.shadow-2</code></div>
26+
<div class="shadow-3 ph3 pv4 tc mw6 mb4"><code>.shadow-3</code></div>
27+
<div class="shadow-4 ph3 pv4 tc mw6 mb4"><code>.shadow-4</code></div>
28+
<div class="shadow-5 ph3 pv4 tc mw6 mb4"><code>.shadow-5</code></div>
29+
<div class="mt5 cf dn">
30+
<div class="dib mr4">
31+
<h1 class="f4 ttu tracked fw6">Previous</h1>
32+
<a href="/docs/debug/" class="link fw6 blue dim">Debug</a>
33+
</div>
34+
<div class="dib">
35+
<h1 class="f4 ttu tracked fw6">Next</h1>
36+
<a href="/docs/typography/scale/" class="link fw6 blue dim">Type Scale</a>
37+
</div>
38+
</div>
39+
<div class="mt5">
40+
<h1 class="f4 ttu tracked fw6">Reference</h1>
41+
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow" class="db link fw6 blue dim">MDN - Box Shadow CSS</a>
42+
</div>
43+
</div>
44+
<section class="bg-near-white black-70 pt4 pb5 overflow-container">
45+
<header class="ph3 ph5-ns pt4">
46+
<kbd class="yellow">src/_box-shadow.css</kbd>
47+
</header>
48+
<pre class="ph3 ph5-ns">
49+
<code class="code" style="font-size: .75rem;">
50+
<%= srcCSS %>
51+
</code>
52+
</pre>
53+
</section>
54+
<%= navDocs %>
55+
</main>
56+
<%= siteFooter %>
57+
<%= googleAnalytics %>
58+
</body>
59+
</html>

‎src/templates/docs/forms/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ <h1 class="f4 ttu tracked fw6">Reference</h1>
6363
</div>
6464
<section class="bg-near-white black-70 pt4 pb5 overflow-container">
6565
<header class="ph3 ph5-ns pt4">
66-
<kbd class="yellow">src/_links.css</kbd>
66+
<kbd class="yellow">src/_forms.css</kbd>
6767
</header>
6868
<pre class="ph3 ph5-ns">
6969
<code class="code" style="font-size: .75rem;">

‎src/templates/nav_docs.html

+1
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ <h2 class="f6 fw7 ttu tracked">Theming</h2>
4141
<a class="f5 fw4 dim link blue db pv1" href="/docs/themes/background-size/" title="Background Size">Background Size</a>
4242
<a class="f5 fw4 dim link blue db pv1" href="/docs/themes/borders/" title="Borders">Borders</a>
4343
<a class="f5 fw4 dim link blue db pv1" href="/docs/themes/border-radius/" title="Border Radius">Border Radius</a>
44+
<a class="f5 fw4 dim link blue db pv1" href="/docs/themes/box-shadow/" title="Box Shadow">Box Shadow</a>
4445
</article>
4546
</section>
4647
</section>

0 commit comments

Comments
 (0)