@kth/style 0.19.1 → 1.1.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/package.json
CHANGED
|
@@ -6,21 +6,12 @@
|
|
|
6
6
|
@layer kth-style {
|
|
7
7
|
.kth-header.intranet {
|
|
8
8
|
@include colors.theme-intranet;
|
|
9
|
-
.kth-logotype img.white {
|
|
10
|
-
display: none;
|
|
11
|
-
}
|
|
12
9
|
}
|
|
13
10
|
.kth-header.external {
|
|
14
11
|
@include colors.theme-inverse;
|
|
15
|
-
.kth-logotype img.blue {
|
|
16
|
-
display: none;
|
|
17
|
-
}
|
|
18
12
|
}
|
|
19
13
|
.kth-header.student-web {
|
|
20
14
|
@include colors.theme-student-web;
|
|
21
|
-
.kth-logotype img.white {
|
|
22
|
-
display: none;
|
|
23
|
-
}
|
|
24
15
|
}
|
|
25
16
|
|
|
26
17
|
.kth-header {
|
|
@@ -14,71 +14,6 @@
|
|
|
14
14
|
@media (min-width: 992px) {
|
|
15
15
|
display: none;
|
|
16
16
|
}
|
|
17
|
-
|
|
18
|
-
.nav-item.ancestor {
|
|
19
|
-
@include typography.font-heading-s;
|
|
20
|
-
margin-inline-start: 24px;
|
|
21
|
-
margin-block-start: 12px;
|
|
22
|
-
margin-block-end: 4px;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.nav-link {
|
|
26
|
-
text-decoration: none;
|
|
27
|
-
display: flex;
|
|
28
|
-
padding-block: 8px;
|
|
29
|
-
padding-inline-start: 24px;
|
|
30
|
-
color: var(--color-tertiary);
|
|
31
|
-
|
|
32
|
-
&:hover {
|
|
33
|
-
text-decoration: underline;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.nav-item.selected:not(.expandable) {
|
|
38
|
-
position: relative;
|
|
39
|
-
|
|
40
|
-
&::before {
|
|
41
|
-
content: "";
|
|
42
|
-
position: absolute;
|
|
43
|
-
left: 0;
|
|
44
|
-
top: 0;
|
|
45
|
-
bottom: 0;
|
|
46
|
-
width: 4px;
|
|
47
|
-
background-color: var(--color-primary);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
.nav-item.expandable > a {
|
|
52
|
-
justify-content: space-between;
|
|
53
|
-
|
|
54
|
-
&::after {
|
|
55
|
-
@include icons.icon-caret-right;
|
|
56
|
-
background-color: var(--color-tertiary);
|
|
57
|
-
align-self: center;
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
.nav-item.expandable.expanded > a {
|
|
62
|
-
@include typography.font-heading-xs;
|
|
63
|
-
color: var(--color-text);
|
|
64
|
-
|
|
65
|
-
&::after {
|
|
66
|
-
@include icons.icon-caret-down;
|
|
67
|
-
background-color: var(--color-text);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
&:hover {
|
|
71
|
-
text-decoration: none;
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
ul {
|
|
76
|
-
margin-inline-start: 0;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.nav-list {
|
|
80
|
-
margin-inline-start: 24px;
|
|
81
|
-
}
|
|
82
17
|
}
|
|
83
18
|
}
|
|
84
19
|
|
|
@@ -87,38 +22,26 @@
|
|
|
87
22
|
.kth-local-navigation--mobile {
|
|
88
23
|
h2 {
|
|
89
24
|
@include typography.font-heading-s;
|
|
90
|
-
margin-inline-start: spacing.$space-24;
|
|
91
25
|
margin-block-start: spacing.$space-12;
|
|
92
26
|
margin-block-end: spacing.$space-4;
|
|
93
27
|
}
|
|
94
28
|
|
|
95
|
-
h3,
|
|
96
|
-
h4,
|
|
97
|
-
h5 {
|
|
98
|
-
@include typography.font-heading-xs;
|
|
99
|
-
margin-block: spacing.$space-8;
|
|
100
|
-
}
|
|
101
|
-
|
|
102
29
|
ul {
|
|
103
30
|
list-style: none;
|
|
104
31
|
padding: 0;
|
|
105
32
|
margin: 0;
|
|
106
|
-
margin-inline-start: spacing.$space-8;
|
|
107
|
-
}
|
|
108
33
|
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
&__submenu ul {
|
|
114
|
-
margin-inline-start: 0;
|
|
34
|
+
&.kth-local-navigation__submenu,
|
|
35
|
+
&.kth-local-navigation--mobile__submenu {
|
|
36
|
+
margin-inline-start: spacing.$space-16;
|
|
37
|
+
}
|
|
115
38
|
}
|
|
116
39
|
|
|
117
40
|
a:not(.kth-button) {
|
|
118
41
|
text-decoration: none;
|
|
119
42
|
display: flex;
|
|
120
43
|
padding-block: spacing.$space-8;
|
|
121
|
-
padding-inline-start: spacing.$space-
|
|
44
|
+
padding-inline-start: spacing.$space-12;
|
|
122
45
|
}
|
|
123
46
|
|
|
124
47
|
a:hover {
|
|
@@ -136,6 +59,10 @@
|
|
|
136
59
|
align-self: center;
|
|
137
60
|
}
|
|
138
61
|
|
|
62
|
+
a.expandable.expanded::after {
|
|
63
|
+
rotate: 90deg;
|
|
64
|
+
}
|
|
65
|
+
|
|
139
66
|
a[aria-current="page"] {
|
|
140
67
|
position: relative;
|
|
141
68
|
|