Skip to content

Commit a875774

Browse files
committed
.hed -> .heading
1 parent 7960823 commit a875774

File tree

12 files changed

+54
-52
lines changed

12 files changed

+54
-52
lines changed

README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
[These demos](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/) accompany [Container Queries: Once More Unto the Breach](http://alistapart.com/article/container-queries), illustrating the how media queries are flawed in terms of modular design, and the proposed function of a syntax that allows breakpoints based on element size rather than viewport size.
44

5+
This repo uses a modified version of [Rob Brackett’s](https://github.com/Mr0grog) [element-query](https://github.com/Mr0grog/element-query) script.
6+
57
## Demos
68

79
**[Demo 1](http://responsiveimagescg.github.io/ALA-Whitworth-Demo/demo1/index.html)**<br>

demo1/styles.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ body {
117117
display: block;
118118
}
119119

120-
.hed {
120+
.heading {
121121
color: #aaa;
122122
font-family: 'Pathway Gothic One', sans-serif;
123123
font-size: 1.8em;
@@ -126,7 +126,7 @@ body {
126126
padding: .5em 0 0 0;
127127
text-transform: uppercase;
128128
}
129-
.hed strong {
129+
.heading strong {
130130
display: inline-block;
131131
color: rgba(255,255,255,.85);
132132
}

demo2/index.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ <h2 class="page-hed">Featured Item</h2>
2222

2323
<div class="mod">
2424
<div class="mod-header">
25-
<h3 class="hed">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
25+
<h3 class="heading">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
2626
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
2727
</div>
2828

@@ -53,7 +53,7 @@ <h2 class="page-hed">New Items</h2>
5353

5454
<div class="mod">
5555
<div class="mod-header">
56-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
56+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
5757
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
5858
</div>
5959
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">
@@ -76,7 +76,7 @@ <h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
7676

7777
<div class="mod">
7878
<div class="mod-header">
79-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
79+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
8080
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
8181
</div>
8282
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -99,7 +99,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
9999

100100
<div class="mod">
101101
<div class="mod-header">
102-
<h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
102+
<h2 class="heading">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
103103
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
104104
</div>
105105
<img src="../img/tapanddie.jpg" alt="A Whitworth tap and die set">
@@ -124,7 +124,7 @@ <h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
124124

125125
<div class="mod">
126126
<div class="mod-header">
127-
<h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
127+
<h2 class="heading">ALA Toolworks <strong>Thread Gauges</strong></h2>
128128
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
129129
</div>
130130
<img src="../img/threads.jpg" alt="A set of Whitworth thread gauges">
@@ -146,7 +146,7 @@ <h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
146146

147147
<div class="mod">
148148
<div class="mod-header">
149-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
149+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
150150
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
151151
</div>
152152
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -169,7 +169,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
169169

170170
<div class="mod">
171171
<div class="mod-header">
172-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
172+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
173173
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
174174
</div>
175175
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">

demo2/styles.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -147,7 +147,7 @@ body {
147147
display: block;
148148
}
149149

150-
.hed {
150+
.heading {
151151
color: #aaa;
152152
font-family: 'Pathway Gothic One', sans-serif;
153153
font-size: 1.8em;
@@ -156,7 +156,7 @@ body {
156156
padding: .5em 0 0 0;
157157
text-transform: uppercase;
158158
}
159-
.hed strong {
159+
.heading strong {
160160
display: inline-block;
161161
color: rgba(255,255,255,.85);
162162
}

demo3/index.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ <h2 class="page-hed">Featured Item</h2>
2323

2424
<div class="mod">
2525
<div class="mod-header">
26-
<h3 class="hed">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
26+
<h3 class="heading">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
2727
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
2828
</div>
2929

@@ -54,7 +54,7 @@ <h2 class="page-hed">New Items</h2>
5454

5555
<div class="mod">
5656
<div class="mod-header">
57-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
57+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
5858
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
5959
</div>
6060
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">
@@ -77,7 +77,7 @@ <h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
7777

7878
<div class="mod">
7979
<div class="mod-header">
80-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
80+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
8181
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
8282
</div>
8383
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -100,7 +100,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
100100

101101
<div class="mod">
102102
<div class="mod-header">
103-
<h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
103+
<h2 class="heading">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
104104
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
105105
</div>
106106
<img src="../img/tapanddie.jpg" alt="A Whitworth tap and die set">
@@ -125,7 +125,7 @@ <h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
125125

126126
<div class="mod">
127127
<div class="mod-header">
128-
<h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
128+
<h2 class="heading">ALA Toolworks <strong>Thread Gauges</strong></h2>
129129
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
130130
</div>
131131
<img src="../img/threads.jpg" alt="A set of Whitworth thread gauges">
@@ -147,7 +147,7 @@ <h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
147147

148148
<div class="mod">
149149
<div class="mod-header">
150-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
150+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
151151
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
152152
</div>
153153
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -170,7 +170,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
170170

171171
<div class="mod">
172172
<div class="mod-header">
173-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
173+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
174174
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
175175
</div>
176176
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">

demo4/index.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ <h2 class="page-hed">Featured Item</h2>
2525

2626
<div class="mod">
2727
<div class="mod-header">
28-
<h3 class="hed">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
28+
<h3 class="heading">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
2929
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
3030
</div>
3131

@@ -56,7 +56,7 @@ <h2 class="page-hed">New Items</h2>
5656

5757
<div class="mod">
5858
<div class="mod-header">
59-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
59+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
6060
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
6161
</div>
6262
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">
@@ -79,7 +79,7 @@ <h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
7979

8080
<div class="mod">
8181
<div class="mod-header">
82-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
82+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
8383
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
8484
</div>
8585
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -102,7 +102,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
102102

103103
<div class="mod">
104104
<div class="mod-header">
105-
<h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
105+
<h2 class="heading">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
106106
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
107107
</div>
108108
<img src="../img/tapanddie.jpg" alt="A Whitworth tap and die set">
@@ -127,7 +127,7 @@ <h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
127127

128128
<div class="mod">
129129
<div class="mod-header">
130-
<h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
130+
<h2 class="heading">ALA Toolworks <strong>Thread Gauges</strong></h2>
131131
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
132132
</div>
133133
<img src="../img/threads.jpg" alt="A set of Whitworth thread gauges">
@@ -149,7 +149,7 @@ <h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
149149

150150
<div class="mod">
151151
<div class="mod-header">
152-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
152+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
153153
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
154154
</div>
155155
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -172,7 +172,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
172172

173173
<div class="mod">
174174
<div class="mod-header">
175-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
175+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
176176
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
177177
</div>
178178
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">

demo4/styles.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -172,7 +172,7 @@ body {
172172
display: block;
173173
}
174174

175-
.hed {
175+
.heading {
176176
color: #aaa;
177177
font-family: 'Pathway Gothic One', sans-serif;
178178
font-size: 1.8em;
@@ -181,7 +181,7 @@ body {
181181
padding: .5em 0 0 0;
182182
text-transform: uppercase;
183183
}
184-
.hed strong {
184+
.heading strong {
185185
display: inline-block;
186186
color: rgba(255,255,255,.85);
187187
}

demo5/index.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ <h2 class="page-hed">Featured Item</h2>
2525

2626
<div class="mod">
2727
<div class="mod-header">
28-
<h3 class="hed">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
28+
<h3 class="heading">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
2929
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
3030
</div>
3131

@@ -56,7 +56,7 @@ <h2 class="page-hed">New Items</h2>
5656

5757
<div class="mod">
5858
<div class="mod-header">
59-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
59+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
6060
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
6161
</div>
6262
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">
@@ -79,7 +79,7 @@ <h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
7979

8080
<div class="mod">
8181
<div class="mod-header">
82-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
82+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
8383
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
8484
</div>
8585
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -102,7 +102,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
102102

103103
<div class="mod">
104104
<div class="mod-header">
105-
<h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
105+
<h2 class="heading">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
106106
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
107107
</div>
108108
<img src="../img/tapanddie.jpg" alt="A Whitworth tap and die set">
@@ -127,7 +127,7 @@ <h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
127127

128128
<div class="mod">
129129
<div class="mod-header">
130-
<h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
130+
<h2 class="heading">ALA Toolworks <strong>Thread Gauges</strong></h2>
131131
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
132132
</div>
133133
<img src="../img/threads.jpg" alt="A set of Whitworth thread gauges">
@@ -149,7 +149,7 @@ <h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
149149

150150
<div class="mod">
151151
<div class="mod-header">
152-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
152+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
153153
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
154154
</div>
155155
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -172,7 +172,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
172172

173173
<div class="mod">
174174
<div class="mod-header">
175-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
175+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
176176
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
177177
</div>
178178
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">

demo5/styles.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,7 @@ body {
210210
display: block;
211211
}
212212

213-
.hed {
213+
.heading {
214214
color: #aaa;
215215
font-family: 'Pathway Gothic One', sans-serif;
216216
font-size: 1.8em;
@@ -219,7 +219,7 @@ body {
219219
padding: .5em 0 0 0;
220220
text-transform: uppercase;
221221
}
222-
.hed strong {
222+
.heading strong {
223223
display: inline-block;
224224
color: rgba(255,255,255,.85);
225225
}

demo6/index.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ <h2 class="page-hed">Featured Item</h2>
2525

2626
<div class="mod">
2727
<div class="mod-header">
28-
<h3 class="hed">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
28+
<h3 class="heading">Bocoup Mfg. Corp. <strong>Hammer</strong></h3>
2929
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
3030
</div>
3131

@@ -56,7 +56,7 @@ <h2 class="page-hed">New Items</h2>
5656

5757
<div class="mod">
5858
<div class="mod-header">
59-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
59+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
6060
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
6161
</div>
6262
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">
@@ -79,7 +79,7 @@ <h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
7979

8080
<div class="mod">
8181
<div class="mod-header">
82-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
82+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
8383
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
8484
</div>
8585
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -102,7 +102,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
102102

103103
<div class="mod">
104104
<div class="mod-header">
105-
<h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
105+
<h2 class="heading">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
106106
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
107107
</div>
108108
<img src="../img/tapanddie.jpg" alt="A Whitworth tap and die set">
@@ -127,7 +127,7 @@ <h2 class="hed">ALA Toolworks <strong>Tap &amp; Die Set</strong></h2>
127127

128128
<div class="mod">
129129
<div class="mod-header">
130-
<h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
130+
<h2 class="heading">ALA Toolworks <strong>Thread Gauges</strong></h2>
131131
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
132132
</div>
133133
<img src="../img/threads.jpg" alt="A set of Whitworth thread gauges">
@@ -149,7 +149,7 @@ <h2 class="hed">ALA Toolworks <strong>Thread Gauges</strong></h2>
149149

150150
<div class="mod">
151151
<div class="mod-header">
152-
<h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
152+
<h2 class="heading">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
153153
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
154154
</div>
155155
<img src="../img/sockets.jpg" alt="a set of Whitworth sockets">
@@ -172,7 +172,7 @@ <h2 class="hed">Bocoup Mfg. Corp. <strong>Socket Set</strong></h2>
172172

173173
<div class="mod">
174174
<div class="mod-header">
175-
<h2 class="hed">ALA Toolworks <strong>Wrench Set</strong></h2>
175+
<h2 class="heading">ALA Toolworks <strong>Wrench Set</strong></h2>
176176
<p class="meta">Triumph/Norton/<abbr title="Birmingham Small Arms Company">BSA</abbr></p>
177177
</div>
178178
<img src="../img/wrenches.jpg" alt="A set of Whitworth wrenches">

0 commit comments

Comments
 (0)