steve-for-jekyll 1.2.1 → 1.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. checksums.yaml +4 -4
  2. data/404.html +9 -9
  3. data/LICENSE.txt +21 -21
  4. data/README.md +46 -46
  5. data/_config.yml +1 -2
  6. data/_includes/blog/custom-widgets.html +3 -3
  7. data/_includes/blog/post.html +57 -57
  8. data/_includes/blog/sidebar.html +42 -42
  9. data/_includes/footer/custom-text.html +5 -5
  10. data/_includes/footer/links.html +11 -11
  11. data/_includes/footer.html +11 -11
  12. data/_includes/head.html +9 -9
  13. data/_includes/header/menu.html +12 -12
  14. data/_includes/header.html +17 -17
  15. data/_includes/post/comment-form.html +69 -69
  16. data/_includes/post/comments.html +47 -47
  17. data/_includes/search-form.html +13 -13
  18. data/_layouts/archive.html +21 -21
  19. data/_layouts/blog.html +9 -9
  20. data/_layouts/default.html +18 -18
  21. data/_layouts/home.html +23 -23
  22. data/_layouts/page.html +15 -15
  23. data/_layouts/post.html +115 -115
  24. data/_sass/steve/_base.scss +269 -269
  25. data/_sass/steve/_layout.scss +477 -472
  26. data/_sass/steve/_syntax.scss +252 -252
  27. data/_sass/steve-for-jekyll.scss +51 -51
  28. data/assets/css/screen.scss +34 -34
  29. data/assets/js/responsive-videos.js +79 -79
  30. data/staticman.yml +30 -30
  31. metadata +7 -35
data/_sass/steve/_base.scss CHANGED
@@ -1,269 +1,269 @@
1
- /*
2
- Resets
3
- */
4
-
5
- body,
6
- h1,
7
- h2,
8
- h3,
9
- h4,
10
- h5,
11
- h6,
12
- p,
13
- blockquote,
14
- pre,
15
- hr,
16
- dl,
17
- dd,
18
- ol,
19
- ul,
20
- figure {
21
- margin: 0;
22
- padding: 0;
23
- }
24
-
25
- /*
26
- Basic styling
27
- */
28
-
29
- html {
30
- font-size: 16px;
31
- }
32
-
33
- body {
34
- background-color: var(--color-body);
35
- font-family: var(--font);
36
- line-height: 1.5;
37
- }
38
-
39
- /*
40
- Accessibility helpers
41
- */
42
- .visually-hidden {
43
- position: absolute !important;
44
- height: 1px;
45
- width: 1px;
46
- overflow: hidden;
47
- clip: rect(1px 1px 1px 1px);
48
- clip: rect(1px, 1px, 1px, 1px);
49
- white-space: nowrap;
50
- }
51
-
52
- /*
53
- Text Elements
54
- */
55
-
56
- .content-body {
57
- p,
58
- pre,
59
- blockquote,
60
- dl,
61
- ul,
62
- ol,
63
- figure,
64
- iframe,
65
- table,
66
- .highlight {
67
- margin-bottom: var(--gap);
68
- }
69
- }
70
-
71
- // Links
72
- a {
73
- color: var(--color-link);
74
- text-decoration: none;
75
- transition: color 250ms ease;
76
-
77
- &:hover,
78
- &:focus {
79
- color: var(--color-link-hover);
80
- text-decoration: underline;
81
- }
82
- }
83
-
84
- // Lists
85
- ul,
86
- ol {
87
- margin-left: var(--gap);
88
-
89
- ul,
90
- ol {
91
- margin-bottom: 0;
92
- }
93
- }
94
-
95
- dl {
96
- dt + dd {
97
- margin-bottom: calc(var(--gap) / 2);
98
- }
99
-
100
- dt + dd + dt {
101
- margin-top: calc(var(--gap) / 2);
102
- }
103
- }
104
-
105
- // Headings
106
- h1,
107
- h2,
108
- h3,
109
- h4,
110
- h5,
111
- h6 {
112
- line-height: 1.2;
113
- font-family: var(--font-headings);
114
- }
115
-
116
- h1 {
117
- font-size: 2rem;
118
- }
119
-
120
- h2 {
121
- font-size: 1.5rem;
122
- }
123
-
124
- h3 {
125
- font-size: 1.25rem;
126
- }
127
-
128
- h4 {
129
- font-size: 1rem;
130
- }
131
-
132
- h5 {
133
- font-size: 0.875rem;
134
- }
135
-
136
- h6 {
137
- font-size: 0.75rem;
138
- }
139
-
140
- // Code
141
- pre {
142
- max-width: 100%;
143
- overflow-x: auto;
144
- }
145
-
146
- // Media
147
- img,
148
- iframe,
149
- video,
150
- audio {
151
- max-width: 100%;
152
- border-radius: 3px;
153
- box-shadow: 0 2px 5px var(--color-details);
154
- }
155
-
156
- // Tables
157
- table {
158
- border: 1px solid var(--color-details-lighter);
159
- border-radius: 3px;
160
- border-collapse: collapse;
161
- color: var(--color-details-darker);
162
- width: 100%;
163
-
164
- th,
165
- td {
166
- border-bottom: 1px solid var(--color-details-lighter);
167
- padding: calc(var(--gap) / 4);
168
- text-align: left;
169
- }
170
-
171
- th {
172
- background: var(--color-details-lighter);
173
- }
174
- }
175
-
176
- // Quotes
177
-
178
- blockquote {
179
- border-left: 4px solid var(--color-details-lighter);
180
- padding-left: calc(var(--gap) / 2);
181
- padding-top: calc(var(--gap) / 4);
182
- padding-bottom: calc(var(--gap) / 4);
183
- font-style: italic;
184
- color: var(--color-details-darker);
185
-
186
- > :last-child {
187
- margin-bottom: 0;
188
- }
189
- }
190
-
191
- // Horizontal rule
192
- hr {
193
- width: 250px;
194
- height: 3px;
195
- margin: calc(var(--gap) * 2) auto;
196
- background-color: var(--color-details-lighter);
197
- border: none;
198
- border-radius: 3px;
199
- }
200
-
201
- // Forms
202
- input[type="text"],
203
- input[type="email"],
204
- input[type="password"],
205
- input[type="search"],
206
- input[type="tel"],
207
- input[type="number"],
208
- input[type="color"],
209
- input[type="url"],
210
- input[type="button"],
211
- input[type="reset"],
212
- input[type="submit"],
213
- textarea,
214
- button {
215
- -webkit-appearance: none;
216
- -moz-appearance: none;
217
- border: none;
218
- border-radius: 0;
219
- box-shadow: none;
220
- background: var(--color-bg);
221
- padding: 5px;
222
- margin: 0;
223
- font: inherit;
224
- }
225
-
226
- input[type="text"],
227
- input[type="email"],
228
- input[type="password"],
229
- input[type="search"],
230
- input[type="tel"],
231
- input[type="number"],
232
- input[type="color"],
233
- input[type="url"],
234
- textarea {
235
- border-bottom: 3px dashed var(--color-details-lighter);
236
- transition: border-bottom-color 250ms ease;
237
-
238
- &:hover,
239
- &:focus {
240
- outline: none;
241
- border-bottom-color: var(--color-link);
242
- }
243
- }
244
-
245
- input[type="button"],
246
- input[type="reset"],
247
- input[type="submit"],
248
- button {
249
- box-shadow: inset 0 0 0 var(--color-details-lighter);
250
- border-bottom: 3px solid var(--color-details-lighter);
251
- color: var(--color-link);
252
- transition-property: color, box-shadow, border-bottom-color;
253
- transition-duration: 250ms;
254
- transition-timing-function: ease;
255
- padding-left: 10px;
256
- padding-right: 10px;
257
-
258
- &:hover,
259
- &:focus {
260
- cursor: pointer;
261
- box-shadow: inset 0 -2.5em 0 var(--color-link);
262
- border-bottom-color: var(--color-link-hover);
263
- color: var(--color-details-lighter);
264
- }
265
-
266
- &:active {
267
- box-shadow: inset 0 -2.5em 0 var(--color-link-hover);
268
- }
269
- }
1
+ /*
2
+ Resets
3
+ */
4
+
5
+ body,
6
+ h1,
7
+ h2,
8
+ h3,
9
+ h4,
10
+ h5,
11
+ h6,
12
+ p,
13
+ blockquote,
14
+ pre,
15
+ hr,
16
+ dl,
17
+ dd,
18
+ ol,
19
+ ul,
20
+ figure {
21
+ margin: 0;
22
+ padding: 0;
23
+ }
24
+
25
+ /*
26
+ Basic styling
27
+ */
28
+
29
+ html {
30
+ font-size: 16px;
31
+ }
32
+
33
+ body {
34
+ background-color: var(--color-body);
35
+ font-family: var(--font);
36
+ line-height: 1.5;
37
+ }
38
+
39
+ /*
40
+ Accessibility helpers
41
+ */
42
+ .visually-hidden {
43
+ position: absolute !important;
44
+ height: 1px;
45
+ width: 1px;
46
+ overflow: hidden;
47
+ clip: rect(1px 1px 1px 1px);
48
+ clip: rect(1px, 1px, 1px, 1px);
49
+ white-space: nowrap;
50
+ }
51
+
52
+ /*
53
+ Text Elements
54
+ */
55
+
56
+ .content-body {
57
+ p,
58
+ pre,
59
+ blockquote,
60
+ dl,
61
+ ul,
62
+ ol,
63
+ figure,
64
+ iframe,
65
+ table,
66
+ .highlight {
67
+ margin-bottom: var(--gap);
68
+ }
69
+ }
70
+
71
+ // Links
72
+ a {
73
+ color: var(--color-link);
74
+ text-decoration: none;
75
+ transition: color 250ms ease;
76
+
77
+ &:hover,
78
+ &:focus {
79
+ color: var(--color-link-hover);
80
+ text-decoration: underline;
81
+ }
82
+ }
83
+
84
+ // Lists
85
+ ul,
86
+ ol {
87
+ margin-left: var(--gap);
88
+
89
+ ul,
90
+ ol {
91
+ margin-bottom: 0;
92
+ }
93
+ }
94
+
95
+ dl {
96
+ dt + dd {
97
+ margin-bottom: calc(var(--gap) / 2);
98
+ }
99
+
100
+ dt + dd + dt {
101
+ margin-top: calc(var(--gap) / 2);
102
+ }
103
+ }
104
+
105
+ // Headings
106
+ h1,
107
+ h2,
108
+ h3,
109
+ h4,
110
+ h5,
111
+ h6 {
112
+ line-height: 1.2;
113
+ font-family: var(--font-headings);
114
+ }
115
+
116
+ h1 {
117
+ font-size: 2rem;
118
+ }
119
+
120
+ h2 {
121
+ font-size: 1.5rem;
122
+ }
123
+
124
+ h3 {
125
+ font-size: 1.25rem;
126
+ }
127
+
128
+ h4 {
129
+ font-size: 1rem;
130
+ }
131
+
132
+ h5 {
133
+ font-size: 0.875rem;
134
+ }
135
+
136
+ h6 {
137
+ font-size: 0.75rem;
138
+ }
139
+
140
+ // Code
141
+ pre {
142
+ max-width: 100%;
143
+ overflow-x: auto;
144
+ }
145
+
146
+ // Media
147
+ img,
148
+ iframe,
149
+ video,
150
+ audio {
151
+ max-width: 100%;
152
+ border-radius: 3px;
153
+ box-shadow: 0 2px 5px var(--color-details);
154
+ }
155
+
156
+ // Tables
157
+ table {
158
+ border: 1px solid var(--color-details-lighter);
159
+ border-radius: 3px;
160
+ border-collapse: collapse;
161
+ color: var(--color-details-darker);
162
+ width: 100%;
163
+
164
+ th,
165
+ td {
166
+ border-bottom: 1px solid var(--color-details-lighter);
167
+ padding: calc(var(--gap) / 4);
168
+ text-align: left;
169
+ }
170
+
171
+ th {
172
+ background: var(--color-details-lighter);
173
+ }
174
+ }
175
+
176
+ // Quotes
177
+
178
+ blockquote {
179
+ border-left: 4px solid var(--color-details-lighter);
180
+ padding-left: calc(var(--gap) / 2);
181
+ padding-top: calc(var(--gap) / 4);
182
+ padding-bottom: calc(var(--gap) / 4);
183
+ font-style: italic;
184
+ color: var(--color-details-darker);
185
+
186
+ > :last-child {
187
+ margin-bottom: 0;
188
+ }
189
+ }
190
+
191
+ // Horizontal rule
192
+ hr {
193
+ width: 250px;
194
+ height: 3px;
195
+ margin: calc(var(--gap) * 2) auto;
196
+ background-color: var(--color-details-lighter);
197
+ border: none;
198
+ border-radius: 3px;
199
+ }
200
+
201
+ // Forms
202
+ input[type="text"],
203
+ input[type="email"],
204
+ input[type="password"],
205
+ input[type="search"],
206
+ input[type="tel"],
207
+ input[type="number"],
208
+ input[type="color"],
209
+ input[type="url"],
210
+ input[type="button"],
211
+ input[type="reset"],
212
+ input[type="submit"],
213
+ textarea,
214
+ button {
215
+ -webkit-appearance: none;
216
+ -moz-appearance: none;
217
+ border: none;
218
+ border-radius: 0;
219
+ box-shadow: none;
220
+ background: var(--color-bg);
221
+ padding: 5px;
222
+ margin: 0;
223
+ font: inherit;
224
+ }
225
+
226
+ input[type="text"],
227
+ input[type="email"],
228
+ input[type="password"],
229
+ input[type="search"],
230
+ input[type="tel"],
231
+ input[type="number"],
232
+ input[type="color"],
233
+ input[type="url"],
234
+ textarea {
235
+ border-bottom: 3px dashed var(--color-details-lighter);
236
+ transition: border-bottom-color 250ms ease;
237
+
238
+ &:hover,
239
+ &:focus {
240
+ outline: none;
241
+ border-bottom-color: var(--color-link);
242
+ }
243
+ }
244
+
245
+ input[type="button"],
246
+ input[type="reset"],
247
+ input[type="submit"],
248
+ button {
249
+ box-shadow: inset 0 0 0 var(--color-details-lighter);
250
+ border-bottom: 3px solid var(--color-details-lighter);
251
+ color: var(--color-link);
252
+ transition-property: color, box-shadow, border-bottom-color;
253
+ transition-duration: 250ms;
254
+ transition-timing-function: ease;
255
+ padding-left: 10px;
256
+ padding-right: 10px;
257
+
258
+ &:hover,
259
+ &:focus {
260
+ cursor: pointer;
261
+ box-shadow: inset 0 -2.5em 0 var(--color-link);
262
+ border-bottom-color: var(--color-link-hover);
263
+ color: var(--color-details-lighter);
264
+ }
265
+
266
+ &:active {
267
+ box-shadow: inset 0 -2.5em 0 var(--color-link-hover);
268
+ }
269
+ }