minimal-mistakes-jekyll 4.5.0 → 4.5.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,242 +1,263 @@
1
- /* ==========================================================================
2
- SIDEBAR
3
- ========================================================================== */
4
-
5
- /*
6
- Default
7
- ========================================================================== */
8
-
9
- .sidebar {
10
- -webkit-transform: translate3d(0, 0 , 0);
11
- transform: translate3d(0, 0 , 0);
12
-
13
- @include clearfix();
14
- margin-bottom: 1em;
15
-
16
- @include breakpoint($large) {
17
- float: left;
18
- width: span(2 of 12);
19
- opacity: 0.75;
20
- -webkit-transition: opacity 0.2s ease-in-out;
21
- transition: opacity 0.2s ease-in-out;
22
-
23
- &:hover {
24
- opacity: 1;
25
- }
26
-
27
- &.sticky {
28
- overflow-y: auto;
29
- /* calculate height of nav list */
30
- height: calc(100vh - 90px - 2em); // viewport height - approx. masthead height - main content top margin
31
- }
32
- }
33
-
34
- @include breakpoint($x-large) {
35
- padding-right: 0;
36
- }
37
-
38
- h2, h3, h4, h5, h6 {
39
- margin-bottom: 0;
40
- font-family: $sans-serif-narrow;
41
- }
42
-
43
- p, li {
44
- font-family: $sans-serif;
45
- font-size: $type-size-6;
46
- line-height: 1.5;
47
- }
48
-
49
- img {
50
- width: 100%;
51
- }
52
- }
53
-
54
- .sidebar__right {
55
- margin-bottom: 1em;
56
-
57
- @include breakpoint($large) {
58
- position: relative;
59
- float: right;
60
- width: $right-sidebar-width-narrow;
61
- margin-left: span(0.5 of 12);
62
- z-index: 10;
63
- }
64
-
65
- @include breakpoint($x-large) {
66
- width: $right-sidebar-width;
67
- }
68
- }
69
-
70
- /*
71
- Author profile and links
72
- ========================================================================== */
73
-
74
- .author__avatar {
75
- display: table-cell;
76
- vertical-align: top;
77
- width: 36px;
78
- height: 36px;
79
-
80
- @include breakpoint($large) {
81
- display: block;
82
- width: auto;
83
- height: auto;
84
- }
85
-
86
- img {
87
- max-width: 110px;
88
- border-radius: 50%;
89
-
90
- @include breakpoint($large) {
91
- padding: 5px;
92
- border: 1px solid $border-color;
93
- }
94
- }
95
- }
96
-
97
- .author__content {
98
- display: table-cell;
99
- vertical-align: top;
100
- padding-left: 15px;
101
- padding-right: 25px;
102
- line-height: 1;
103
-
104
- @include breakpoint($large) {
105
- display: block;
106
- width: 100%;
107
- padding-left: 0;
108
- padding-right: 0;
109
- }
110
- }
111
-
112
- .author__name {
113
- margin: 0;
114
-
115
- @include breakpoint($large) {
116
- margin-top: 10px;
117
- margin-bottom: 10px;
118
- }
119
- }
120
- .sidebar .author__name {
121
- font-family: $sans-serif;
122
- font-size: $type-size-5;
123
- }
124
-
125
- .author__bio {
126
- margin: 0;
127
-
128
- @include breakpoint($large) {
129
- margin-top: 10px;
130
- margin-bottom: 20px;
131
- }
132
- }
133
-
134
- .author__urls-wrapper {
135
- position: relative;
136
- display: table-cell;
137
- vertical-align: middle;
138
- font-family: $sans-serif;
139
- z-index: 10;
140
- position: relative;
141
- cursor: pointer;
142
-
143
- li:last-child {
144
- a {
145
- margin-bottom: 0;
146
- }
147
- }
148
-
149
- @include breakpoint($large) {
150
- display: block;
151
- }
152
-
153
- button {
154
- margin-bottom: 0;
155
-
156
- @include breakpoint($large) {
157
- display: none;
158
- }
159
- }
160
- }
161
-
162
- .author__urls {
163
- display: none;
164
- position: absolute;
165
- right: 0;
166
- margin-top: 15px;
167
- padding: 10px;
168
- list-style-type: none;
169
- border: 1px solid $border-color;
170
- border-radius: $border-radius;
171
- background: #fff;
172
- z-index: -1;
173
- box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
174
- cursor: default;
175
-
176
- &.is--visible {
177
- display: block;
178
- }
179
-
180
- @include breakpoint($large) {
181
- display: block;
182
- position: relative;
183
- margin: 0;
184
- padding: 0;
185
- border: 0;
186
- background: transparent;
187
- box-shadow: none;
188
- }
189
-
190
- &:before {
191
- display: block;
192
- content: "";
193
- position: absolute;
194
- top: -11px;
195
- left: calc(50% - 10px);
196
- width: 0;
197
- border-style: solid;
198
- border-width: 0 10px 10px;
199
- border-color: $border-color transparent;
200
- z-index: 0;
201
-
202
- @include breakpoint($large) {
203
- display: none;
204
- }
205
- }
206
-
207
- &:after {
208
- display: block;
209
- content: "";
210
- position: absolute;
211
- top: -10px;
212
- left: calc(50% - 10px);
213
- width: 0;
214
- border-style: solid;
215
- border-width: 0 10px 10px;
216
- border-color: #fff transparent;
217
- z-index: 1;
218
-
219
- @include breakpoint($large) {
220
- display: none;
221
- }
222
- }
223
-
224
- li {
225
- white-space: nowrap;
226
- }
227
-
228
- a {
229
- display: block;
230
- margin-bottom: 5px;
231
- padding-right: 5px;
232
- padding-top: 2px;
233
- padding-bottom: 2px;
234
- color: inherit;
235
- font-size: $type-size-5;
236
- text-decoration: none;
237
-
238
- &:hover {
239
- text-decoration: underline;
240
- }
241
- }
1
+ /* ==========================================================================
2
+ SIDEBAR
3
+ ========================================================================== */
4
+
5
+ /*
6
+ Default
7
+ ========================================================================== */
8
+
9
+ .sidebar {
10
+ @include clearfix();
11
+ margin-bottom: 1em;
12
+ -webkit-transform: translate3d(0, 0 , 0);
13
+ transform: translate3d(0, 0 , 0);
14
+
15
+ @include breakpoint(max-width $large) {
16
+ /* fix z-index order of follow links */
17
+ position: relative;
18
+ z-index: 10;
19
+ }
20
+
21
+ @include breakpoint($large) {
22
+ float: left;
23
+ width: calc(#{$right-sidebar-width-narrow} - 1em);
24
+ opacity: 0.75;
25
+ -webkit-transition: opacity 0.2s ease-in-out;
26
+ transition: opacity 0.2s ease-in-out;
27
+
28
+ &:hover {
29
+ opacity: 1;
30
+ }
31
+
32
+ &.sticky {
33
+ overflow-y: auto;
34
+ /* calculate height of nav list */
35
+ height: calc(100vh - 90px - 2em); // viewport height - approx. masthead height - main content top margin
36
+ }
37
+ }
38
+
39
+ @include breakpoint($x-large) {
40
+ width: calc(#{$right-sidebar-width} - 1em);
41
+ }
42
+
43
+ h2, h3, h4, h5, h6 {
44
+ margin-bottom: 0;
45
+ font-family: $sans-serif-narrow;
46
+ }
47
+
48
+ p, li {
49
+ font-family: $sans-serif;
50
+ font-size: $type-size-6;
51
+ line-height: 1.5;
52
+ }
53
+
54
+ img {
55
+ width: 100%;
56
+ }
57
+ }
58
+
59
+ .sidebar__right {
60
+ margin-bottom: 1em;
61
+
62
+ @include breakpoint($large) {
63
+ position: absolute;
64
+ top: 0;
65
+ right: 0;
66
+ width: $right-sidebar-width-narrow;
67
+ margin-right: -1 * $right-sidebar-width-narrow;
68
+ padding-left: 1em;
69
+ z-index: 10;
70
+ }
71
+
72
+ @include breakpoint($x-large) {
73
+ width: $right-sidebar-width;
74
+ margin-right: -1 * $right-sidebar-width;
75
+ }
76
+ }
77
+
78
+ .splash .sidebar__right {
79
+
80
+ @include breakpoint($large) {
81
+ position: relative;
82
+ float: right;
83
+ margin-right: 0;
84
+ }
85
+
86
+ @include breakpoint($x-large) {
87
+ margin-right: 0;
88
+ }
89
+ }
90
+
91
+ /*
92
+ Author profile and links
93
+ ========================================================================== */
94
+
95
+ .author__avatar {
96
+ display: table-cell;
97
+ vertical-align: top;
98
+ width: 36px;
99
+ height: 36px;
100
+
101
+ @include breakpoint($large) {
102
+ display: block;
103
+ width: auto;
104
+ height: auto;
105
+ }
106
+
107
+ img {
108
+ max-width: 110px;
109
+ border-radius: 50%;
110
+
111
+ @include breakpoint($large) {
112
+ padding: 5px;
113
+ border: 1px solid $border-color;
114
+ }
115
+ }
116
+ }
117
+
118
+ .author__content {
119
+ display: table-cell;
120
+ vertical-align: top;
121
+ padding-left: 15px;
122
+ padding-right: 25px;
123
+ line-height: 1;
124
+
125
+ @include breakpoint($large) {
126
+ display: block;
127
+ width: 100%;
128
+ padding-left: 0;
129
+ padding-right: 0;
130
+ }
131
+ }
132
+
133
+ .author__name {
134
+ margin: 0;
135
+
136
+ @include breakpoint($large) {
137
+ margin-top: 10px;
138
+ margin-bottom: 10px;
139
+ }
140
+ }
141
+ .sidebar .author__name {
142
+ font-family: $sans-serif;
143
+ font-size: $type-size-5;
144
+ }
145
+
146
+ .author__bio {
147
+ margin: 0;
148
+
149
+ @include breakpoint($large) {
150
+ margin-top: 10px;
151
+ margin-bottom: 20px;
152
+ }
153
+ }
154
+
155
+ .author__urls-wrapper {
156
+ position: relative;
157
+ display: table-cell;
158
+ vertical-align: middle;
159
+ font-family: $sans-serif;
160
+ z-index: 10;
161
+ position: relative;
162
+ cursor: pointer;
163
+
164
+ li:last-child {
165
+ a {
166
+ margin-bottom: 0;
167
+ }
168
+ }
169
+
170
+ @include breakpoint($large) {
171
+ display: block;
172
+ }
173
+
174
+ button {
175
+ margin-bottom: 0;
176
+
177
+ @include breakpoint($large) {
178
+ display: none;
179
+ }
180
+ }
181
+ }
182
+
183
+ .author__urls {
184
+ display: none;
185
+ position: absolute;
186
+ right: 0;
187
+ margin-top: 15px;
188
+ padding: 10px;
189
+ list-style-type: none;
190
+ border: 1px solid $border-color;
191
+ border-radius: $border-radius;
192
+ background: #fff;
193
+ z-index: -1;
194
+ box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
195
+ cursor: default;
196
+
197
+ &.is--visible {
198
+ display: block;
199
+ }
200
+
201
+ @include breakpoint($large) {
202
+ display: block;
203
+ position: relative;
204
+ margin: 0;
205
+ padding: 0;
206
+ border: 0;
207
+ background: transparent;
208
+ box-shadow: none;
209
+ }
210
+
211
+ &:before {
212
+ display: block;
213
+ content: "";
214
+ position: absolute;
215
+ top: -11px;
216
+ left: calc(50% - 10px);
217
+ width: 0;
218
+ border-style: solid;
219
+ border-width: 0 10px 10px;
220
+ border-color: $border-color transparent;
221
+ z-index: 0;
222
+
223
+ @include breakpoint($large) {
224
+ display: none;
225
+ }
226
+ }
227
+
228
+ &:after {
229
+ display: block;
230
+ content: "";
231
+ position: absolute;
232
+ top: -10px;
233
+ left: calc(50% - 10px);
234
+ width: 0;
235
+ border-style: solid;
236
+ border-width: 0 10px 10px;
237
+ border-color: #fff transparent;
238
+ z-index: 1;
239
+
240
+ @include breakpoint($large) {
241
+ display: none;
242
+ }
243
+ }
244
+
245
+ li {
246
+ white-space: nowrap;
247
+ }
248
+
249
+ a {
250
+ display: block;
251
+ margin-bottom: 5px;
252
+ padding-right: 5px;
253
+ padding-top: 2px;
254
+ padding-bottom: 2px;
255
+ color: inherit;
256
+ font-size: $type-size-5;
257
+ text-decoration: none;
258
+
259
+ &:hover {
260
+ text-decoration: underline;
261
+ }
262
+ }
242
263
  }