Bladeren bron

change variable typography sss

adding font questrial and heading
tags/0.9.0
Alej 5 jaren geleden
bovenliggende
commit
4e0f58f551
2 gewijzigde bestanden met toevoegingen van 87 en 5 verwijderingen
  1. 57
    2
      vue-theme/src/sss/_typography.sss
  2. 30
    3
      vue-theme/src/sss/variables.sss

+ 57
- 2
vue-theme/src/sss/_typography.sss Bestand weergeven

6
     &-left
6
     &-left
7
         text-align: left
7
         text-align: left
8
     &-b
8
     &-b
9
-        text-weight: bold
9
+        text-weight: 800
10
     &-i
10
     &-i
11
         text-style: italic
11
         text-style: italic
12
     &-up
12
     &-up
21
         font-family: $mono
21
         font-family: $mono
22
 
22
 
23
 a
23
 a
24
+    color: $cia_grey
25
+    /* text-decoration: none */
24
     &:hover
26
     &:hover
25
-        cursor: pointer
27
+        cursor: pointer
28
+        color: $cia_black
29
+
30
+h1
31
+    display: block
32
+    font-size: 2em
33
+    margin-top: 0.6em
34
+    margin-bottom: 0.6em
35
+    margin-left: 0
36
+    margin-right: 0
37
+    font-weight: bold
38
+
39
+h2
40
+    display: block
41
+    font-size: 1.5em
42
+    margin-top: 0.8em
43
+    margin-bottom: 0.8em
44
+    margin-left: 0
45
+    margin-right: 0
46
+    font-weight: bold
47
+h3
48
+    display: block
49
+    font-size: 1.17em
50
+    margin-top: 1em
51
+    margin-bottom: 1em
52
+    margin-left: 0
53
+    margin-right: 0
54
+    font-weight: bold
55
+h4
56
+    display: block
57
+    font-size: 1em
58
+    margin-top: 1.33em
59
+    margin-bottom: 1.33em
60
+    margin-left: 0
61
+    margin-right: 0
62
+    font-weight: bold
63
+
64
+h5
65
+    display: block
66
+    font-size: .8em
67
+    margin-top: 1.6em
68
+    margin-bottom: 1.6em
69
+    margin-left: 0
70
+    margin-right: 0
71
+    font-weight: bold
72
+
73
+h6
74
+    display: block
75
+    font-size: .67em
76
+    margin-top: 2em
77
+    margin-bottom: 2em
78
+    margin-left: 0
79
+    margin-right: 0
80
+    font-weight: bold

+ 30
- 3
vue-theme/src/sss/variables.sss Bestand weergeven

1
+@import url('https://fonts.googleapis.com/css?family=Crimson+Text|Questrial')
2
+
1
 /* Colors */
3
 /* Colors */
2
 $blue: #0076A3
4
 $blue: #0076A3
3
 $chart-bg: rgba(20,20,20)
5
 $chart-bg: rgba(20,20,20)
12
 $primary-lighter: #CEFFF3
14
 $primary-lighter: #CEFFF3
13
 $primary-dark: #007351
15
 $primary-dark: #007351
14
 
16
 
17
+$cia_red: #a10000
18
+$cia_white: #ffffff
19
+$cia_grey: #efefef
20
+$cia_black: #0d0d0d
21
+
15
 /* Fonts */
22
 /* Fonts */
16
-$sans: 'sans-serif'
17
-$serif: 'serif'
18
-$mono: 'monospace'
23
+$sans: 'Questrial', sans-serif
24
+$serif: 'Hoefler Text', 'Crimson Text', serif
25
+$mono: 'Roboto Mono', monospace
26
+
27
+$cia_serif: 'Hoefler Text', 'Crimson Text', serif
28
+$cia_sans: 'Questrial', 'Futura', 'Futura PT', sans-serif
29
+$cia_transition: 200ms
30
+
31
+@font-face
32
+  font-family: 'Crimson Text'
33
+  font-style: normal
34
+  font-weight: 400
35
+  font-display: swap
36
+  src: local('Crimson Text Regular'), local('CrimsonText-Regular'), url(https://fonts.gstatic.com/s/crimsontext/v9/wlp2gwHKFkZgtmSR3NB0oRJfbwhT.woff2) format('woff2')
37
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
38
+
39
+@font-face 
40
+  font-family: 'Questrial'
41
+  font-style: normal
42
+  font-weight: 400
43
+  font-display: swap
44
+  src: local('Questrial'), local('Questrial-Regular'), url(https://fonts.gstatic.com/s/questrial/v8/QdVUSTchPBm7nuUeVf70viFl.woff2) format('woff2')
45
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
19
 
46
 
20
 /* Proportion (to be replaced with modular scale) */
47
 /* Proportion (to be replaced with modular scale) */
21
 $ms: 1vw
48
 $ms: 1vw

Laden…
Annuleren
Opslaan