jekyll-theme-fica 0.1.2 → 0.1.5

Sign up to get free protection for your applications and to get access to all the features.
data/_sass/Base.scss CHANGED
@@ -1,288 +1,401 @@
1
1
  html {
2
- font-size: $base-font-size;
2
+ font-size: $base-font-size;
3
3
  }
4
4
 
5
5
  /**
6
- * Reset some basic elements
7
- */
8
- body, h1, h2, h3, h4, h5, h6,
9
- p, blockquote, pre, hr,
10
- dl, dd, ol, ul, figure {
11
- margin: 0;
12
- padding: 0;
13
-
14
- }
15
-
16
- body {
17
- font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
18
- color: $text-color;
6
+ * Reset some basic elements
7
+ */
8
+ body,
9
+ h1,
10
+ h2,
11
+ h3,
12
+ h4,
13
+ h5,
14
+ h6,
15
+ p,
16
+ blockquote,
17
+ pre,
18
+ hr,
19
+ dl,
20
+ dd,
21
+ ol,
22
+ ul,
23
+ figure {
24
+ margin: 0;
25
+ padding: 0;
26
+ }
27
+
28
+ body {
29
+ font: $base-font-weight #{$base-font-size}/#{$base-line-height}
30
+ $base-font-family;
31
+ color: $text-color;
32
+ background-color: $background-color;
33
+ -webkit-text-size-adjust: 100%;
34
+ -webkit-font-feature-settings: "kern" 1;
35
+ -moz-font-feature-settings: "kern" 1;
36
+ -o-font-feature-settings: "kern" 1;
37
+ font-feature-settings: "kern" 1;
38
+ font-kerning: normal;
39
+ display: flex;
40
+ min-height: 100vh;
41
+ flex-direction: column;
42
+ overflow-wrap: break-word;
43
+
44
+ &::-webkit-scrollbar {
45
+ width: 7px;
46
+ height: 4px;
47
+ }
48
+
49
+ &::-webkit-scrollbar-track {
19
50
  background-color: $background-color;
20
- -webkit-text-size-adjust: 100%;
21
- -webkit-font-feature-settings: "kern" 1;
22
- -moz-font-feature-settings: "kern" 1;
23
- -o-font-feature-settings: "kern" 1;
24
- font-feature-settings: "kern" 1;
25
- font-kerning: normal;
26
- display: flex;
27
- min-height: 100vh;
28
- flex-direction: column;
29
- overflow-wrap: break-word;
30
- }
51
+ }
52
+
53
+ &::-webkit-scrollbar-thumb {
54
+ background: $scroll_bar_bg_color;
55
+ border-radius: 4px;
56
+ }
57
+ }
58
+
59
+ /**
60
+ * Set `margin-bottom` to maintain vertical rhythm
61
+ */
62
+ h1,
63
+ h2,
64
+ h3,
65
+ h4,
66
+ h5,
67
+ h6,
68
+ p,
69
+ blockquote,
70
+ pre,
71
+ ul,
72
+ ol,
73
+ dl,
74
+ figure,
75
+ %vertical-rhythm {
76
+ margin-bottom: $spacing-unit / 2;
77
+ }
78
+
79
+ hr {
80
+ margin-top: $spacing-unit;
81
+ margin-bottom: $spacing-unit;
82
+ background: $text-color;
83
+ }
84
+
85
+ /**
86
+ * `main` element
87
+ */
88
+ main {
89
+ display: block;
90
+ /* Default value of `display` of `main` element is 'inline' in IE 11. */
91
+ animation-name: text_trans;
92
+ animation-duration: 1s;
93
+ -webkit-animation-timing-function: ease-in;
94
+ animation-timing-function: ease-in;
95
+ @keyframes text_trans {
96
+ 0% {
97
+ opacity: 0%;
98
+ }
99
+ 20% {
100
+ opacity: 20%;
101
+ }
102
+ 50% {
103
+ opacity: 50%;
104
+ }
105
+ 70% {
106
+ opacity: 70%;
107
+ }
108
+ 90% {
109
+ opacity: 90%;
110
+ }
111
+ 100% {
112
+ opacity: 100%;
113
+ }
114
+ }
115
+ }
116
+
117
+ /**
118
+ * Images
119
+ */
120
+ img {
121
+ max-width: 100%;
122
+ vertical-align: middle;
123
+ }
124
+
125
+ /**
126
+ * Figures
127
+ */
128
+ figure > img {
129
+ display: block;
130
+ }
131
+
132
+ figcaption {
133
+ font-size: $small-font-size;
134
+ }
31
135
 
32
136
  /**
33
- * Set `margin-bottom` to maintain vertical rhythm
34
- */
35
- h1, h2, h3, h4, h5, h6,
36
- p, blockquote, pre,
37
- ul, ol, dl, figure,
38
- %vertical-rhythm {
39
- margin-bottom: $spacing-unit / 2;
40
- }
41
-
42
- hr {
43
- margin-top: $spacing-unit;
44
- margin-bottom: $spacing-unit;
45
- }
46
-
47
- /**
48
- * `main` element
49
- */
50
- main {
51
- display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */
52
- }
53
-
54
- /**
55
- * Images
56
- */
57
- img {
58
- max-width: 100%;
59
- vertical-align: middle;
60
- }
61
-
62
-
63
-
64
- /**
65
- * Figures
66
- */
67
- figure > img {
68
- display: block;
69
- }
70
-
71
- figcaption {
72
- font-size: $small-font-size;
73
- }
74
-
75
-
76
-
77
- /**
78
- * Lists
79
- */
80
- ul, ol {
81
- margin-left: $spacing-unit;
82
- }
83
-
84
- li {
85
- > ul,
86
- > ol {
87
- margin-bottom: 0;
88
- }
89
- }
90
-
91
-
92
-
93
- /**
94
- * Headings
95
- */
96
- h2, h3, h4, h5, h6 {
97
- font-weight: 650;
98
- font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
99
- }
100
-
101
- h1 {
102
- font-weight: 700;
103
- font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
104
- font-size: 35px;
105
- }
106
-
107
-
108
- /**
109
- * Links
110
- */
111
- a {
112
- color: $link-base-color;
113
- text-decoration: none;
114
- transition: $transition-links;
115
-
116
- &:visited {
117
- color: $link-visited-color;
118
- }
119
-
120
- &:hover {
121
- color: $link-hover-color;
122
- text-decoration: none;
123
- }
124
- }
125
-
126
-
127
- /**
128
- * Blockquotes
129
- */
130
- blockquote {
131
- color: $blockquote-text-color;
132
- border-left: 4px solid $border-color-01;
133
- padding-left: $spacing-unit / 2;
134
- @include relative-font-size(1.125);
135
- font-style: italic;
136
-
137
- > :last-child {
138
- margin-bottom: 0;
139
- }
140
-
141
- i, em {
142
- font-style: normal;
143
- }
144
- }
145
-
146
-
147
-
148
- /**
149
- * Code formatting
150
- */
151
- pre,
152
- code {
153
- font-family: $code-font-family;
154
- font-size: 0.9375em;
155
- border: 1px solid $border-color-01;
156
- border-radius: 4px;
157
- background-color: $code-background-color;
158
- }
159
-
160
- code {
161
- padding: 1px 5px;
162
- }
163
-
164
- pre {
165
- padding: 8px 12px;
166
- overflow-x: auto;
167
-
168
- > code {
169
- border: 0;
170
- padding-right: 0;
171
- padding-left: 0;
172
- }
173
- }
174
-
175
- .highlight {
176
- border-radius: 3px;
177
- background: $code-background-color;
178
- @extend %vertical-rhythm;
179
-
180
- .highlighter-rouge & {
181
- background: $code-background-color;
182
- }
183
- }
184
-
185
-
186
-
187
- /**
188
- * Wrapper
189
- */
190
- .wrapper {
191
- max-width: calc(#{$content-width} - (#{$spacing-unit}));
192
- margin-right: auto;
193
- margin-left: auto;
194
- padding-right: $spacing-unit / 2;
195
- padding-left: $spacing-unit / 2;
196
- @extend %clearfix;
197
-
198
- @media screen and (min-width: $on-large) {
199
- max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
200
- padding-right: $spacing-unit;
201
- padding-left: $spacing-unit;
202
- }
203
- }
204
-
205
- .wrapper_header {
206
- padding-left: 20px;
207
- padding-right: auto;
208
- @extend %clearfix;
209
- @media screen and (min-width: $on-medium) {
210
- padding-right: 70px;
211
- padding-left: 70px;
212
- }
213
- }
214
-
215
-
216
-
217
- /**
218
- * Clearfix
219
- */
220
- %clearfix:after {
221
- content: "";
222
- display: table;
223
- clear: both;
224
- }
225
-
226
-
227
-
228
- /**
229
- * Icons
230
- */
231
-
232
- .stackoverflow {
233
- color: #f66a0a;
234
- }
235
-
236
- .youtube {
237
- color: #dd0505;
238
- }
239
-
240
- .github {
241
- color: #f9f9f9
242
- }
243
-
244
- .svg-icon {
245
- width: 16px;
246
- height: 16px;
247
- display: inline-block;
248
- fill: currentColor;
249
- padding: 5px 3px 2px 5px;
250
- vertical-align: text-bottom;
251
- }
252
-
253
-
254
- /**
255
- * Tables
256
- */
257
- table {
258
- margin-bottom: $spacing-unit;
259
- width: 100%;
260
- text-align: $table-text-align;
261
- color: $table-text-color;
262
- border-collapse: collapse;
263
- border: 1px solid $table-border-color;
264
- tr {
265
- &:nth-child(even) {
266
- background-color: $table-zebra-color;
267
- }
268
- }
269
- th, td {
270
- padding: ($spacing-unit / 3) ($spacing-unit / 2);
271
- }
272
- th {
273
- background-color: $table-header-bg-color;
274
- border: 1px solid $table-header-border;
275
- }
276
- td {
277
- border: 1px solid $table-border-color;
278
- }
279
-
280
- @include media-query($on-laptop) {
281
- display: block;
282
- overflow-x: auto;
283
- -webkit-overflow-scrolling: touch;
284
- -ms-overflow-style: -ms-autohiding-scrollbar;
285
- }
286
- }
287
-
288
-
137
+ * Lists
138
+ */
139
+ ul,
140
+ ol {
141
+ margin-left: $spacing-unit;
142
+ }
143
+
144
+ li {
145
+ > ul,
146
+ > ol {
147
+ margin-bottom: 0;
148
+ }
149
+ }
150
+
151
+ /**
152
+ * Headings
153
+ */
154
+ h2,
155
+ h3,
156
+ h4,
157
+ h5,
158
+ h6 {
159
+ font-weight: 650;
160
+ font-family: $base-font-family;
161
+ }
162
+
163
+ h1 {
164
+ font-weight: 700;
165
+ font-family: $base-font-family;
166
+ font-size: 35px;
167
+ }
168
+
169
+ /**
170
+ * Links
171
+ */
172
+ a {
173
+ color: $link-base-color;
174
+ text-decoration: none;
175
+ transition: $transition-links;
176
+
177
+ &:visited {
178
+ color: $link-visited-color;
179
+ }
180
+
181
+ &:hover {
182
+ color: $link-hover-color;
183
+ text-decoration: none;
184
+ }
185
+ }
186
+
187
+ /**
188
+ * Blockquotes
189
+ */
190
+ blockquote {
191
+ color: $blockquote-text-color;
192
+ border-left: 4px solid $code-background-color;
193
+ padding-left: $spacing-unit / 2;
194
+ @include relative-font-size(1.125);
195
+ font-style: italic;
196
+
197
+ > :last-child {
198
+ margin-bottom: 0;
199
+ }
200
+
201
+ i,
202
+ em {
203
+ font-style: normal;
204
+ }
205
+ }
206
+
207
+ /**
208
+ * Code formatting
209
+ */
210
+ pre,
211
+ code {
212
+ font-family: $code-font-family;
213
+ font-size: 0.9375em;
214
+ border: 1px solid $code-background-color;
215
+ border-radius: 4px;
216
+ font-weight: bold;
217
+ background-color: $code-background-color;
218
+
219
+ &::-webkit-scrollbar {
220
+ width: 7px;
221
+ height: 9px;
222
+ }
223
+
224
+ &::-webkit-scrollbar-track {
225
+ background-color: $code-background-color;
226
+ }
227
+
228
+ &::-webkit-scrollbar-thumb {
229
+ background: $scroll_bar_bg_color;
230
+ border-radius: 4px;
231
+ }
232
+ }
233
+
234
+ code {
235
+ padding: 1px 5px;
236
+ }
237
+
238
+ pre {
239
+ padding: 8px 12px;
240
+ overflow-x: auto;
241
+
242
+ > code {
243
+ border: 0;
244
+ padding-right: 0;
245
+ padding-left: 0;
246
+ }
247
+ }
248
+
249
+ .highlight {
250
+ border-radius: 3px;
251
+ background: $code-background-color;
252
+ @extend %vertical-rhythm;
253
+
254
+ .highlighter-rouge & {
255
+ background: $code-background-color;
256
+ }
257
+ }
258
+
259
+ /**
260
+ * Wrapper
261
+ */
262
+ .wrapper {
263
+ max-width: calc(#{$content-width} - (#{$spacing-unit}));
264
+ margin-right: auto;
265
+ margin-left: auto;
266
+ padding-right: $spacing-unit / 2;
267
+ padding-left: $spacing-unit / 2;
268
+ @extend %clearfix;
269
+
270
+ @media screen and (min-width: $on-large) {
271
+ max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
272
+ padding-right: $spacing-unit;
273
+ padding-left: $spacing-unit;
274
+ }
275
+ }
276
+
277
+ .wrapper_header {
278
+ padding-left: 20px;
279
+ padding-right: auto;
280
+ @extend %clearfix;
281
+ @media screen and (min-width: $on-medium) {
282
+ padding-right: 70px;
283
+ padding-left: 70px;
284
+ }
285
+ }
286
+
287
+ .wrapper_footer {
288
+ max-width: calc(#{$content-width} - (#{$spacing-unit}));
289
+ margin-right: auto;
290
+ margin-left: auto;
291
+ padding-right: $spacing-unit / 2;
292
+ padding-left: $spacing-unit / 2;
293
+ @extend %clearfix;
294
+
295
+ @media screen and (min-width: $on-large) {
296
+ max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
297
+ padding-right: $spacing-unit;
298
+ padding-left: $spacing-unit;
299
+ }
300
+ }
301
+
302
+ /**
303
+ * Clearfix
304
+ */
305
+ %clearfix:after {
306
+ content: "";
307
+ display: table;
308
+ clear: both;
309
+ }
310
+
311
+ /**
312
+ * Icons
313
+ */
314
+
315
+ .stackoverflow {
316
+ color: #f66a0a;
317
+ }
318
+
319
+ .youtube {
320
+ color: #dd0505;
321
+ }
322
+
323
+ .github {
324
+ color: $Github;
325
+ }
326
+
327
+ .svg-icon {
328
+ width: 16px;
329
+ height: 16px;
330
+ display: inline-block;
331
+ fill: currentColor;
332
+ padding: 5px 3px 2px 5px;
333
+ vertical-align: text-bottom;
334
+ }
335
+
336
+ .gitlab {
337
+ color: $Github;
338
+ }
339
+
340
+ /**
341
+ * Tables
342
+ */
343
+ table {
344
+ margin-bottom: $spacing-unit;
345
+ width: 100%;
346
+ text-align: $table-text-align;
347
+ color: $table-text-color;
348
+ border-collapse: collapse;
349
+ border: 1px solid $table-border-color;
350
+
351
+ &::-webkit-scrollbar {
352
+ width: 7px;
353
+ height: 9px;
354
+ }
355
+
356
+ &::-webkit-scrollbar-track {
357
+ background-color: $background-color;
358
+ }
359
+
360
+ &::-webkit-scrollbar-thumb {
361
+ background: $scroll_bar_bg_color;
362
+ border-radius: 4px;
363
+ }
364
+ tr {
365
+ &:nth-child(even) {
366
+ background-color: $table-zebra-color;
367
+ }
368
+ }
369
+ th,
370
+ td {
371
+ padding: ($spacing-unit / 3) ($spacing-unit / 2);
372
+ }
373
+ th {
374
+ background-color: $table-header-bg-color;
375
+ border: 1px solid $table-header-border;
376
+ }
377
+ td {
378
+ border: 1px solid $table-border-color;
379
+ }
380
+
381
+ @include media-query($on-laptop) {
382
+ display: block;
383
+ overflow-x: auto;
384
+ -webkit-overflow-scrolling: touch;
385
+ -ms-overflow-style: -ms-autohiding-scrollbar;
386
+ }
387
+ }
388
+ dl {
389
+ padding: 0;
390
+
391
+ dt {
392
+ padding: 0;
393
+ margin-top: 1rem;
394
+ font-size: $base-font-size;
395
+ font-weight: 690;
396
+ }
397
+
398
+ dd {
399
+ margin-inline-start: 40px;
400
+ }
401
+ }
@@ -1,2 +1,2 @@
1
- // Placeholder to allow defining custom styles that override everything else.
2
- // (Use `_sass/minima/custom-variables.scss` to override variable defaults)
1
+ // Placeholder to allow defining custom styles that override everything else.
2
+ // (Use `_sass/minima/custom-variables.scss` to override variable defaults)
@@ -1 +1 @@
1
- // Placeholder to allow overriding predefined variables smoothly.
1
+ // Placeholder to allow overriding predefined variables smoothly.