@sb1/ffe-core 27.3.12 → 27.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/less/typography.less +4 -137
- package/package.json +2 -2
package/less/typography.less
CHANGED
|
@@ -1,143 +1,6 @@
|
|
|
1
1
|
@import 'breakpoints';
|
|
2
2
|
@import 'colors';
|
|
3
3
|
|
|
4
|
-
// Heading
|
|
5
|
-
//
|
|
6
|
-
// Markup:
|
|
7
|
-
// <h1 class="ffe-h1">Overskrift nivå 1</h1>
|
|
8
|
-
// <h2 class="ffe-h2">Overskrift nivå 2</h2>
|
|
9
|
-
// <h3 class="ffe-h3">Overskrift nivå 3</h3>
|
|
10
|
-
// <h4 class="ffe-h4">Overskrift nivå 4</h4>
|
|
11
|
-
// <h5 class="ffe-h5">Overskrift nivå 5</h5>
|
|
12
|
-
// <h6 class="ffe-h6">Overskrift nivå 6</h6>
|
|
13
|
-
//
|
|
14
|
-
// Styleguide ffe-core.typography.headings
|
|
15
|
-
|
|
16
|
-
// Heading classes
|
|
17
|
-
//
|
|
18
|
-
// Markup:
|
|
19
|
-
// <div class="{{modifier_class}}">Overskrift</div>
|
|
20
|
-
//
|
|
21
|
-
// .ffe-h1 - nivå 1
|
|
22
|
-
// .ffe-h2 - nivå 2
|
|
23
|
-
// .ffe-h3 - nivå 3
|
|
24
|
-
// .ffe-h4 - nivå 4
|
|
25
|
-
// .ffe-h5 - nivå 5
|
|
26
|
-
// .ffe-h6 - nivå 6
|
|
27
|
-
//
|
|
28
|
-
// Styleguide ffe-core.typography.headings-classes
|
|
29
|
-
|
|
30
|
-
// Heading modifiers
|
|
31
|
-
//
|
|
32
|
-
// Markup:
|
|
33
|
-
// <div class="ffe-h3 ffe-h3{{modifier_class}}">Overskrift</div>
|
|
34
|
-
//
|
|
35
|
-
// --error - Error
|
|
36
|
-
// --inline - Inline
|
|
37
|
-
// --no-margin - No margin
|
|
38
|
-
// --with-border - With border
|
|
39
|
-
// --no-underline - No underline
|
|
40
|
-
//
|
|
41
|
-
// Styleguide ffe-core.typography.headings-modifiers
|
|
42
|
-
|
|
43
|
-
// Body paragraph
|
|
44
|
-
//
|
|
45
|
-
// Markup:
|
|
46
|
-
// <p class="ffe-body-paragraph {{modifier_class}}">
|
|
47
|
-
// Velg en av bankene våre, og bruk BankID for å bli kunde. Nettbank og
|
|
48
|
-
// mobilbank får du med en gang, og bankkortet kommer i posten om en ukes
|
|
49
|
-
// tid.
|
|
50
|
-
// </p>
|
|
51
|
-
//
|
|
52
|
-
// .ffe-body-paragraph--text-center - Centered
|
|
53
|
-
// .ffe-body-paragraph--text-left - Aligned left
|
|
54
|
-
//
|
|
55
|
-
// Styleguide ffe-core.typography.body-paragraph
|
|
56
|
-
|
|
57
|
-
// Lead paragraph
|
|
58
|
-
//
|
|
59
|
-
// Markup:
|
|
60
|
-
// <p class="ffe-lead-paragraph">
|
|
61
|
-
// Velg en av bankene våre, og bruk BankID for å bli kunde. Nettbank og
|
|
62
|
-
// mobilbank får du med en gang, og bankkortet kommer i posten om en ukes
|
|
63
|
-
// tid.
|
|
64
|
-
// </p>
|
|
65
|
-
// <p class="ffe-sub-lead-paragraph">
|
|
66
|
-
// Velg en av bankene våre, og bruk BankID for å bli kunde. Nettbank og
|
|
67
|
-
// mobilbank får du med en gang, og bankkortet kommer i posten om en ukes
|
|
68
|
-
// tid.
|
|
69
|
-
// </p>
|
|
70
|
-
// <p class="ffe-body-paragraph">
|
|
71
|
-
// Velg en av bankene våre, og bruk BankID for å bli kunde. Nettbank og
|
|
72
|
-
// mobilbank får du med en gang, og bankkortet kommer i posten om en ukes
|
|
73
|
-
// tid.
|
|
74
|
-
// </p>
|
|
75
|
-
//
|
|
76
|
-
// Styleguide ffe-core.typography.lead-paragraph
|
|
77
|
-
|
|
78
|
-
// Small text
|
|
79
|
-
//
|
|
80
|
-
// Markup:
|
|
81
|
-
// <div class="ffe-small-text">Dette er en liten type</div>
|
|
82
|
-
//
|
|
83
|
-
// Styleguide ffe-core.typography.small-text
|
|
84
|
-
|
|
85
|
-
// Micro text
|
|
86
|
-
//
|
|
87
|
-
// Markup:
|
|
88
|
-
// <div class="ffe-micro-text">Dette er den minste typen vi har</div>
|
|
89
|
-
//
|
|
90
|
-
// Styleguide ffe-core.typography.micro-text
|
|
91
|
-
|
|
92
|
-
// Strong text
|
|
93
|
-
//
|
|
94
|
-
// Markup:
|
|
95
|
-
// <div class="ffe-strong-text">Dette er en sterk type</div>
|
|
96
|
-
//
|
|
97
|
-
// Styleguide ffe-core.typography.strong-text
|
|
98
|
-
|
|
99
|
-
// Emphasized text
|
|
100
|
-
//
|
|
101
|
-
// Markup:
|
|
102
|
-
// <div class="ffe-em-text">Dette bør utheves</div>
|
|
103
|
-
//
|
|
104
|
-
// Styleguide ffe-core.typography.em-text
|
|
105
|
-
|
|
106
|
-
// Preformatted text
|
|
107
|
-
//
|
|
108
|
-
// Markup:
|
|
109
|
-
// <pre class="ffe-pre-text">
|
|
110
|
-
// Gammal dam
|
|
111
|
-
// Ein frosk hoppar
|
|
112
|
-
// Lyden av vatnet
|
|
113
|
-
// </pre>
|
|
114
|
-
//
|
|
115
|
-
// Styleguide ffe-core.typography.pre-text
|
|
116
|
-
|
|
117
|
-
// Divider line
|
|
118
|
-
//
|
|
119
|
-
// Markup:
|
|
120
|
-
// <hr class="ffe-divider-line"/>
|
|
121
|
-
//
|
|
122
|
-
// Styleguide ffe-core.typography.divider-line
|
|
123
|
-
|
|
124
|
-
// Inline separator
|
|
125
|
-
//
|
|
126
|
-
// Markup:
|
|
127
|
-
// <hr class="ffe-inline-seperator"/>
|
|
128
|
-
//
|
|
129
|
-
// Styleguide ffe-core.typography.inline-seperator
|
|
130
|
-
|
|
131
|
-
// Link
|
|
132
|
-
//
|
|
133
|
-
// Markup:
|
|
134
|
-
// <a class="ffe-link-text {{modifier_class}}" href="#na">Link text</a>
|
|
135
|
-
//
|
|
136
|
-
// :hover - Hover state
|
|
137
|
-
// .ffe-link-text--no-underline - not underlined
|
|
138
|
-
//
|
|
139
|
-
// Styleguide ffe-core.typography.link-text
|
|
140
|
-
|
|
141
4
|
.ffe-h1 {
|
|
142
5
|
line-height: 2.25rem;
|
|
143
6
|
font-size: var(--ffe-fontsize-h1);
|
|
@@ -184,6 +47,10 @@
|
|
|
184
47
|
|
|
185
48
|
.ffe-micro-text {
|
|
186
49
|
font-size: var(--ffe-fontsize-micro-text);
|
|
50
|
+
|
|
51
|
+
&--strong {
|
|
52
|
+
font-family: var(--ffe-g-font-strong);
|
|
53
|
+
}
|
|
187
54
|
}
|
|
188
55
|
|
|
189
56
|
.ffe-h1,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sb1/ffe-core",
|
|
3
|
-
"version": "27.
|
|
3
|
+
"version": "27.4.0",
|
|
4
4
|
"description": "Rammeverk for Felles Front End",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "SpareBank 1",
|
|
@@ -30,5 +30,5 @@
|
|
|
30
30
|
"publishConfig": {
|
|
31
31
|
"access": "public"
|
|
32
32
|
},
|
|
33
|
-
"gitHead": "
|
|
33
|
+
"gitHead": "8f14fe9d40314d64c62a4622e7d35b33b9e5484d"
|
|
34
34
|
}
|