minimal-mistakes-jekyll 4.6.0 → 4.7.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (144) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +26 -0
  3. data/LICENSE.txt +59 -21
  4. data/README.md +217 -160
  5. data/_data/navigation.yml +11 -11
  6. data/_data/ui-text.yml +931 -888
  7. data/_includes/analytics-providers/custom.html +2 -2
  8. data/_includes/analytics-providers/google-universal.html +9 -9
  9. data/_includes/analytics-providers/google.html +10 -10
  10. data/_includes/analytics.html +11 -11
  11. data/_includes/archive-single.html +37 -37
  12. data/_includes/author-profile-custom-links.html +6 -6
  13. data/_includes/author-profile.html +249 -249
  14. data/_includes/base_path +4 -4
  15. data/_includes/breadcrumbs.html +39 -39
  16. data/_includes/browser-upgrade.html +2 -2
  17. data/_includes/category-list.html +25 -25
  18. data/_includes/comment.html +22 -22
  19. data/_includes/comments-providers/custom.html +2 -2
  20. data/_includes/comments-providers/discourse.html +13 -13
  21. data/_includes/comments-providers/facebook.html +7 -7
  22. data/_includes/comments-providers/google-plus.html +1 -1
  23. data/_includes/comments-providers/scripts.html +17 -15
  24. data/_includes/comments-providers/staticman.html +41 -41
  25. data/_includes/comments-providers/staticman_v2.html +42 -0
  26. data/_includes/comments.html +168 -96
  27. data/_includes/feature_row +49 -49
  28. data/_includes/figure +12 -12
  29. data/_includes/footer.html +25 -25
  30. data/_includes/footer/custom.html +2 -2
  31. data/_includes/gallery +46 -46
  32. data/_includes/group-by-array +46 -46
  33. data/_includes/head.html +42 -42
  34. data/_includes/head/custom.html +4 -4
  35. data/_includes/masthead.html +23 -20
  36. data/_includes/nav_list +46 -46
  37. data/_includes/page__hero_video.html +4 -4
  38. data/_includes/page__taxonomy.html +6 -6
  39. data/_includes/paginator.html +69 -69
  40. data/_includes/post_pagination.html +13 -13
  41. data/_includes/read-time.html +14 -14
  42. data/_includes/scripts.html +15 -15
  43. data/_includes/seo.html +162 -147
  44. data/_includes/sidebar.html +22 -22
  45. data/_includes/social-share.html +13 -13
  46. data/_includes/tag-list.html +25 -25
  47. data/_includes/toc +6 -6
  48. data/_includes/toc.html +75 -0
  49. data/_includes/video +11 -11
  50. data/_layouts/archive-taxonomy.html +14 -14
  51. data/_layouts/archive.html +25 -25
  52. data/_layouts/compress.html +10 -10
  53. data/_layouts/default.html +1 -1
  54. data/_layouts/home.html +11 -11
  55. data/_layouts/single.html +92 -84
  56. data/_layouts/splash.html +21 -21
  57. data/_sass/minimal-mistakes.scss +1 -1
  58. data/_sass/minimal-mistakes/_animations.scss +20 -20
  59. data/_sass/minimal-mistakes/_archive.scss +317 -317
  60. data/_sass/minimal-mistakes/_base.scss +315 -315
  61. data/_sass/minimal-mistakes/_buttons.scss +97 -97
  62. data/_sass/minimal-mistakes/_footer.scss +82 -82
  63. data/_sass/minimal-mistakes/_forms.scss +399 -389
  64. data/_sass/minimal-mistakes/_masthead.scss +82 -82
  65. data/_sass/minimal-mistakes/_mixins.scss +91 -91
  66. data/_sass/minimal-mistakes/_navigation.scss +552 -552
  67. data/_sass/minimal-mistakes/_notices.scss +99 -99
  68. data/_sass/minimal-mistakes/_page.scss +430 -430
  69. data/_sass/minimal-mistakes/_reset.scss +186 -186
  70. data/_sass/minimal-mistakes/_sidebar.scss +262 -262
  71. data/_sass/minimal-mistakes/_syntax.scss +286 -146
  72. data/_sass/minimal-mistakes/_tables.scss +36 -36
  73. data/_sass/minimal-mistakes/_utilities.scss +519 -519
  74. data/_sass/minimal-mistakes/_variables.scss +137 -137
  75. data/_sass/minimal-mistakes/skins/_air.scss +22 -22
  76. data/_sass/minimal-mistakes/skins/_aqua.scss +30 -0
  77. data/_sass/minimal-mistakes/skins/_contrast.scss +33 -33
  78. data/_sass/minimal-mistakes/skins/_dark.scss +23 -23
  79. data/_sass/minimal-mistakes/skins/_default.scss +5 -5
  80. data/_sass/minimal-mistakes/skins/_dirt.scss +14 -14
  81. data/_sass/minimal-mistakes/skins/_mint.scss +22 -22
  82. data/_sass/minimal-mistakes/skins/_neon.scss +35 -0
  83. data/_sass/minimal-mistakes/skins/_plum.scss +42 -0
  84. data/_sass/minimal-mistakes/skins/_sunrise.scss +25 -25
  85. data/_sass/minimal-mistakes/vendor/breakpoint/_breakpoint.scss +114 -114
  86. data/_sass/minimal-mistakes/vendor/breakpoint/_context.scss +94 -94
  87. data/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss +151 -151
  88. data/_sass/minimal-mistakes/vendor/breakpoint/_legacy-settings.scss +49 -49
  89. data/_sass/minimal-mistakes/vendor/breakpoint/_no-query.scss +15 -15
  90. data/_sass/minimal-mistakes/vendor/breakpoint/_parsers.scss +215 -215
  91. data/_sass/minimal-mistakes/vendor/breakpoint/_respond-to.scss +82 -82
  92. data/_sass/minimal-mistakes/vendor/breakpoint/_settings.scss +70 -70
  93. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_double.scss +33 -33
  94. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_query.scss +82 -82
  95. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_resolution.scss +31 -31
  96. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_single.scss +26 -26
  97. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_triple.scss +36 -36
  98. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_default-pair.scss +21 -21
  99. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_default.scss +22 -22
  100. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_double-string.scss +21 -21
  101. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/resolution/_resolution.scss +60 -60
  102. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/single/_default.scss +13 -13
  103. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/triple/_default.scss +18 -18
  104. data/_sass/minimal-mistakes/vendor/font-awesome/_animated.scss +34 -34
  105. data/_sass/minimal-mistakes/vendor/font-awesome/_bordered-pulled.scss +25 -25
  106. data/_sass/minimal-mistakes/vendor/font-awesome/_core.scss +12 -12
  107. data/_sass/minimal-mistakes/vendor/font-awesome/_fixed-width.scss +6 -6
  108. data/_sass/minimal-mistakes/vendor/font-awesome/_font-awesome.scss +18 -18
  109. data/_sass/minimal-mistakes/vendor/font-awesome/_icons.scss +789 -789
  110. data/_sass/minimal-mistakes/vendor/font-awesome/_larger.scss +13 -13
  111. data/_sass/minimal-mistakes/vendor/font-awesome/_list.scss +19 -19
  112. data/_sass/minimal-mistakes/vendor/font-awesome/_mixins.scss +60 -60
  113. data/_sass/minimal-mistakes/vendor/font-awesome/_path.scss +15 -15
  114. data/_sass/minimal-mistakes/vendor/font-awesome/_rotated-flipped.scss +20 -20
  115. data/_sass/minimal-mistakes/vendor/font-awesome/_screen-reader.scss +5 -5
  116. data/_sass/minimal-mistakes/vendor/font-awesome/_stacked.scss +20 -20
  117. data/_sass/minimal-mistakes/vendor/font-awesome/_variables.scss +800 -800
  118. data/_sass/minimal-mistakes/vendor/magnific-popup/_magnific-popup.scss +649 -649
  119. data/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss +45 -45
  120. data/_sass/minimal-mistakes/vendor/susy/_susy-prefix.scss +13 -13
  121. data/_sass/minimal-mistakes/vendor/susy/_susy.scss +5 -5
  122. data/_sass/minimal-mistakes/vendor/susy/plugins/_svg-grid.scss +5 -5
  123. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_prefix.scss +7 -7
  124. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-api.scss +114 -114
  125. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-grid-math.scss +67 -67
  126. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-settings.scss +14 -14
  127. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-unprefix.scss +18 -18
  128. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-utilities.scss +133 -133
  129. data/_sass/minimal-mistakes/vendor/susy/susy/_api.scss +318 -318
  130. data/_sass/minimal-mistakes/vendor/susy/susy/_normalize.scss +261 -261
  131. data/_sass/minimal-mistakes/vendor/susy/susy/_parse.scss +163 -163
  132. data/_sass/minimal-mistakes/vendor/susy/susy/_settings.scss +329 -329
  133. data/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss +441 -441
  134. data/_sass/minimal-mistakes/vendor/susy/susy/_su-validate.scss +213 -213
  135. data/_sass/minimal-mistakes/vendor/susy/susy/_syntax-helpers.scss +191 -191
  136. data/_sass/minimal-mistakes/vendor/susy/susy/_unprefix.scss +56 -56
  137. data/_sass/minimal-mistakes/vendor/susy/susy/_utilities.scss +167 -167
  138. data/assets/css/main.scss +7 -7
  139. data/assets/fonts/fontawesome-webfont.svg +2671 -2671
  140. data/assets/js/_main.js +72 -72
  141. data/assets/js/main.min.js +1 -1
  142. data/assets/js/plugins/jquery.fitvids.js +81 -81
  143. data/assets/js/plugins/jquery.greedy-navigation.js +77 -77
  144. metadata +8 -3
@@ -1,100 +1,100 @@
1
- /* ==========================================================================
2
- NOTICE TEXT BLOCKS
3
- ========================================================================== */
4
-
5
- /**
6
- * Default Kramdown usage (no indents!):
7
- * <div class="notice" markdown="1">
8
- * #### Headline for the Notice
9
- * Text for the notice
10
- * </div>
11
- */
12
-
13
- @mixin notice($notice-color) {
14
- margin: 2em 0 !important; /* override*/
15
- padding: 1em;
16
- color: $dark-gray;
17
- font-family: $global-font-family;
18
- font-size: $type-size-6 !important;
19
- text-indent: initial; /* override*/
20
- background-color: mix(#fff, $notice-color, 90%);
21
- border-radius: $border-radius;
22
- box-shadow: 0 1px 1px rgba($notice-color, 0.25);
23
-
24
- h4 {
25
- margin-top: 0 !important; /* override*/
26
- margin-bottom: 0.75em;
27
- }
28
-
29
- @at-root .page__content #{&} h4 {
30
- /* using at-root to override .page-content h4 font size*/
31
- margin-bottom: 0;
32
- font-size: 1em;
33
- }
34
-
35
- p {
36
- &:last-child {
37
- margin-bottom: 0 !important; /* override*/
38
- }
39
- }
40
-
41
- h4 + p {
42
- /* remove space above paragraphs that appear directly after notice headline*/
43
- margin-top: 0;
44
- padding-top: 0;
45
- }
46
-
47
- a {
48
- color: $notice-color;
49
-
50
- &:hover {
51
- color: mix(#000, $notice-color, 40%);
52
- }
53
- }
54
-
55
- code {
56
- background-color: mix(#fff, $notice-color, 95%)
57
- }
58
-
59
- ul {
60
- &:last-child {
61
- margin-bottom: 0; /* override*/
62
- }
63
- }
64
- }
65
-
66
- /* Default notice */
67
-
68
- .notice {
69
- @include notice($light-gray);
70
- }
71
-
72
- /* Primary notice */
73
-
74
- .notice--primary {
75
- @include notice($primary-color);
76
- }
77
-
78
- /* Info notice */
79
-
80
- .notice--info {
81
- @include notice($info-color);
82
- }
83
-
84
- /* Warning notice */
85
-
86
- .notice--warning {
87
- @include notice($warning-color);
88
- }
89
-
90
- /* Success notice */
91
-
92
- .notice--success {
93
- @include notice($success-color);
94
- }
95
-
96
- /* Danger notice */
97
-
98
- .notice--danger {
99
- @include notice($danger-color);
1
+ /* ==========================================================================
2
+ NOTICE TEXT BLOCKS
3
+ ========================================================================== */
4
+
5
+ /**
6
+ * Default Kramdown usage (no indents!):
7
+ * <div class="notice" markdown="1">
8
+ * #### Headline for the Notice
9
+ * Text for the notice
10
+ * </div>
11
+ */
12
+
13
+ @mixin notice($notice-color) {
14
+ margin: 2em 0 !important; /* override*/
15
+ padding: 1em;
16
+ color: $dark-gray;
17
+ font-family: $global-font-family;
18
+ font-size: $type-size-6 !important;
19
+ text-indent: initial; /* override*/
20
+ background-color: mix(#fff, $notice-color, 90%);
21
+ border-radius: $border-radius;
22
+ box-shadow: 0 1px 1px rgba($notice-color, 0.25);
23
+
24
+ h4 {
25
+ margin-top: 0 !important; /* override*/
26
+ margin-bottom: 0.75em;
27
+ }
28
+
29
+ @at-root .page__content #{&} h4 {
30
+ /* using at-root to override .page-content h4 font size*/
31
+ margin-bottom: 0;
32
+ font-size: 1em;
33
+ }
34
+
35
+ p {
36
+ &:last-child {
37
+ margin-bottom: 0 !important; /* override*/
38
+ }
39
+ }
40
+
41
+ h4 + p {
42
+ /* remove space above paragraphs that appear directly after notice headline*/
43
+ margin-top: 0;
44
+ padding-top: 0;
45
+ }
46
+
47
+ a {
48
+ color: $notice-color;
49
+
50
+ &:hover {
51
+ color: mix(#000, $notice-color, 40%);
52
+ }
53
+ }
54
+
55
+ code {
56
+ background-color: mix(#fff, $notice-color, 95%)
57
+ }
58
+
59
+ ul {
60
+ &:last-child {
61
+ margin-bottom: 0; /* override*/
62
+ }
63
+ }
64
+ }
65
+
66
+ /* Default notice */
67
+
68
+ .notice {
69
+ @include notice($light-gray);
70
+ }
71
+
72
+ /* Primary notice */
73
+
74
+ .notice--primary {
75
+ @include notice($primary-color);
76
+ }
77
+
78
+ /* Info notice */
79
+
80
+ .notice--info {
81
+ @include notice($info-color);
82
+ }
83
+
84
+ /* Warning notice */
85
+
86
+ .notice--warning {
87
+ @include notice($warning-color);
88
+ }
89
+
90
+ /* Success notice */
91
+
92
+ .notice--success {
93
+ @include notice($success-color);
94
+ }
95
+
96
+ /* Danger notice */
97
+
98
+ .notice--danger {
99
+ @include notice($danger-color);
100
100
  }
@@ -1,431 +1,431 @@
1
- /* ==========================================================================
2
- SINGLE PAGE/POST
3
- ========================================================================== */
4
-
5
- #main {
6
- @include clearfix;
7
- margin-left: auto;
8
- margin-top: 2em;
9
- margin-right: auto;
10
- padding-left: 1em;
11
- padding-right: 1em;
12
- -webkit-animation: $intro-transition;
13
- animation: $intro-transition;
14
- max-width: 100%;
15
- -webkit-animation-delay: 0.35s;
16
- animation-delay: 0.35s;
17
-
18
- @include breakpoint($x-large) {
19
- max-width: $x-large;
20
- }
21
- }
22
-
23
- .page {
24
-
25
- @include breakpoint($large) {
26
- float: right;
27
- width: calc(100% - #{$right-sidebar-width-narrow});
28
- padding-right: $right-sidebar-width-narrow;
29
- }
30
-
31
- @include breakpoint($x-large) {
32
- width: calc(100% - #{$right-sidebar-width});
33
- padding-right: $right-sidebar-width;
34
- }
35
-
36
- .page__inner-wrap {
37
- float: left;
38
- margin-left: 0;
39
- margin-right: 0;
40
- width: 100%;
41
- clear: both;
42
-
43
- .page__content,
44
- .page__meta,
45
- .page__share {
46
- position: relative;
47
- float: left;
48
- margin-left: 0;
49
- margin-right: 0;
50
- width: 100%;
51
- clear: both;
52
- }
53
- }
54
- }
55
-
56
- .page__title {
57
- margin-top: 0;
58
- line-height: 1;
59
-
60
- & + .page__meta {
61
- margin-top: -0.5em;
62
- }
63
- }
64
-
65
- .page__lead {
66
- font-family: $global-font-family;
67
- font-size: $type-size-4;
68
- }
69
-
70
- .page__content {
71
-
72
- h2 {
73
- padding-bottom: 0.5em;
74
- border-bottom: 1px solid $border-color;
75
- }
76
-
77
- p, li, dl {
78
- font-size: 1em;
79
- }
80
-
81
- /* paragraph indents */
82
- p {
83
- margin: 0 0 $indent-var;
84
-
85
- /* sibling indentation*/
86
- @if $paragraph-indent == true {
87
- & + p {
88
- text-indent: $indent-var;
89
- margin-top: -($indent-var);
90
- }
91
- }
92
- }
93
-
94
- a:not(.btn) {
95
-
96
- &:hover {
97
- text-decoration: underline;
98
-
99
- img {
100
- box-shadow: 0 0 10px rgba(#000, 0.25);
101
- }
102
- }
103
- }
104
-
105
- dt {
106
- margin-top: 1em;
107
- font-family: $sans-serif;
108
- font-weight: bold;
109
- }
110
-
111
- dd {
112
- margin-left: 1em;
113
- font-family: $sans-serif;
114
- font-size: $type-size-6;
115
- }
116
-
117
- .small {
118
- font-size: $type-size-6;
119
- }
120
-
121
- /* blockquote citations */
122
- blockquote + .small {
123
- margin-top: -1.5em;
124
- padding-left: 1.25rem;
125
- }
126
- }
127
-
128
- .page__hero {
129
- position: relative;
130
- margin-bottom: 2em;
131
- @include clearfix;
132
- -webkit-animation: $intro-transition;
133
- animation: $intro-transition;
134
- -webkit-animation-delay: 0.25s;
135
- animation-delay: 0.25s;
136
-
137
- &--overlay {
138
- position: relative;
139
- margin-bottom: 2em;
140
- padding: 3em 0;
141
- @include clearfix;
142
- background-size: cover;
143
- background-repeat: no-repeat;
144
- background-position: center;
145
- -webkit-animation: $intro-transition;
146
- animation: $intro-transition;
147
- -webkit-animation-delay: 0.25s;
148
- animation-delay: 0.25s;
149
-
150
- a {
151
- color: #fff;
152
- }
153
-
154
- .wrapper {
155
- padding-left: 1em;
156
- padding-right: 1em;
157
-
158
- @include breakpoint($x-large) {
159
- max-width: $x-large;
160
- }
161
- }
162
-
163
- .page__title,
164
- .page__meta,
165
- .page__lead,
166
- .btn {
167
- color: #fff;
168
- text-shadow: 1px 1px 4px rgba(#000, 0.5);
169
- }
170
-
171
- .page__lead {
172
- max-width: $medium;
173
- }
174
-
175
- .page__title {
176
- font-size: $type-size-2;
177
-
178
- @include breakpoint($small) {
179
- font-size: $type-size-1;
180
- }
181
- }
182
- }
183
- }
184
-
185
- .page__hero-image {
186
- width: 100%;
187
- height: auto;
188
- -ms-interpolation-mode: bicubic;
189
- }
190
-
191
- .page__hero-caption {
192
- position: absolute;
193
- bottom: 0;
194
- right: 0;
195
- margin: 0 auto;
196
- padding: 2px 5px;
197
- color: #fff;
198
- font-family: $caption-font-family;
199
- font-size: $type-size-7;
200
- background: #000;
201
- text-align: right;
202
- z-index: 5;
203
- opacity: 0.5;
204
- border-radius: $border-radius 0 0 0;
205
-
206
- @include breakpoint($large) {
207
- padding: 5px 10px;
208
- }
209
-
210
- a {
211
- color: #fff;
212
- text-decoration: none;
213
- }
214
- }
215
-
216
- /*
217
- Social sharing
218
- ========================================================================== */
219
-
220
- .page__share {
221
- margin-top: 2em;
222
- padding-top: 1em;
223
- border-top: 1px solid $border-color;
224
-
225
- @include breakpoint(max-width $small) {
226
- .btn span {
227
- border: 0;
228
- clip: rect(0 0 0 0);
229
- height: 1px;
230
- margin: -1px;
231
- overflow: hidden;
232
- padding: 0;
233
- position: absolute;
234
- width: 1px;
235
- }
236
- }
237
- }
238
-
239
- .page__share-title {
240
- margin-bottom: 10px;
241
- font-size: $type-size-6;
242
- text-transform: uppercase;
243
- }
244
-
245
-
246
- /*
247
- Page meta
248
- ========================================================================== */
249
-
250
- .page__meta {
251
- margin-top: 2em;
252
- color: $muted-text-color;
253
- font-family: $sans-serif;
254
- font-size: $type-size-6;
255
-
256
- p {
257
- margin: 0;
258
- }
259
-
260
- a {
261
- color: inherit;
262
- }
263
- }
264
-
265
- .page__meta-title {
266
- margin-bottom: 10px;
267
- font-size: $type-size-6;
268
- text-transform: uppercase;
269
- }
270
-
271
-
272
- /*
273
- Page taxonomy
274
- ========================================================================== */
275
-
276
- .page__taxonomy {
277
- .sep {
278
- display: none;
279
- }
280
-
281
- strong {
282
- margin-right: 10px;
283
- }
284
- }
285
-
286
- .page__taxonomy-item {
287
- display: inline-block;
288
- margin-right: 5px;
289
- margin-bottom: 8px;
290
- padding: 5px 10px;
291
- text-decoration: none;
292
- border: 1px solid mix(#000, $border-color, 25%);
293
- border-radius: $border-radius;
294
-
295
- &:hover {
296
- text-decoration: none;
297
- color: $link-color-hover;
298
- }
299
- }
300
-
301
-
302
- /*
303
- Comments
304
- ========================================================================== */
305
-
306
- .page__comments {
307
- float: left;
308
- margin-left: 0;
309
- margin-right: 0;
310
- width: 100%;
311
- clear: both;
312
- }
313
-
314
- .page__comments-title {
315
- margin-top: 2rem;
316
- margin-bottom: 10px;
317
- padding-top: 2rem;
318
- font-size: $type-size-6;
319
- border-top: 1px solid $border-color;
320
- text-transform: uppercase;
321
- }
322
-
323
- .page__comments-form {
324
- -webkit-transition: $global-transition;
325
- transition: $global-transition;
326
-
327
- &.disabled {
328
- input,
329
- button,
330
- textarea,
331
- label {
332
- pointer-events: none;
333
- cursor: not-allowed;
334
- filter: alpha(opacity=65);
335
- box-shadow: none;
336
- opacity: 0.65;
337
- }
338
- }
339
- }
340
-
341
- .comment {
342
- @include clearfix();
343
- margin: 1em 0;
344
-
345
- &:not(:last-child) {
346
- border-bottom: 1px solid $border-color;
347
- }
348
- }
349
-
350
- .comment__avatar-wrapper {
351
- float: left;
352
- width: 60px;
353
- height: 60px;
354
-
355
- @include breakpoint($large) {
356
- width: 100px;
357
- height: 100px;
358
- }
359
- }
360
-
361
- .comment__avatar {
362
- width: 40px;
363
- height: 40px;
364
- border-radius: 50%;
365
-
366
- @include breakpoint($large) {
367
- width: 80px;
368
- height: 80px;
369
- padding: 5px;
370
- border: 1px solid $border-color;
371
- }
372
- }
373
-
374
- .comment__content-wrapper {
375
- float: right;
376
- width: calc(100% - 60px);
377
-
378
- @include breakpoint($large) {
379
- width: calc(100% - 100px);
380
- }
381
- }
382
-
383
- .comment__author {
384
- margin: 0;
385
-
386
- a {
387
- text-decoration: none;
388
- }
389
- }
390
-
391
- .comment__date {
392
- @extend .page__meta;
393
- margin: 0;
394
-
395
- a {
396
- text-decoration: none;
397
- }
398
- }
399
-
400
-
401
- /*
402
- Related
403
- ========================================================================== */
404
-
405
- .page__related {
406
- @include clearfix();
407
- float: left;
408
- margin-top: 2em;
409
- padding-top: 1em;
410
- border-top: 1px solid $border-color;
411
-
412
- @include breakpoint($large) {
413
- float: right;
414
- width: calc(100% - #{$right-sidebar-width-narrow});
415
- }
416
-
417
- @include breakpoint($x-large) {
418
- width: calc(100% - #{$right-sidebar-width});
419
- }
420
-
421
- a {
422
- color: inherit;
423
- text-decoration: none;
424
- }
425
- }
426
-
427
- .page__related-title {
428
- margin-bottom: 10px;
429
- font-size: $type-size-6;
430
- text-transform: uppercase;
1
+ /* ==========================================================================
2
+ SINGLE PAGE/POST
3
+ ========================================================================== */
4
+
5
+ #main {
6
+ @include clearfix;
7
+ margin-left: auto;
8
+ margin-top: 2em;
9
+ margin-right: auto;
10
+ padding-left: 1em;
11
+ padding-right: 1em;
12
+ -webkit-animation: $intro-transition;
13
+ animation: $intro-transition;
14
+ max-width: 100%;
15
+ -webkit-animation-delay: 0.35s;
16
+ animation-delay: 0.35s;
17
+
18
+ @include breakpoint($x-large) {
19
+ max-width: $x-large;
20
+ }
21
+ }
22
+
23
+ .page {
24
+
25
+ @include breakpoint($large) {
26
+ float: right;
27
+ width: calc(100% - #{$right-sidebar-width-narrow});
28
+ padding-right: $right-sidebar-width-narrow;
29
+ }
30
+
31
+ @include breakpoint($x-large) {
32
+ width: calc(100% - #{$right-sidebar-width});
33
+ padding-right: $right-sidebar-width;
34
+ }
35
+
36
+ .page__inner-wrap {
37
+ float: left;
38
+ margin-left: 0;
39
+ margin-right: 0;
40
+ width: 100%;
41
+ clear: both;
42
+
43
+ .page__content,
44
+ .page__meta,
45
+ .page__share {
46
+ position: relative;
47
+ float: left;
48
+ margin-left: 0;
49
+ margin-right: 0;
50
+ width: 100%;
51
+ clear: both;
52
+ }
53
+ }
54
+ }
55
+
56
+ .page__title {
57
+ margin-top: 0;
58
+ line-height: 1;
59
+
60
+ & + .page__meta {
61
+ margin-top: -0.5em;
62
+ }
63
+ }
64
+
65
+ .page__lead {
66
+ font-family: $global-font-family;
67
+ font-size: $type-size-4;
68
+ }
69
+
70
+ .page__content {
71
+
72
+ h2 {
73
+ padding-bottom: 0.5em;
74
+ border-bottom: 1px solid $border-color;
75
+ }
76
+
77
+ p, li, dl {
78
+ font-size: 1em;
79
+ }
80
+
81
+ /* paragraph indents */
82
+ p {
83
+ margin: 0 0 $indent-var;
84
+
85
+ /* sibling indentation*/
86
+ @if $paragraph-indent == true {
87
+ & + p {
88
+ text-indent: $indent-var;
89
+ margin-top: -($indent-var);
90
+ }
91
+ }
92
+ }
93
+
94
+ a:not(.btn) {
95
+
96
+ &:hover {
97
+ text-decoration: underline;
98
+
99
+ img {
100
+ box-shadow: 0 0 10px rgba(#000, 0.25);
101
+ }
102
+ }
103
+ }
104
+
105
+ dt {
106
+ margin-top: 1em;
107
+ font-family: $sans-serif;
108
+ font-weight: bold;
109
+ }
110
+
111
+ dd {
112
+ margin-left: 1em;
113
+ font-family: $sans-serif;
114
+ font-size: $type-size-6;
115
+ }
116
+
117
+ .small {
118
+ font-size: $type-size-6;
119
+ }
120
+
121
+ /* blockquote citations */
122
+ blockquote + .small {
123
+ margin-top: -1.5em;
124
+ padding-left: 1.25rem;
125
+ }
126
+ }
127
+
128
+ .page__hero {
129
+ position: relative;
130
+ margin-bottom: 2em;
131
+ @include clearfix;
132
+ -webkit-animation: $intro-transition;
133
+ animation: $intro-transition;
134
+ -webkit-animation-delay: 0.25s;
135
+ animation-delay: 0.25s;
136
+
137
+ &--overlay {
138
+ position: relative;
139
+ margin-bottom: 2em;
140
+ padding: 3em 0;
141
+ @include clearfix;
142
+ background-size: cover;
143
+ background-repeat: no-repeat;
144
+ background-position: center;
145
+ -webkit-animation: $intro-transition;
146
+ animation: $intro-transition;
147
+ -webkit-animation-delay: 0.25s;
148
+ animation-delay: 0.25s;
149
+
150
+ a {
151
+ color: #fff;
152
+ }
153
+
154
+ .wrapper {
155
+ padding-left: 1em;
156
+ padding-right: 1em;
157
+
158
+ @include breakpoint($x-large) {
159
+ max-width: $x-large;
160
+ }
161
+ }
162
+
163
+ .page__title,
164
+ .page__meta,
165
+ .page__lead,
166
+ .btn {
167
+ color: #fff;
168
+ text-shadow: 1px 1px 4px rgba(#000, 0.5);
169
+ }
170
+
171
+ .page__lead {
172
+ max-width: $medium;
173
+ }
174
+
175
+ .page__title {
176
+ font-size: $type-size-2;
177
+
178
+ @include breakpoint($small) {
179
+ font-size: $type-size-1;
180
+ }
181
+ }
182
+ }
183
+ }
184
+
185
+ .page__hero-image {
186
+ width: 100%;
187
+ height: auto;
188
+ -ms-interpolation-mode: bicubic;
189
+ }
190
+
191
+ .page__hero-caption {
192
+ position: absolute;
193
+ bottom: 0;
194
+ right: 0;
195
+ margin: 0 auto;
196
+ padding: 2px 5px;
197
+ color: #fff;
198
+ font-family: $caption-font-family;
199
+ font-size: $type-size-7;
200
+ background: #000;
201
+ text-align: right;
202
+ z-index: 5;
203
+ opacity: 0.5;
204
+ border-radius: $border-radius 0 0 0;
205
+
206
+ @include breakpoint($large) {
207
+ padding: 5px 10px;
208
+ }
209
+
210
+ a {
211
+ color: #fff;
212
+ text-decoration: none;
213
+ }
214
+ }
215
+
216
+ /*
217
+ Social sharing
218
+ ========================================================================== */
219
+
220
+ .page__share {
221
+ margin-top: 2em;
222
+ padding-top: 1em;
223
+ border-top: 1px solid $border-color;
224
+
225
+ @include breakpoint(max-width $small) {
226
+ .btn span {
227
+ border: 0;
228
+ clip: rect(0 0 0 0);
229
+ height: 1px;
230
+ margin: -1px;
231
+ overflow: hidden;
232
+ padding: 0;
233
+ position: absolute;
234
+ width: 1px;
235
+ }
236
+ }
237
+ }
238
+
239
+ .page__share-title {
240
+ margin-bottom: 10px;
241
+ font-size: $type-size-6;
242
+ text-transform: uppercase;
243
+ }
244
+
245
+
246
+ /*
247
+ Page meta
248
+ ========================================================================== */
249
+
250
+ .page__meta {
251
+ margin-top: 2em;
252
+ color: $muted-text-color;
253
+ font-family: $sans-serif;
254
+ font-size: $type-size-6;
255
+
256
+ p {
257
+ margin: 0;
258
+ }
259
+
260
+ a {
261
+ color: inherit;
262
+ }
263
+ }
264
+
265
+ .page__meta-title {
266
+ margin-bottom: 10px;
267
+ font-size: $type-size-6;
268
+ text-transform: uppercase;
269
+ }
270
+
271
+
272
+ /*
273
+ Page taxonomy
274
+ ========================================================================== */
275
+
276
+ .page__taxonomy {
277
+ .sep {
278
+ display: none;
279
+ }
280
+
281
+ strong {
282
+ margin-right: 10px;
283
+ }
284
+ }
285
+
286
+ .page__taxonomy-item {
287
+ display: inline-block;
288
+ margin-right: 5px;
289
+ margin-bottom: 8px;
290
+ padding: 5px 10px;
291
+ text-decoration: none;
292
+ border: 1px solid mix(#000, $border-color, 25%);
293
+ border-radius: $border-radius;
294
+
295
+ &:hover {
296
+ text-decoration: none;
297
+ color: $link-color-hover;
298
+ }
299
+ }
300
+
301
+
302
+ /*
303
+ Comments
304
+ ========================================================================== */
305
+
306
+ .page__comments {
307
+ float: left;
308
+ margin-left: 0;
309
+ margin-right: 0;
310
+ width: 100%;
311
+ clear: both;
312
+ }
313
+
314
+ .page__comments-title {
315
+ margin-top: 2rem;
316
+ margin-bottom: 10px;
317
+ padding-top: 2rem;
318
+ font-size: $type-size-6;
319
+ border-top: 1px solid $border-color;
320
+ text-transform: uppercase;
321
+ }
322
+
323
+ .page__comments-form {
324
+ -webkit-transition: $global-transition;
325
+ transition: $global-transition;
326
+
327
+ &.disabled {
328
+ input,
329
+ button,
330
+ textarea,
331
+ label {
332
+ pointer-events: none;
333
+ cursor: not-allowed;
334
+ filter: alpha(opacity=65);
335
+ box-shadow: none;
336
+ opacity: 0.65;
337
+ }
338
+ }
339
+ }
340
+
341
+ .comment {
342
+ @include clearfix();
343
+ margin: 1em 0;
344
+
345
+ &:not(:last-child) {
346
+ border-bottom: 1px solid $border-color;
347
+ }
348
+ }
349
+
350
+ .comment__avatar-wrapper {
351
+ float: left;
352
+ width: 60px;
353
+ height: 60px;
354
+
355
+ @include breakpoint($large) {
356
+ width: 100px;
357
+ height: 100px;
358
+ }
359
+ }
360
+
361
+ .comment__avatar {
362
+ width: 40px;
363
+ height: 40px;
364
+ border-radius: 50%;
365
+
366
+ @include breakpoint($large) {
367
+ width: 80px;
368
+ height: 80px;
369
+ padding: 5px;
370
+ border: 1px solid $border-color;
371
+ }
372
+ }
373
+
374
+ .comment__content-wrapper {
375
+ float: right;
376
+ width: calc(100% - 60px);
377
+
378
+ @include breakpoint($large) {
379
+ width: calc(100% - 100px);
380
+ }
381
+ }
382
+
383
+ .comment__author {
384
+ margin: 0;
385
+
386
+ a {
387
+ text-decoration: none;
388
+ }
389
+ }
390
+
391
+ .comment__date {
392
+ @extend .page__meta;
393
+ margin: 0;
394
+
395
+ a {
396
+ text-decoration: none;
397
+ }
398
+ }
399
+
400
+
401
+ /*
402
+ Related
403
+ ========================================================================== */
404
+
405
+ .page__related {
406
+ @include clearfix();
407
+ float: left;
408
+ margin-top: 2em;
409
+ padding-top: 1em;
410
+ border-top: 1px solid $border-color;
411
+
412
+ @include breakpoint($large) {
413
+ float: right;
414
+ width: calc(100% - #{$right-sidebar-width-narrow});
415
+ }
416
+
417
+ @include breakpoint($x-large) {
418
+ width: calc(100% - #{$right-sidebar-width});
419
+ }
420
+
421
+ a {
422
+ color: inherit;
423
+ text-decoration: none;
424
+ }
425
+ }
426
+
427
+ .page__related-title {
428
+ margin-bottom: 10px;
429
+ font-size: $type-size-6;
430
+ text-transform: uppercase;
431
431
  }