Skip to content

Commit 792c124

Browse files
author
Stuart Reilly
committed
SCSS cleanup
1 parent 188d923 commit 792c124

19 files changed

+264
-241
lines changed

‎scss/_404.scss‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1+
@use 'util';
2+
13
.error-page {
24

3-
padding-top: 80px;
4-
@include breakpoint(large) {
5-
padding-top: 150px;
6-
}
5+
padding-top: 80px;
6+
@include util.breakpoint(large) {
7+
padding-top: 150px;
8+
}
79

810
h1 {
911
font-size: 3rem;

‎scss/_author-list.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
@use 'colours';
2+
@use 'fonts';
23

34
.author-list {
45
a {
5-
font-weight: $font-regular;
6+
font-weight: fonts.$font-regular;
67
}
78

89
li {
910
margin: .4rem 0;
1011

1112
a {
12-
font-weight: $font-light;
13+
font-weight: fonts.$font-light;
1314
}
1415
}
1516

‎scss/_author.scss‎

Lines changed: 31 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@use 'colours';
2+
@use 'fonts';
23

34
.default-author {
45
.h4 {
@@ -10,53 +11,53 @@
1011
}
1112

1213
.talk_title {
13-
line-height: 1.5;
14-
font-weight: bold;
15-
font-size: 13px;
16-
font-family: $font-family;
14+
line-height: 1.5;
15+
font-weight: bold;
16+
font-size: 13px;
17+
font-family: fonts.$font-family;
1718
}
1819

1920
.talk_date {
20-
color: colours.$grey;
21-
font-size: 13px;
22-
font-family: $font-family;
21+
color: colours.$grey;
22+
font-size: 13px;
23+
font-family: fonts.$font-family;
2324
}
2425
}
2526

2627
.author {
27-
padding-top: 150px;
28+
padding-top: 150px;
2829

29-
img {
30-
border-radius: 50%;
31-
filter: grayscale(100%);
32-
max-height: 6.25rem;
33-
max-width: 6.25rem;
34-
object-fit: cover;
35-
height: 100%;
36-
width: 100%;
37-
}
30+
img {
31+
border-radius: 50%;
32+
filter: grayscale(100%);
33+
max-height: 6.25rem;
34+
max-width: 6.25rem;
35+
object-fit: cover;
36+
height: 100%;
37+
width: 100%;
38+
}
3839

39-
.avatar {
40-
text-align: center;
41-
}
40+
.avatar {
41+
text-align: center;
42+
}
4243

43-
.links {
44-
text-align: right;
44+
.links {
45+
text-align: right;
4546

46-
a {
47-
border-bottom: 3px solid colours.$teal;
48-
}
47+
a {
48+
border-bottom: 3px solid colours.$teal;
49+
}
4950

50-
a:hover {
51-
color: colours.$white;
52-
background-color: colours.$teal;
53-
}
51+
a:hover {
52+
color: colours.$white;
53+
background-color: colours.$teal;
5454
}
55+
}
5556

5657
.blog {
5758
margin-bottom: 0;
5859
color: colours.$teal;
59-
font-weight: $font-bold;
60+
font-weight: fonts.$font-bold;
6061
}
6162

6263
.avatar > div {

‎scss/_blog-main.scss‎

Lines changed: 24 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,9 @@
11
@use 'colours';
2-
3-
$max-width: 1400px;
4-
5-
$baseFontSize: 16px;
6-
$monospaceFontSize: $baseFontSize * 0.9;
7-
$smallLayoutUnit: 5px;
8-
$layoutUnit: 10px;
9-
10-
$footer-height: 216px;
11-
12-
$font-family: "objektiv-mk1", Helvetica, Arial, sans-serif !important;
2+
@use "sizes";
3+
@use "fonts";
134

145
html, body {
15-
max-width: $max-width;
6+
max-width: sizes.$max-width;
167
margin: 0 auto;
178
padding: 0;
189
height: 100%;
@@ -25,26 +16,19 @@ html, body {
2516

2617
.post-index, .default-post, .default-author {
2718
min-height: 100%;
28-
padding-bottom: $footer-height;
29-
margin-bottom: -$footer-height;
19+
padding-bottom: sizes.$footer-height;
20+
margin-bottom: -(sizes.$footer-height);
3021
}
3122

3223
/* Font Settings */
33-
/*
34-
Sizes set to PX here, but if base size is set to 16px, you can
35-
replace with REM.
36-
*/
37-
$font-light: 300;
38-
$font-regular: 400;
39-
$font-medium: 500;
40-
$font-bold: 700;
24+
4125
body {
42-
font-family: $font-family;
26+
font-family: fonts.$font-family;
4327
}
4428

4529
a.link {
4630
/* Links & Buttons */
47-
font-weight: $font-medium;
31+
font-weight: fonts.$font-medium;
4832
border-bottom: 5px solid;
4933
padding-bottom: 0;
5034
background-color: transparent;
@@ -60,49 +44,49 @@ a.link {
6044
a {
6145
color: inherit;
6246
text-decoration: inherit;
63-
font-weight: $font-bold;
47+
font-weight: fonts.$font-bold;
6448
}
6549

6650
a:hover {
6751
color: colours.$teal;
6852
}
6953

7054
h1, h2, h3, h4, h5, h6 {
71-
font-family: $font-family;
55+
font-family: fonts.$font-family;
7256
}
7357

7458
h1 {
75-
font-size: $baseFontSize * 2.5;
76-
font-weight: $font-bold;
59+
font-size: fonts.$baseFontSize * 2.5;
60+
font-weight: fonts.$font-bold;
7761
text-align: center;
7862
}
7963

8064
h2 {
81-
font-size: $baseFontSize * 1.5;
82-
font-weight: $font-bold;
65+
font-size: fonts.$baseFontSize * 1.5;
66+
font-weight: fonts.$font-bold;
8367
}
8468

8569
h3 {
86-
font-size: $baseFontSize * 1.25;
87-
font-weight: $font-bold;
70+
font-size: fonts.$baseFontSize * 1.25;
71+
font-weight: fonts.$font-bold;
8872
}
8973

9074
h4 {
91-
font-size: $baseFontSize;
92-
font-weight: $font-bold;
75+
font-size: fonts.$baseFontSize;
76+
font-weight: fonts.$font-bold;
9377
}
9478
h5 {
95-
font-weight: $font-medium;
79+
font-weight: fonts.$font-medium;
9680
}
9781
h6 {
98-
font-weight: $font-regular;
82+
font-weight: fonts.$font-regular;
9983
}
10084

10185
p {
10286
font-size: 16px;
103-
font-weight: $font-light;
87+
font-weight: fonts.$font-light;
10488
span {
105-
font-weight: $font-medium
89+
font-weight: fonts.$font-medium
10690
}
10791
}
10892

@@ -172,11 +156,11 @@ header nav {
172156
}
173157

174158
.category > a {
175-
font-weight: $font-light;
159+
font-weight: fonts.$font-light;
176160
}
177161

178162
.cta > a {
179-
font-weight: $font-bold;
163+
font-weight: fonts.$font-bold;
180164
}
181165

182166
.header-nav_top {

‎scss/_category-list.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
@use 'colours';
2+
@use 'fonts';
23

34
.category-list {
45
a {
5-
font-weight: $font-regular;
6+
font-weight: fonts.$font-regular;
67
}
78

89
li {
910
margin: .4rem 0;
1011

1112
a {
12-
font-weight: $font-light;
13+
font-weight: fonts.$font-light;
1314
}
1415
}
1516

‎scss/_code.scss‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
@use 'sizes';
2+
@use 'fonts';
3+
@use 'util';
4+
15
$codeBackground: #f9f2f4;
26

37
code, pre {
@@ -12,25 +16,25 @@ code {
1216

1317
code.highlighter-rouge {
1418
padding: 2px 4px;
15-
font-size: $monospaceFontSize;
19+
font-size: fonts.$monospaceFontSize;
1620
color: #c7254e;
1721
background-color: $codeBackground;
18-
border-radius: $smallLayoutUnit;
22+
border-radius: sizes.$smallLayoutUnit;
1923
}
2024

2125
pre {
2226
display: block;
23-
padding: $layoutUnit;
24-
margin: 0 0 $layoutUnit;
25-
font-size: $monospaceFontSize;
27+
padding: sizes.$layoutUnit;
28+
margin: 0 0 sizes.$layoutUnit;
29+
font-size: fonts.$monospaceFontSize;
2630
line-height: 1.42857143;
2731
-webkit-overflow-scrolling: touch;
2832
overflow-x: auto;
2933
background-color: $codeBackground;
3034
border: 1px solid #ccc;
31-
border-radius: $smallLayoutUnit;
35+
border-radius: sizes.$smallLayoutUnit;
3236

33-
@include breakpoint(large) {
37+
@include util.breakpoint(large) {
3438
margin-left: calc((16.66667% + 0.9375rem) * -1);
3539
margin-right: calc((16.66667% + 0.9375rem) * -1);
3640
}

‎scss/_cookie-consent.scss‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
@use 'fonts';
2+
13
.cc-window {
2-
box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.12), 0px 2px 6px 0px rgba(0,0,0,0.1);
4+
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12), 0 2px 6px 0 rgba(0,0,0,0.1);
35
width: 22em;
46
max-width: 22em;
5-
font-family: $font-family;
7+
font-family: fonts.$font-family;
68
font-size: 12px;
79
}
810

0 commit comments

Comments
 (0)