Skip to content

Commit 3f98c76

Browse files
author
mrmrs
committed
Update the presentation. No more background gray.
1 parent a654bac commit 3f98c76

File tree

10 files changed

+60
-200
lines changed

10 files changed

+60
-200
lines changed

‎components/layout/aspect-ratio-16x9/index.html

Lines changed: 6 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
</head>
2525
<body class="w-100 sans-serif bg-white">
2626
<main>
27-
<article class="mw5 mw6-ns center bg-light-gray pa3 pa5-ns">
27+
<article class="mw5 mw6-ns center">
2828
<div class="aspect-ratio aspect-ratio--16x9 mb4">
2929
<div class="aspect-ratio--object cover" style="background:url(http://mrmrs.io/photos/001.jpg) center;"></div>
3030
</div>
@@ -37,7 +37,7 @@ <h1 class="f4 f3-ns mt4">Aspect Ratio 16x9</h1>
3737
<h2 class="f5">HTML</h2>
3838
<p class="f5 black-70"></p>
3939
<pre class="pa3 ba br2 b--black-10 h5 bg-white-20" id="html">
40-
&lt;article class=&quot;mw5 mw6-ns center bg-light-gray pa3 pa5-ns&quot;&gt;
40+
&lt;article class=&quot;mw5 mw6-ns center&quot;&gt;
4141
&lt;div class=&quot;aspect-ratio aspect-ratio--16x9 mb4&quot;&gt;
4242
&lt;div class=&quot;aspect-ratio--object cover&quot; style=&quot;background:url(http://mrmrs.io/photos/001.jpg) center;&quot;&gt;&lt;/div&gt;
4343
&lt;/div&gt;
@@ -55,14 +55,6 @@ <h2 class="f5">css</h2>
5555
max-width: 16rem;
5656
}
5757

58-
.bg-light-gray {
59-
background-color: #eee;
60-
}
61-
62-
.pa3 {
63-
padding: 1rem;
64-
}
65-
6658
.mb4 {
6759
margin-bottom: 2rem;
6860
}
@@ -96,10 +88,6 @@ <h2 class="f5">css</h2>
9688
.mw6-ns {
9789
max-width: 32rem;
9890
}
99-
100-
.pa5-ns {
101-
padding: 4rem;
102-
}
10391
}
10492

10593
</pre>
@@ -110,16 +98,16 @@ <h2 class="f5">css</h2>
11098
<h2 class="f5 mb3 mt4">Css stats for this component</h2>
11199
<dl class="dib mr4 mt0">
112100
<dt class="db f6">Gzipped Size</dt>
113-
<dd class="ml0 b f3 f2-ns">314<small class="f6">B</small>
101+
<dd class="ml0 b f3 f2-ns">274<small class="f6">B</small>
114102
</dd>
115103
</dl>
116104
<dl class="dib mr4 mt0">
117105
<dt class="db f6">Selectors</dt>
118-
<dd class="ml0 b f3 f2-ns">11</dd>
106+
<dd class="ml0 b f3 f2-ns">8</dd>
119107
</dl>
120108
<dl class="dib mt0">
121109
<dt class="db f6">Declarations</dt>
122-
<dd class="ml0 b f3 f2-ns">20</dd>
110+
<dd class="ml0 b f3 f2-ns">17</dd>
123111
</dl>
124112
</div>
125113
<div class="fl w-100">
@@ -130,8 +118,6 @@ <h2 class="f5 mt4">Modules referenced</h2>
130118

131119
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-max-widths">tachyons-max-widths</a></li>
132120

133-
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-skins">tachyons-skins</a></li>
134-
135121
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-spacing">tachyons-spacing</a></li>
136122

137123
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-utilities">tachyons-utilities</a></li>
@@ -144,7 +130,7 @@ <h2 class="f5 mt4">Modules referenced</h2>
144130

145131

146132
<h4 class="mt5">Install via npm <small class="fw2 f6 db mt1">Only installs the needed tachyons-modules for this component</small></h4>
147-
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-skins tachyons-spacing tachyons-utilities</code>
133+
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-spacing tachyons-utilities</code>
148134
<section class="bt b--black-10 mt5 pv4">
149135
<h1 class="f6 b ttu">Other Components</h1>
150136

‎components/layout/aspect-ratio-1x1/index.html

Lines changed: 6 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
</head>
2525
<body class="w-100 sans-serif bg-white">
2626
<main>
27-
<article class="mw5 mw6-ns center bg-light-gray pa3 pa5-ns">
27+
<article class="mw5 mw6-ns center">
2828
<div class="aspect-ratio aspect-ratio--1x1 mb4">
2929
<div class="aspect-ratio--object cover" style="background:url(http://mrmrs.io/photos/001.jpg) center;"></div>
3030
</div>
@@ -37,7 +37,7 @@ <h1 class="f4 f3-ns mt4">Aspect Ratio 1x1</h1>
3737
<h2 class="f5">HTML</h2>
3838
<p class="f5 black-70"></p>
3939
<pre class="pa3 ba br2 b--black-10 h5 bg-white-20" id="html">
40-
&lt;article class=&quot;mw5 mw6-ns center bg-light-gray pa3 pa5-ns&quot;&gt;
40+
&lt;article class=&quot;mw5 mw6-ns center&quot;&gt;
4141
&lt;div class=&quot;aspect-ratio aspect-ratio--1x1 mb4&quot;&gt;
4242
&lt;div class=&quot;aspect-ratio--object cover&quot; style=&quot;background:url(http://mrmrs.io/photos/001.jpg) center;&quot;&gt;&lt;/div&gt;
4343
&lt;/div&gt;
@@ -55,14 +55,6 @@ <h2 class="f5">css</h2>
5555
max-width: 16rem;
5656
}
5757

58-
.bg-light-gray {
59-
background-color: #eee;
60-
}
61-
62-
.pa3 {
63-
padding: 1rem;
64-
}
65-
6658
.mb4 {
6759
margin-bottom: 2rem;
6860
}
@@ -96,10 +88,6 @@ <h2 class="f5">css</h2>
9688
.mw6-ns {
9789
max-width: 32rem;
9890
}
99-
100-
.pa5-ns {
101-
padding: 4rem;
102-
}
10391
}
10492

10593
</pre>
@@ -110,16 +98,16 @@ <h2 class="f5">css</h2>
11098
<h2 class="f5 mb3 mt4">Css stats for this component</h2>
11199
<dl class="dib mr4 mt0">
112100
<dt class="db f6">Gzipped Size</dt>
113-
<dd class="ml0 b f3 f2-ns">309<small class="f6">B</small>
101+
<dd class="ml0 b f3 f2-ns">270<small class="f6">B</small>
114102
</dd>
115103
</dl>
116104
<dl class="dib mr4 mt0">
117105
<dt class="db f6">Selectors</dt>
118-
<dd class="ml0 b f3 f2-ns">11</dd>
106+
<dd class="ml0 b f3 f2-ns">8</dd>
119107
</dl>
120108
<dl class="dib mt0">
121109
<dt class="db f6">Declarations</dt>
122-
<dd class="ml0 b f3 f2-ns">20</dd>
110+
<dd class="ml0 b f3 f2-ns">17</dd>
123111
</dl>
124112
</div>
125113
<div class="fl w-100">
@@ -130,8 +118,6 @@ <h2 class="f5 mt4">Modules referenced</h2>
130118

131119
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-max-widths">tachyons-max-widths</a></li>
132120

133-
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-skins">tachyons-skins</a></li>
134-
135121
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-spacing">tachyons-spacing</a></li>
136122

137123
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-utilities">tachyons-utilities</a></li>
@@ -144,7 +130,7 @@ <h2 class="f5 mt4">Modules referenced</h2>
144130

145131

146132
<h4 class="mt5">Install via npm <small class="fw2 f6 db mt1">Only installs the needed tachyons-modules for this component</small></h4>
147-
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-skins tachyons-spacing tachyons-utilities</code>
133+
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-spacing tachyons-utilities</code>
148134
<section class="bt b--black-10 mt5 pv4">
149135
<h1 class="f6 b ttu">Other Components</h1>
150136

‎components/layout/aspect-ratio-3x4/index.html

Lines changed: 6 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
</head>
2525
<body class="w-100 sans-serif bg-white">
2626
<main>
27-
<article class="mw5 mw6-ns center bg-light-gray pa3 pa5-ns">
27+
<article class="mw5 mw6-ns center">
2828
<div class="aspect-ratio aspect-ratio--3x4 mb4">
2929
<div class="aspect-ratio--object cover" style="background:url(http://mrmrs.io/photos/001.jpg) center;"></div>
3030
</div>
@@ -37,7 +37,7 @@ <h1 class="f4 f3-ns mt4">Aspect Ratio 3x4</h1>
3737
<h2 class="f5">HTML</h2>
3838
<p class="f5 black-70"></p>
3939
<pre class="pa3 ba br2 b--black-10 h5 bg-white-20" id="html">
40-
&lt;article class=&quot;mw5 mw6-ns center bg-light-gray pa3 pa5-ns&quot;&gt;
40+
&lt;article class=&quot;mw5 mw6-ns center&quot;&gt;
4141
&lt;div class=&quot;aspect-ratio aspect-ratio--3x4 mb4&quot;&gt;
4242
&lt;div class=&quot;aspect-ratio--object cover&quot; style=&quot;background:url(http://mrmrs.io/photos/001.jpg) center;&quot;&gt;&lt;/div&gt;
4343
&lt;/div&gt;
@@ -55,14 +55,6 @@ <h2 class="f5">css</h2>
5555
max-width: 16rem;
5656
}
5757

58-
.bg-light-gray {
59-
background-color: #eee;
60-
}
61-
62-
.pa3 {
63-
padding: 1rem;
64-
}
65-
6658
.mb4 {
6759
margin-bottom: 2rem;
6860
}
@@ -96,10 +88,6 @@ <h2 class="f5">css</h2>
9688
.mw6-ns {
9789
max-width: 32rem;
9890
}
99-
100-
.pa5-ns {
101-
padding: 4rem;
102-
}
10391
}
10492

10593
</pre>
@@ -110,16 +98,16 @@ <h2 class="f5">css</h2>
11098
<h2 class="f5 mb3 mt4">Css stats for this component</h2>
11199
<dl class="dib mr4 mt0">
112100
<dt class="db f6">Gzipped Size</dt>
113-
<dd class="ml0 b f3 f2-ns">313<small class="f6">B</small>
101+
<dd class="ml0 b f3 f2-ns">272<small class="f6">B</small>
114102
</dd>
115103
</dl>
116104
<dl class="dib mr4 mt0">
117105
<dt class="db f6">Selectors</dt>
118-
<dd class="ml0 b f3 f2-ns">11</dd>
106+
<dd class="ml0 b f3 f2-ns">8</dd>
119107
</dl>
120108
<dl class="dib mt0">
121109
<dt class="db f6">Declarations</dt>
122-
<dd class="ml0 b f3 f2-ns">20</dd>
110+
<dd class="ml0 b f3 f2-ns">17</dd>
123111
</dl>
124112
</div>
125113
<div class="fl w-100">
@@ -130,8 +118,6 @@ <h2 class="f5 mt4">Modules referenced</h2>
130118

131119
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-max-widths">tachyons-max-widths</a></li>
132120

133-
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-skins">tachyons-skins</a></li>
134-
135121
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-spacing">tachyons-spacing</a></li>
136122

137123
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-utilities">tachyons-utilities</a></li>
@@ -144,7 +130,7 @@ <h2 class="f5 mt4">Modules referenced</h2>
144130

145131

146132
<h4 class="mt5">Install via npm <small class="fw2 f6 db mt1">Only installs the needed tachyons-modules for this component</small></h4>
147-
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-skins tachyons-spacing tachyons-utilities</code>
133+
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-spacing tachyons-utilities</code>
148134
<section class="bt b--black-10 mt5 pv4">
149135
<h1 class="f6 b ttu">Other Components</h1>
150136

‎components/layout/aspect-ratio-4x3/index.html

Lines changed: 6 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
</head>
2525
<body class="w-100 sans-serif bg-white">
2626
<main>
27-
<article class="mw5 mw6-ns center bg-light-gray pa3 pa5-ns">
27+
<article class="mw5 mw6-ns center">
2828
<div class="aspect-ratio aspect-ratio--4x3 mb4">
2929
<div class="aspect-ratio--object cover" style="background:url(http://mrmrs.io/photos/001.jpg) center;"></div>
3030
</div>
@@ -37,7 +37,7 @@ <h1 class="f4 f3-ns mt4">Aspect Ratio 4x3</h1>
3737
<h2 class="f5">HTML</h2>
3838
<p class="f5 black-70"></p>
3939
<pre class="pa3 ba br2 b--black-10 h5 bg-white-20" id="html">
40-
&lt;article class=&quot;mw5 mw6-ns center bg-light-gray pa3 pa5-ns&quot;&gt;
40+
&lt;article class=&quot;mw5 mw6-ns center&quot;&gt;
4141
&lt;div class=&quot;aspect-ratio aspect-ratio--4x3 mb4&quot;&gt;
4242
&lt;div class=&quot;aspect-ratio--object cover&quot; style=&quot;background:url(http://mrmrs.io/photos/001.jpg) center;&quot;&gt;&lt;/div&gt;
4343
&lt;/div&gt;
@@ -55,14 +55,6 @@ <h2 class="f5">css</h2>
5555
max-width: 16rem;
5656
}
5757

58-
.bg-light-gray {
59-
background-color: #eee;
60-
}
61-
62-
.pa3 {
63-
padding: 1rem;
64-
}
65-
6658
.mb4 {
6759
margin-bottom: 2rem;
6860
}
@@ -96,10 +88,6 @@ <h2 class="f5">css</h2>
9688
.mw6-ns {
9789
max-width: 32rem;
9890
}
99-
100-
.pa5-ns {
101-
padding: 4rem;
102-
}
10391
}
10492

10593
</pre>
@@ -110,16 +98,16 @@ <h2 class="f5">css</h2>
11098
<h2 class="f5 mb3 mt4">Css stats for this component</h2>
11199
<dl class="dib mr4 mt0">
112100
<dt class="db f6">Gzipped Size</dt>
113-
<dd class="ml0 b f3 f2-ns">310<small class="f6">B</small>
101+
<dd class="ml0 b f3 f2-ns">271<small class="f6">B</small>
114102
</dd>
115103
</dl>
116104
<dl class="dib mr4 mt0">
117105
<dt class="db f6">Selectors</dt>
118-
<dd class="ml0 b f3 f2-ns">11</dd>
106+
<dd class="ml0 b f3 f2-ns">8</dd>
119107
</dl>
120108
<dl class="dib mt0">
121109
<dt class="db f6">Declarations</dt>
122-
<dd class="ml0 b f3 f2-ns">20</dd>
110+
<dd class="ml0 b f3 f2-ns">17</dd>
123111
</dl>
124112
</div>
125113
<div class="fl w-100">
@@ -130,8 +118,6 @@ <h2 class="f5 mt4">Modules referenced</h2>
130118

131119
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-max-widths">tachyons-max-widths</a></li>
132120

133-
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-skins">tachyons-skins</a></li>
134-
135121
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-spacing">tachyons-spacing</a></li>
136122

137123
<li class="fl w-100 w-50-m w-33-ns"><a class="f5 link dim blue fw6" href="https://github.com/tachyons-css/tachyons-utilities">tachyons-utilities</a></li>
@@ -144,7 +130,7 @@ <h2 class="f5 mt4">Modules referenced</h2>
144130

145131

146132
<h4 class="mt5">Install via npm <small class="fw2 f6 db mt1">Only installs the needed tachyons-modules for this component</small></h4>
147-
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-skins tachyons-spacing tachyons-utilities</code>
133+
<code class="f6">npm i --save tachyons-background-size tachyons-max-widths tachyons-spacing tachyons-utilities</code>
148134
<section class="bt b--black-10 mt5 pv4">
149135
<h1 class="f6 b ttu">Other Components</h1>
150136

0 commit comments

Comments
 (0)