@entur/layout 3.2.1 → 3.2.3-beta.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.
Files changed (2) hide show
  1. package/dist/styles.css +1149 -1023
  2. package/package.json +4 -4
package/dist/styles.css CHANGED
@@ -1,1048 +1,1174 @@
1
- /* DO NOT CHANGE!*/
2
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. *//* DO NOT CHANGE!*/
3
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
4
- /* DO NOT CHANGE!*/
5
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
6
- /* DO NOT CHANGE!*/
7
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
8
1
  [data-color-mode=light],
9
- :root {
10
- --components-layout-badge-information-contrast-border: rgba(255, 255, 255, 0);
11
- --components-layout-badge-information-contrast-bullet: #64b3e7;
12
- --components-layout-badge-information-contrast-fill: #64b3e7;
13
- --components-layout-badge-information-contrast-text: #181c56;
14
- --components-layout-badge-information-contrast-text-bullet: #ffffff;
15
- --components-layout-badge-information-standard-border: #067eb2;
16
- --components-layout-badge-information-standard-bullet: #067eb2;
17
- --components-layout-badge-information-standard-fill: #e1eff8;
18
- --components-layout-badge-information-standard-text: #181c56;
19
- --components-layout-badge-information-standard-text-bullet: #181c56;
20
- --components-layout-badge-negative-contrast-border: rgba(255, 255, 255, 0);
21
- --components-layout-badge-negative-contrast-bullet: #ff5959;
22
- --components-layout-badge-negative-contrast-fill: #ff9494;
23
- --components-layout-badge-negative-contrast-text: #181c56;
24
- --components-layout-badge-negative-contrast-text-bullet: #ffffff;
25
- --components-layout-badge-negative-standard-border: #d31b1b;
26
- --components-layout-badge-negative-standard-bullet: #d31b1b;
27
- --components-layout-badge-negative-standard-fill: #ffcece;
28
- --components-layout-badge-negative-standard-text: #181c56;
29
- --components-layout-badge-negative-standard-text-bullet: #181c56;
30
- --components-layout-badge-neutral-contrast-border: rgba(255, 255, 255, 0);
31
- --components-layout-badge-neutral-contrast-bullet: #c7cdeb;
32
- --components-layout-badge-neutral-contrast-fill: #54568c;
33
- --components-layout-badge-neutral-contrast-text: #ffffff;
34
- --components-layout-badge-neutral-contrast-text-bullet: #ffffff;
35
- --components-layout-badge-neutral-standard-border: #949699;
36
- --components-layout-badge-neutral-standard-bullet: #81828f;
37
- --components-layout-badge-neutral-standard-fill: #f6f6f9;
38
- --components-layout-badge-neutral-standard-text: #181c56;
39
- --components-layout-badge-neutral-standard-text-bullet: #181c56;
40
- --components-layout-badge-primary-contrast-bullet: #aeb7e2;
41
- --components-layout-badge-primary-contrast-fill: #aeb7e2;
42
- --components-layout-badge-primary-contrast-text: #181c56;
43
- --components-layout-badge-primary-contrast-text-bullet: #ffffff;
44
- --components-layout-badge-primary-standard-bullet: #181c56;
45
- --components-layout-badge-primary-standard-fill: #181c56;
46
- --components-layout-badge-primary-standard-text: #ffffff;
47
- --components-layout-badge-primary-standard-text-bullet: #181c56;
48
- --components-layout-badge-success-contrast-border: rgba(255, 255, 255, 0);
49
- --components-layout-badge-success-contrast-bullet: #5ac39a;
50
- --components-layout-badge-success-contrast-fill: #5ac39a;
51
- --components-layout-badge-success-contrast-text: #181c56;
52
- --components-layout-badge-success-contrast-text-bullet: #ffffff;
53
- --components-layout-badge-success-standard-border: #1a8e60;
54
- --components-layout-badge-success-standard-bullet: #1a8e60;
55
- --components-layout-badge-success-standard-fill: #d0f1e3;
56
- --components-layout-badge-success-standard-text: #181c56;
57
- --components-layout-badge-success-standard-text-bullet: #181c56;
58
- --components-layout-badge-tag-contrast-fill: #393d79;
59
- --components-layout-badge-tag-contrast-icon: #ffffff;
60
- --components-layout-badge-tag-contrast-text: #ffffff;
61
- --components-layout-badge-tag-standard-fill: #f2f5f7;
62
- --components-layout-badge-tag-standard-icon: #181c56;
63
- --components-layout-badge-tag-standard-text: #181c56;
64
- --components-layout-badge-warning-contrast-border: rgba(255, 255, 255, 0);
65
- --components-layout-badge-warning-contrast-bullet: #ffe082;
66
- --components-layout-badge-warning-contrast-fill: #ffe082;
67
- --components-layout-badge-warning-contrast-text: #181c56;
68
- --components-layout-badge-warning-contrast-text-bullet: #ffffff;
69
- --components-layout-badge-warning-standard-border: #e9b10c;
70
- --components-layout-badge-warning-standard-bullet: #ffca28;
71
- --components-layout-badge-warning-standard-fill: #fff4cd;
72
- --components-layout-badge-warning-standard-text: #181c56;
73
- --components-layout-badge-warning-standard-text-bullet: #181c56;
74
- --components-layout-card-contrast-border-default: rgba(255, 255, 255, 0);
75
- --components-layout-card-contrast-border-active: #aeb7e2;
76
- --components-layout-card-contrast-divide: #ff5959;
77
- --components-layout-card-contrast-fill-default-solid: #393d79;
78
- --components-layout-card-contrast-fill-default-transparent: #393d79;
79
- --components-layout-card-contrast-fill-hoveractive: #54568c;
80
- --components-layout-card-contrast-icon: #ffffff;
81
- --components-layout-card-contrast-shadowlayer1: rgba(255, 255, 255, 0);
82
- --components-layout-card-contrast-shadowlayer2: rgba(255, 255, 255, 0);
83
- --components-layout-card-contrast-shadowlayer3: rgba(255, 255, 255, 0);
84
- --components-layout-card-contrast-subjecttext: #d9dae8;
85
- --components-layout-card-contrast-text: #ffffff;
86
- --components-layout-card-standard-border-default: #e3e6e8;
87
- --components-layout-card-standard-border-active: #181c56;
88
- --components-layout-card-standard-divide: #ff5959;
89
- --components-layout-card-standard-fill-default-solid: #ffffff;
90
- --components-layout-card-standard-fill-default-transparent: #ffffff;
91
- --components-layout-card-standard-fill-hoveractive: #f6f6f9;
92
- --components-layout-card-standard-icon: #181c56;
93
- --components-layout-card-standard-shadowlayer1: rgba(204, 205, 212, 0.3019607843);
94
- --components-layout-card-standard-shadowlayer2: rgba(229, 229, 233, 0.3490196078);
95
- --components-layout-card-standard-shadowlayer3: rgba(229, 229, 233, 0.1490196078);
96
- --components-layout-card-standard-subjecttext: #626493;
97
- --components-layout-card-standard-text: #181c56;
2
+ :root{
3
+ --components-layout-badge-information-contrast-border:rgba(255, 255, 255, 0);
4
+ --components-layout-badge-information-contrast-bullet:#64b3e7;
5
+ --components-layout-badge-information-contrast-fill:#64b3e7;
6
+ --components-layout-badge-information-contrast-text:#181c56;
7
+ --components-layout-badge-information-contrast-text-bullet:#ffffff;
8
+ --components-layout-badge-information-standard-border:#067eb2;
9
+ --components-layout-badge-information-standard-bullet:#067eb2;
10
+ --components-layout-badge-information-standard-fill:#e1eff8;
11
+ --components-layout-badge-information-standard-text:#181c56;
12
+ --components-layout-badge-information-standard-text-bullet:#181c56;
13
+ --components-layout-badge-negative-contrast-border:rgba(255, 255, 255, 0);
14
+ --components-layout-badge-negative-contrast-bullet:#ff5959;
15
+ --components-layout-badge-negative-contrast-fill:#ff9494;
16
+ --components-layout-badge-negative-contrast-text:#181c56;
17
+ --components-layout-badge-negative-contrast-text-bullet:#ffffff;
18
+ --components-layout-badge-negative-standard-border:#d31b1b;
19
+ --components-layout-badge-negative-standard-bullet:#d31b1b;
20
+ --components-layout-badge-negative-standard-fill:#ffcece;
21
+ --components-layout-badge-negative-standard-text:#181c56;
22
+ --components-layout-badge-negative-standard-text-bullet:#181c56;
23
+ --components-layout-badge-neutral-contrast-border:rgba(255, 255, 255, 0);
24
+ --components-layout-badge-neutral-contrast-bullet:#c7cdeb;
25
+ --components-layout-badge-neutral-contrast-fill:#54568c;
26
+ --components-layout-badge-neutral-contrast-text:#ffffff;
27
+ --components-layout-badge-neutral-contrast-text-bullet:#ffffff;
28
+ --components-layout-badge-neutral-standard-border:#949699;
29
+ --components-layout-badge-neutral-standard-bullet:#81828f;
30
+ --components-layout-badge-neutral-standard-fill:#f6f6f9;
31
+ --components-layout-badge-neutral-standard-text:#181c56;
32
+ --components-layout-badge-neutral-standard-text-bullet:#181c56;
33
+ --components-layout-badge-primary-contrast-bullet:#aeb7e2;
34
+ --components-layout-badge-primary-contrast-fill:#aeb7e2;
35
+ --components-layout-badge-primary-contrast-text:#181c56;
36
+ --components-layout-badge-primary-contrast-text-bullet:#ffffff;
37
+ --components-layout-badge-primary-standard-bullet:#181c56;
38
+ --components-layout-badge-primary-standard-fill:#181c56;
39
+ --components-layout-badge-primary-standard-text:#ffffff;
40
+ --components-layout-badge-primary-standard-text-bullet:#181c56;
41
+ --components-layout-badge-success-contrast-border:rgba(255, 255, 255, 0);
42
+ --components-layout-badge-success-contrast-bullet:#5ac39a;
43
+ --components-layout-badge-success-contrast-fill:#5ac39a;
44
+ --components-layout-badge-success-contrast-text:#181c56;
45
+ --components-layout-badge-success-contrast-text-bullet:#ffffff;
46
+ --components-layout-badge-success-standard-border:#1a8e60;
47
+ --components-layout-badge-success-standard-bullet:#1a8e60;
48
+ --components-layout-badge-success-standard-fill:#d0f1e3;
49
+ --components-layout-badge-success-standard-text:#181c56;
50
+ --components-layout-badge-success-standard-text-bullet:#181c56;
51
+ --components-layout-badge-tag-contrast-fill:#393d79;
52
+ --components-layout-badge-tag-contrast-icon:#ffffff;
53
+ --components-layout-badge-tag-contrast-text:#ffffff;
54
+ --components-layout-badge-tag-standard-fill:#f2f5f7;
55
+ --components-layout-badge-tag-standard-icon:#181c56;
56
+ --components-layout-badge-tag-standard-text:#181c56;
57
+ --components-layout-badge-warning-contrast-border:rgba(255, 255, 255, 0);
58
+ --components-layout-badge-warning-contrast-bullet:#ffe082;
59
+ --components-layout-badge-warning-contrast-fill:#ffe082;
60
+ --components-layout-badge-warning-contrast-text:#181c56;
61
+ --components-layout-badge-warning-contrast-text-bullet:#ffffff;
62
+ --components-layout-badge-warning-standard-border:#e9b10c;
63
+ --components-layout-badge-warning-standard-bullet:#ffca28;
64
+ --components-layout-badge-warning-standard-fill:#fff4cd;
65
+ --components-layout-badge-warning-standard-text:#181c56;
66
+ --components-layout-badge-warning-standard-text-bullet:#181c56;
67
+ --components-layout-card-contrast-border-default:rgba(255, 255, 255, 0);
68
+ --components-layout-card-contrast-border-active:#aeb7e2;
69
+ --components-layout-card-contrast-divide:#ff5959;
70
+ --components-layout-card-contrast-fill-default-solid:#393d79;
71
+ --components-layout-card-contrast-fill-default-transparent:#393d79;
72
+ --components-layout-card-contrast-fill-hoveractive:#54568c;
73
+ --components-layout-card-contrast-icon:#ffffff;
74
+ --components-layout-card-contrast-shadowlayer1:rgba(255, 255, 255, 0);
75
+ --components-layout-card-contrast-shadowlayer2:rgba(255, 255, 255, 0);
76
+ --components-layout-card-contrast-shadowlayer3:rgba(255, 255, 255, 0);
77
+ --components-layout-card-contrast-subjecttext:#d9dae8;
78
+ --components-layout-card-contrast-text:#ffffff;
79
+ --components-layout-card-standard-border-default:#e3e6e8;
80
+ --components-layout-card-standard-border-active:#181c56;
81
+ --components-layout-card-standard-divide:#ff5959;
82
+ --components-layout-card-standard-fill-default-solid:#ffffff;
83
+ --components-layout-card-standard-fill-default-transparent:#ffffff;
84
+ --components-layout-card-standard-fill-hoveractive:#f6f6f9;
85
+ --components-layout-card-standard-icon:#181c56;
86
+ --components-layout-card-standard-shadowlayer1:rgba(204, 205, 212, 0.3019607843);
87
+ --components-layout-card-standard-shadowlayer2:rgba(229, 229, 233, 0.3490196078);
88
+ --components-layout-card-standard-shadowlayer3:rgba(229, 229, 233, 0.1490196078);
89
+ --components-layout-card-standard-subjecttext:#626493;
90
+ --components-layout-card-standard-text:#181c56;
98
91
  }
99
92
 
100
- [data-color-mode=dark] {
101
- --components-layout-badge-information-contrast-border: rgba(255, 255, 255, 0);
102
- --components-layout-badge-information-contrast-bullet: #acd7f1;
103
- --components-layout-badge-information-contrast-fill: #acd7f1;
104
- --components-layout-badge-information-contrast-text: #08091c;
105
- --components-layout-badge-information-contrast-text-bullet: #e5e5e9;
106
- --components-layout-badge-information-standard-border: rgba(255, 255, 255, 0);
107
- --components-layout-badge-information-standard-bullet: #acd7f1;
108
- --components-layout-badge-information-standard-fill: #acd7f1;
109
- --components-layout-badge-information-standard-text: #08091c;
110
- --components-layout-badge-information-standard-text-bullet: #e5e5e9;
111
- --components-layout-badge-negative-contrast-border: rgba(255, 255, 255, 0);
112
- --components-layout-badge-negative-contrast-bullet: #ff9494;
113
- --components-layout-badge-negative-contrast-fill: #ffcece;
114
- --components-layout-badge-negative-contrast-text: #08091c;
115
- --components-layout-badge-negative-contrast-text-bullet: #e5e5e9;
116
- --components-layout-badge-negative-standard-border: rgba(255, 255, 255, 0);
117
- --components-layout-badge-negative-standard-bullet: #ff9494;
118
- --components-layout-badge-negative-standard-fill: #ffcece;
119
- --components-layout-badge-negative-standard-text: #08091c;
120
- --components-layout-badge-negative-standard-text-bullet: #e5e5e9;
121
- --components-layout-badge-neutral-contrast-border: rgba(255, 255, 255, 0);
122
- --components-layout-badge-neutral-contrast-bullet: #e5e5e9;
123
- --components-layout-badge-neutral-contrast-fill: rgba(229, 229, 233, 0.3490196078);
124
- --components-layout-badge-neutral-contrast-text: #e5e5e9;
125
- --components-layout-badge-neutral-contrast-text-bullet: #e5e5e9;
126
- --components-layout-badge-neutral-standard-border: rgba(255, 255, 255, 0);
127
- --components-layout-badge-neutral-standard-bullet: #e5e5e9;
128
- --components-layout-badge-neutral-standard-fill: rgba(229, 229, 233, 0.3490196078);
129
- --components-layout-badge-neutral-standard-text: #e5e5e9;
130
- --components-layout-badge-neutral-standard-text-bullet: #e5e5e9;
131
- --components-layout-badge-primary-contrast-bullet: #aeb7e2;
132
- --components-layout-badge-primary-contrast-fill: #aeb7e2;
133
- --components-layout-badge-primary-contrast-text: #08091c;
134
- --components-layout-badge-primary-contrast-text-bullet: #e5e5e9;
135
- --components-layout-badge-primary-standard-bullet: #aeb7e2;
136
- --components-layout-badge-primary-standard-fill: #aeb7e2;
137
- --components-layout-badge-primary-standard-text: #08091c;
138
- --components-layout-badge-primary-standard-text-bullet: #e5e5e9;
139
- --components-layout-badge-success-contrast-border: rgba(255, 255, 255, 0);
140
- --components-layout-badge-success-contrast-bullet: #9cd9c2;
141
- --components-layout-badge-success-contrast-fill: #9cd9c2;
142
- --components-layout-badge-success-contrast-text: #08091c;
143
- --components-layout-badge-success-contrast-text-bullet: #e5e5e9;
144
- --components-layout-badge-success-standard-border: rgba(255, 255, 255, 0);
145
- --components-layout-badge-success-standard-bullet: #9cd9c2;
146
- --components-layout-badge-success-standard-fill: #9cd9c2;
147
- --components-layout-badge-success-standard-text: #08091c;
148
- --components-layout-badge-success-standard-text-bullet: #e5e5e9;
149
- --components-layout-badge-tag-contrast-fill: #2d2e3e;
150
- --components-layout-badge-tag-contrast-icon: #e5e5e9;
151
- --components-layout-badge-tag-contrast-text: #e5e5e9;
152
- --components-layout-badge-tag-standard-fill: #2d2e3e;
153
- --components-layout-badge-tag-standard-icon: #e5e5e9;
154
- --components-layout-badge-tag-standard-text: #e5e5e9;
155
- --components-layout-badge-warning-contrast-border: rgba(255, 255, 255, 0);
156
- --components-layout-badge-warning-contrast-bullet: #ffeeb3;
157
- --components-layout-badge-warning-contrast-fill: #ffeeb3;
158
- --components-layout-badge-warning-contrast-text: #08091c;
159
- --components-layout-badge-warning-contrast-text-bullet: #e5e5e9;
160
- --components-layout-badge-warning-standard-border: rgba(255, 255, 255, 0);
161
- --components-layout-badge-warning-standard-bullet: #ffeeb3;
162
- --components-layout-badge-warning-standard-fill: #ffeeb3;
163
- --components-layout-badge-warning-standard-text: #08091c;
164
- --components-layout-badge-warning-standard-text-bullet: #e5e5e9;
165
- --components-layout-card-contrast-border-default: rgba(255, 255, 255, 0);
166
- --components-layout-card-contrast-border-active: #b3b4bd;
167
- --components-layout-card-contrast-divide: #ff5959;
168
- --components-layout-card-contrast-fill-default-solid: #393a49;
169
- --components-layout-card-contrast-fill-default-transparent: rgba(229, 229, 233, 0.1490196078);
170
- --components-layout-card-contrast-fill-hoveractive: #464755;
171
- --components-layout-card-contrast-icon: #e5e5e9;
172
- --components-layout-card-contrast-shadowlayer1: rgba(255, 255, 255, 0);
173
- --components-layout-card-contrast-shadowlayer2: rgba(255, 255, 255, 0);
174
- --components-layout-card-contrast-shadowlayer3: rgba(255, 255, 255, 0);
175
- --components-layout-card-contrast-subjecttext: #b3b4bd;
176
- --components-layout-card-contrast-text: #e5e5e9;
177
- --components-layout-card-standard-border-default: rgba(255, 255, 255, 0);
178
- --components-layout-card-standard-border-active: #b3b4bd;
179
- --components-layout-card-standard-divide: #ff5959;
180
- --components-layout-card-standard-fill-default-solid: #393a49;
181
- --components-layout-card-standard-fill-default-transparent: rgba(229, 229, 233, 0.1490196078);
182
- --components-layout-card-standard-fill-hoveractive: #464755;
183
- --components-layout-card-standard-icon: #e5e5e9;
184
- --components-layout-card-standard-shadowlayer1: rgba(255, 255, 255, 0);
185
- --components-layout-card-standard-shadowlayer2: rgba(255, 255, 255, 0);
186
- --components-layout-card-standard-shadowlayer3: rgba(255, 255, 255, 0);
187
- --components-layout-card-standard-subjecttext: #b3b4bd;
188
- --components-layout-card-standard-text: #e5e5e9;
93
+ [data-color-mode=dark]{
94
+ --components-layout-badge-information-contrast-border:rgba(255, 255, 255, 0);
95
+ --components-layout-badge-information-contrast-bullet:#acd7f1;
96
+ --components-layout-badge-information-contrast-fill:#acd7f1;
97
+ --components-layout-badge-information-contrast-text:#08091c;
98
+ --components-layout-badge-information-contrast-text-bullet:#e5e5e9;
99
+ --components-layout-badge-information-standard-border:rgba(255, 255, 255, 0);
100
+ --components-layout-badge-information-standard-bullet:#acd7f1;
101
+ --components-layout-badge-information-standard-fill:#acd7f1;
102
+ --components-layout-badge-information-standard-text:#08091c;
103
+ --components-layout-badge-information-standard-text-bullet:#e5e5e9;
104
+ --components-layout-badge-negative-contrast-border:rgba(255, 255, 255, 0);
105
+ --components-layout-badge-negative-contrast-bullet:#ff9494;
106
+ --components-layout-badge-negative-contrast-fill:#ffcece;
107
+ --components-layout-badge-negative-contrast-text:#08091c;
108
+ --components-layout-badge-negative-contrast-text-bullet:#e5e5e9;
109
+ --components-layout-badge-negative-standard-border:rgba(255, 255, 255, 0);
110
+ --components-layout-badge-negative-standard-bullet:#ff9494;
111
+ --components-layout-badge-negative-standard-fill:#ffcece;
112
+ --components-layout-badge-negative-standard-text:#08091c;
113
+ --components-layout-badge-negative-standard-text-bullet:#e5e5e9;
114
+ --components-layout-badge-neutral-contrast-border:rgba(255, 255, 255, 0);
115
+ --components-layout-badge-neutral-contrast-bullet:#e5e5e9;
116
+ --components-layout-badge-neutral-contrast-fill:rgba(229, 229, 233, 0.3490196078);
117
+ --components-layout-badge-neutral-contrast-text:#e5e5e9;
118
+ --components-layout-badge-neutral-contrast-text-bullet:#e5e5e9;
119
+ --components-layout-badge-neutral-standard-border:rgba(255, 255, 255, 0);
120
+ --components-layout-badge-neutral-standard-bullet:#e5e5e9;
121
+ --components-layout-badge-neutral-standard-fill:rgba(229, 229, 233, 0.3490196078);
122
+ --components-layout-badge-neutral-standard-text:#e5e5e9;
123
+ --components-layout-badge-neutral-standard-text-bullet:#e5e5e9;
124
+ --components-layout-badge-primary-contrast-bullet:#aeb7e2;
125
+ --components-layout-badge-primary-contrast-fill:#aeb7e2;
126
+ --components-layout-badge-primary-contrast-text:#08091c;
127
+ --components-layout-badge-primary-contrast-text-bullet:#e5e5e9;
128
+ --components-layout-badge-primary-standard-bullet:#aeb7e2;
129
+ --components-layout-badge-primary-standard-fill:#aeb7e2;
130
+ --components-layout-badge-primary-standard-text:#08091c;
131
+ --components-layout-badge-primary-standard-text-bullet:#e5e5e9;
132
+ --components-layout-badge-success-contrast-border:rgba(255, 255, 255, 0);
133
+ --components-layout-badge-success-contrast-bullet:#9cd9c2;
134
+ --components-layout-badge-success-contrast-fill:#9cd9c2;
135
+ --components-layout-badge-success-contrast-text:#08091c;
136
+ --components-layout-badge-success-contrast-text-bullet:#e5e5e9;
137
+ --components-layout-badge-success-standard-border:rgba(255, 255, 255, 0);
138
+ --components-layout-badge-success-standard-bullet:#9cd9c2;
139
+ --components-layout-badge-success-standard-fill:#9cd9c2;
140
+ --components-layout-badge-success-standard-text:#08091c;
141
+ --components-layout-badge-success-standard-text-bullet:#e5e5e9;
142
+ --components-layout-badge-tag-contrast-fill:#2d2e3e;
143
+ --components-layout-badge-tag-contrast-icon:#e5e5e9;
144
+ --components-layout-badge-tag-contrast-text:#e5e5e9;
145
+ --components-layout-badge-tag-standard-fill:#2d2e3e;
146
+ --components-layout-badge-tag-standard-icon:#e5e5e9;
147
+ --components-layout-badge-tag-standard-text:#e5e5e9;
148
+ --components-layout-badge-warning-contrast-border:rgba(255, 255, 255, 0);
149
+ --components-layout-badge-warning-contrast-bullet:#ffeeb3;
150
+ --components-layout-badge-warning-contrast-fill:#ffeeb3;
151
+ --components-layout-badge-warning-contrast-text:#08091c;
152
+ --components-layout-badge-warning-contrast-text-bullet:#e5e5e9;
153
+ --components-layout-badge-warning-standard-border:rgba(255, 255, 255, 0);
154
+ --components-layout-badge-warning-standard-bullet:#ffeeb3;
155
+ --components-layout-badge-warning-standard-fill:#ffeeb3;
156
+ --components-layout-badge-warning-standard-text:#08091c;
157
+ --components-layout-badge-warning-standard-text-bullet:#e5e5e9;
158
+ --components-layout-card-contrast-border-default:rgba(255, 255, 255, 0);
159
+ --components-layout-card-contrast-border-active:#b3b4bd;
160
+ --components-layout-card-contrast-divide:#ff5959;
161
+ --components-layout-card-contrast-fill-default-solid:#393a49;
162
+ --components-layout-card-contrast-fill-default-transparent:rgba(229, 229, 233, 0.1490196078);
163
+ --components-layout-card-contrast-fill-hoveractive:#464755;
164
+ --components-layout-card-contrast-icon:#e5e5e9;
165
+ --components-layout-card-contrast-shadowlayer1:rgba(255, 255, 255, 0);
166
+ --components-layout-card-contrast-shadowlayer2:rgba(255, 255, 255, 0);
167
+ --components-layout-card-contrast-shadowlayer3:rgba(255, 255, 255, 0);
168
+ --components-layout-card-contrast-subjecttext:#b3b4bd;
169
+ --components-layout-card-contrast-text:#e5e5e9;
170
+ --components-layout-card-standard-border-default:rgba(255, 255, 255, 0);
171
+ --components-layout-card-standard-border-active:#b3b4bd;
172
+ --components-layout-card-standard-divide:#ff5959;
173
+ --components-layout-card-standard-fill-default-solid:#393a49;
174
+ --components-layout-card-standard-fill-default-transparent:rgba(229, 229, 233, 0.1490196078);
175
+ --components-layout-card-standard-fill-hoveractive:#464755;
176
+ --components-layout-card-standard-icon:#e5e5e9;
177
+ --components-layout-card-standard-shadowlayer1:rgba(255, 255, 255, 0);
178
+ --components-layout-card-standard-shadowlayer2:rgba(255, 255, 255, 0);
179
+ --components-layout-card-standard-shadowlayer3:rgba(255, 255, 255, 0);
180
+ --components-layout-card-standard-subjecttext:#b3b4bd;
181
+ --components-layout-card-standard-text:#e5e5e9;
189
182
  }
190
-
191
- /* DO NOT CHANGE!*/
192
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
193
- /* DO NOT CHANGE!*/
194
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
195
183
  [data-color-mode=light],
196
- :root {
197
- --basecolors-frame-contrast: #181c56;
198
- --basecolors-frame-contrastalt: #393d79;
199
- --basecolors-frame-contrastalt-2: #292b6a;
200
- --basecolors-frame-default: #ffffff;
201
- --basecolors-frame-elevated: #ffffff;
202
- --basecolors-frame-elevatedalt: #f6f6f9;
203
- --basecolors-frame-subdued: #d9dae8;
204
- --basecolors-frame-tint: #f6f6f9;
205
- --basecolors-shape-accent: #181c56;
206
- --basecolors-shape-bicycle-contrast: #00db9b;
207
- --basecolors-shape-bicycle-default: #33826b;
208
- --basecolors-shape-bus-contrast: #ff6392;
209
- --basecolors-shape-bus-default: #c5044e;
210
- --basecolors-shape-cableway-contrast: #b482fb;
211
- --basecolors-shape-cableway-default: #78469a;
212
- --basecolors-shape-disabled: #6e6f73;
213
- --basecolors-shape-disabledalt: #b6b8ba;
214
- --basecolors-shape-ferry-contrast: #6fdfff;
215
- --basecolors-shape-ferry-default: #0c6693;
216
- --basecolors-shape-funicular-contrast: #b482fb;
217
- --basecolors-shape-funicular-default: #78469a;
218
- --basecolors-shape-helicopter-contrast: #fbafea;
219
- --basecolors-shape-helicopter-default: #800664;
220
- --basecolors-shape-highlight: #ff5959;
221
- --basecolors-shape-light: #ffffff;
222
- --basecolors-shape-mask: #ffffff;
223
- --basecolors-shape-maskalt: #ffffff;
224
- --basecolors-shape-metro-contrast: #f08901;
225
- --basecolors-shape-metro-default: #bf5826;
226
- --basecolors-shape-mobility-contrast: #00db9b;
227
- --basecolors-shape-mobility-default: #33826b;
228
- --basecolors-shape-plane-contrast: #fbafea;
229
- --basecolors-shape-plane-default: #800664;
230
- --basecolors-shape-subdued: #626493;
231
- --basecolors-shape-subduedalt: #d9dae8;
232
- --basecolors-shape-taxi-contrast: #ffe082;
233
- --basecolors-shape-taxi-default: #3d3e40;
234
- --basecolors-shape-train-contrast: #42a5f5;
235
- --basecolors-shape-train-default: #00367f;
236
- --basecolors-shape-tram-contrast: #b482fb;
237
- --basecolors-shape-tram-default: #78469a;
238
- --basecolors-shape-walk-contrast: #8284ab;
239
- --basecolors-shape-walk-default: #8d8e9c;
240
- --basecolors-shape-airportlinkbus-contrast: #fbafea;
241
- --basecolors-shape-airportlinkbus-default: #800664;
242
- --basecolors-shape-airportlinkrail-contrast: #fbafea;
243
- --basecolors-shape-airportlinkrail-default: #800664;
244
- --basecolors-stroke-contrast: #aeb7e2;
245
- --basecolors-stroke-default: #181c56;
246
- --basecolors-stroke-disabled: #949699;
247
- --basecolors-stroke-focus-contrast: #aeb7e2;
248
- --basecolors-stroke-focus-standard: #181c56;
249
- --basecolors-stroke-highlight: #ff5959;
250
- --basecolors-stroke-light: #ffffff;
251
- --basecolors-stroke-subdued: #8284ab;
252
- --basecolors-stroke-subduedalt: #e3e6e8;
253
- --basecolors-text-accent: #181c56;
254
- --basecolors-text-disabled: #6e6f73;
255
- --basecolors-text-disabledalt: #b6b8ba;
256
- --basecolors-text-highlight: #ff5959;
257
- --basecolors-text-light: #ffffff;
258
- --basecolors-text-subdued: #626493;
259
- --basecolors-text-subduedalt: #d9dae8;
184
+ :root{
185
+ --basecolors-frame-contrast:#181c56;
186
+ --basecolors-frame-contrastalt:#393d79;
187
+ --basecolors-frame-contrastalt-2:#292b6a;
188
+ --basecolors-frame-default:#ffffff;
189
+ --basecolors-frame-elevated:#ffffff;
190
+ --basecolors-frame-elevatedalt:#f6f6f9;
191
+ --basecolors-frame-subdued:#d9dae8;
192
+ --basecolors-frame-tint:#f6f6f9;
193
+ --basecolors-shape-accent:#181c56;
194
+ --basecolors-shape-bicycle-contrast:#00db9b;
195
+ --basecolors-shape-bicycle-default:#33826b;
196
+ --basecolors-shape-bus-contrast:#ff6392;
197
+ --basecolors-shape-bus-default:#c5044e;
198
+ --basecolors-shape-cableway-contrast:#b482fb;
199
+ --basecolors-shape-cableway-default:#78469a;
200
+ --basecolors-shape-disabled:#6e6f73;
201
+ --basecolors-shape-disabledalt:#b6b8ba;
202
+ --basecolors-shape-ferry-contrast:#6fdfff;
203
+ --basecolors-shape-ferry-default:#0c6693;
204
+ --basecolors-shape-funicular-contrast:#b482fb;
205
+ --basecolors-shape-funicular-default:#78469a;
206
+ --basecolors-shape-helicopter-contrast:#fbafea;
207
+ --basecolors-shape-helicopter-default:#800664;
208
+ --basecolors-shape-highlight:#ff5959;
209
+ --basecolors-shape-light:#ffffff;
210
+ --basecolors-shape-mask:#ffffff;
211
+ --basecolors-shape-maskalt:#ffffff;
212
+ --basecolors-shape-metro-contrast:#f08901;
213
+ --basecolors-shape-metro-default:#bf5826;
214
+ --basecolors-shape-mobility-contrast:#00db9b;
215
+ --basecolors-shape-mobility-default:#33826b;
216
+ --basecolors-shape-plane-contrast:#fbafea;
217
+ --basecolors-shape-plane-default:#800664;
218
+ --basecolors-shape-subdued:#626493;
219
+ --basecolors-shape-subduedalt:#d9dae8;
220
+ --basecolors-shape-taxi-contrast:#ffe082;
221
+ --basecolors-shape-taxi-default:#3d3e40;
222
+ --basecolors-shape-train-contrast:#42a5f5;
223
+ --basecolors-shape-train-default:#00367f;
224
+ --basecolors-shape-tram-contrast:#b482fb;
225
+ --basecolors-shape-tram-default:#78469a;
226
+ --basecolors-shape-walk-contrast:#8284ab;
227
+ --basecolors-shape-walk-default:#8d8e9c;
228
+ --basecolors-shape-airportlinkbus-contrast:#fbafea;
229
+ --basecolors-shape-airportlinkbus-default:#800664;
230
+ --basecolors-shape-airportlinkrail-contrast:#fbafea;
231
+ --basecolors-shape-airportlinkrail-default:#800664;
232
+ --basecolors-stroke-contrast:#aeb7e2;
233
+ --basecolors-stroke-default:#181c56;
234
+ --basecolors-stroke-disabled:#949699;
235
+ --basecolors-stroke-focus-contrast:#aeb7e2;
236
+ --basecolors-stroke-focus-standard:#181c56;
237
+ --basecolors-stroke-highlight:#ff5959;
238
+ --basecolors-stroke-light:#ffffff;
239
+ --basecolors-stroke-subdued:#8284ab;
240
+ --basecolors-stroke-subduedalt:#e3e6e8;
241
+ --basecolors-text-accent:#181c56;
242
+ --basecolors-text-disabled:#6e6f73;
243
+ --basecolors-text-disabledalt:#b6b8ba;
244
+ --basecolors-text-highlight:#ff5959;
245
+ --basecolors-text-light:#ffffff;
246
+ --basecolors-text-subdued:#626493;
247
+ --basecolors-text-subduedalt:#d9dae8;
260
248
  }
261
249
 
262
- [data-color-mode=dark] {
263
- --basecolors-frame-contrast: #212233;
264
- --basecolors-frame-contrastalt: #141527;
265
- --basecolors-frame-contrastalt-2: #08091c;
266
- --basecolors-frame-default: #08091c;
267
- --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
268
- --basecolors-frame-elevatedalt: #464755;
269
- --basecolors-frame-subdued: #2d2e3e;
270
- --basecolors-frame-tint: #141527;
271
- --basecolors-shape-accent: #e5e5e9;
272
- --basecolors-shape-bicycle-contrast: #4db295;
273
- --basecolors-shape-bicycle-default: #4db295;
274
- --basecolors-shape-bus-contrast: #ef7398;
275
- --basecolors-shape-bus-default: #ef7398;
276
- --basecolors-shape-cableway-contrast: #b898e5;
277
- --basecolors-shape-cableway-default: #b898e5;
278
- --basecolors-shape-disabled: #b6b8ba;
279
- --basecolors-shape-disabledalt: #b3b4bd;
280
- --basecolors-shape-ferry-contrast: #8ccfe2;
281
- --basecolors-shape-ferry-default: #8ccfe2;
282
- --basecolors-shape-funicular-contrast: #b898e5;
283
- --basecolors-shape-funicular-default: #b898e5;
284
- --basecolors-shape-helicopter-contrast: #f2b8e5;
285
- --basecolors-shape-helicopter-default: #f2b8e5;
286
- --basecolors-shape-highlight: #ff9494;
287
- --basecolors-shape-light: #e5e5e9;
288
- --basecolors-shape-mask: #2d2e3e;
289
- --basecolors-shape-maskalt: #393a49;
290
- --basecolors-shape-metro-contrast: #dd973c;
291
- --basecolors-shape-metro-default: #dd973c;
292
- --basecolors-shape-mobility-contrast: #4db295;
293
- --basecolors-shape-mobility-default: #4db295;
294
- --basecolors-shape-plane-contrast: #f2b8e5;
295
- --basecolors-shape-plane-default: #f2b8e5;
296
- --basecolors-shape-subdued: #b3b4bd;
297
- --basecolors-shape-subduedalt: #b3b4bd;
298
- --basecolors-shape-taxi-contrast: #ffe082;
299
- --basecolors-shape-taxi-default: #ffe082;
300
- --basecolors-shape-train-contrast: #60a2d7;
301
- --basecolors-shape-train-default: #60a2d7;
302
- --basecolors-shape-tram-contrast: #b898e5;
303
- --basecolors-shape-tram-default: #b898e5;
304
- --basecolors-shape-walk-contrast: #8d8e9c;
305
- --basecolors-shape-walk-default: #8d8e9c;
306
- --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
307
- --basecolors-shape-airportlinkbus-default: #f2b8e5;
308
- --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
309
- --basecolors-shape-airportlinkrail-default: #f2b8e5;
310
- --basecolors-stroke-contrast: #aeb7e2;
311
- --basecolors-stroke-default: #b3b4bd;
312
- --basecolors-stroke-disabled: #e3e6e8;
313
- --basecolors-stroke-focus-contrast: #aeb7e2;
314
- --basecolors-stroke-focus-standard: #aeb7e2;
315
- --basecolors-stroke-highlight: #ff9494;
316
- --basecolors-stroke-light: #b3b4bd;
317
- --basecolors-stroke-subdued: #81828f;
318
- --basecolors-stroke-subduedalt: #949699;
319
- --basecolors-text-accent: #e5e5e9;
320
- --basecolors-text-disabled: #b6b8ba;
321
- --basecolors-text-disabledalt: #b6b8ba;
322
- --basecolors-text-highlight: #ff9494;
323
- --basecolors-text-light: #e5e5e9;
324
- --basecolors-text-subdued: #b3b4bd;
325
- --basecolors-text-subduedalt: #b3b4bd;
250
+ [data-color-mode=dark]{
251
+ --basecolors-frame-contrast:#212233;
252
+ --basecolors-frame-contrastalt:#141527;
253
+ --basecolors-frame-contrastalt-2:#08091c;
254
+ --basecolors-frame-default:#08091c;
255
+ --basecolors-frame-elevated:rgba(229, 229, 233, 0.1490196078);
256
+ --basecolors-frame-elevatedalt:#464755;
257
+ --basecolors-frame-subdued:#2d2e3e;
258
+ --basecolors-frame-tint:#141527;
259
+ --basecolors-shape-accent:#e5e5e9;
260
+ --basecolors-shape-bicycle-contrast:#4db295;
261
+ --basecolors-shape-bicycle-default:#4db295;
262
+ --basecolors-shape-bus-contrast:#ef7398;
263
+ --basecolors-shape-bus-default:#ef7398;
264
+ --basecolors-shape-cableway-contrast:#b898e5;
265
+ --basecolors-shape-cableway-default:#b898e5;
266
+ --basecolors-shape-disabled:#b6b8ba;
267
+ --basecolors-shape-disabledalt:#b3b4bd;
268
+ --basecolors-shape-ferry-contrast:#8ccfe2;
269
+ --basecolors-shape-ferry-default:#8ccfe2;
270
+ --basecolors-shape-funicular-contrast:#b898e5;
271
+ --basecolors-shape-funicular-default:#b898e5;
272
+ --basecolors-shape-helicopter-contrast:#f2b8e5;
273
+ --basecolors-shape-helicopter-default:#f2b8e5;
274
+ --basecolors-shape-highlight:#ff9494;
275
+ --basecolors-shape-light:#e5e5e9;
276
+ --basecolors-shape-mask:#2d2e3e;
277
+ --basecolors-shape-maskalt:#393a49;
278
+ --basecolors-shape-metro-contrast:#dd973c;
279
+ --basecolors-shape-metro-default:#dd973c;
280
+ --basecolors-shape-mobility-contrast:#4db295;
281
+ --basecolors-shape-mobility-default:#4db295;
282
+ --basecolors-shape-plane-contrast:#f2b8e5;
283
+ --basecolors-shape-plane-default:#f2b8e5;
284
+ --basecolors-shape-subdued:#b3b4bd;
285
+ --basecolors-shape-subduedalt:#b3b4bd;
286
+ --basecolors-shape-taxi-contrast:#ffe082;
287
+ --basecolors-shape-taxi-default:#ffe082;
288
+ --basecolors-shape-train-contrast:#60a2d7;
289
+ --basecolors-shape-train-default:#60a2d7;
290
+ --basecolors-shape-tram-contrast:#b898e5;
291
+ --basecolors-shape-tram-default:#b898e5;
292
+ --basecolors-shape-walk-contrast:#8d8e9c;
293
+ --basecolors-shape-walk-default:#8d8e9c;
294
+ --basecolors-shape-airportlinkbus-contrast:#f2b8e5;
295
+ --basecolors-shape-airportlinkbus-default:#f2b8e5;
296
+ --basecolors-shape-airportlinkrail-contrast:#f2b8e5;
297
+ --basecolors-shape-airportlinkrail-default:#f2b8e5;
298
+ --basecolors-stroke-contrast:#aeb7e2;
299
+ --basecolors-stroke-default:#b3b4bd;
300
+ --basecolors-stroke-disabled:#e3e6e8;
301
+ --basecolors-stroke-focus-contrast:#aeb7e2;
302
+ --basecolors-stroke-focus-standard:#aeb7e2;
303
+ --basecolors-stroke-highlight:#ff9494;
304
+ --basecolors-stroke-light:#b3b4bd;
305
+ --basecolors-stroke-subdued:#81828f;
306
+ --basecolors-stroke-subduedalt:#949699;
307
+ --basecolors-text-accent:#e5e5e9;
308
+ --basecolors-text-disabled:#b6b8ba;
309
+ --basecolors-text-disabledalt:#b6b8ba;
310
+ --basecolors-text-highlight:#ff9494;
311
+ --basecolors-text-light:#e5e5e9;
312
+ --basecolors-text-subdued:#b3b4bd;
313
+ --basecolors-text-subduedalt:#b3b4bd;
326
314
  }
327
315
 
328
- :root {
329
- --eds-layout: 1;
330
- }/* DO NOT CHANGE!*/
331
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
332
- /* DO NOT CHANGE!*/
333
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
334
- :root {
335
- --blue-10: #f6f6f9;
336
- --blue-100: #292b6a;
337
- --blue-20: #eaeaf1;
338
- --blue-30: #d9dae8;
339
- --blue-40: #bcbdd2;
340
- --blue-50: #9ea0bd;
341
- --blue-60: #8284ab;
342
- --blue-70: #626493;
343
- --blue-80: #54568c;
344
- --blue-90: #393d79;
345
- --canary-10: #fffbeb;
346
- --canary-100: #483705;
347
- --canary-20: #fff4cd;
348
- --canary-30: #ffeeb3;
349
- --canary-40: #ffe082;
350
- --canary-50: #ffda6b;
351
- --canary-60: #ffca28;
352
- --canary-70: #e9b10c;
353
- --canary-80: #b38909;
354
- --canary-90: #775b09;
355
- --coral-10: #ffe5e5;
356
- --coral-100: #370606;
357
- --coral-20: #ffcece;
358
- --coral-30: #ff9494;
359
- --coral-40: #ff5959;
360
- --coral-50: #f73e3b;
361
- --coral-60: #d31b1b;
362
- --coral-70: #b31414;
363
- --coral-80: #8a1414;
364
- --coral-90: #5d0e0e;
365
- --ebony-10: #e5e5e9;
366
- --ebony-100: #08091c;
367
- --ebony-15: #d8d9df;
368
- --ebony-20: #cccdd4;
369
- --ebony-25: #bfc0c8;
370
- --ebony-30: #b3b4bd;
371
- --ebony-35: #a6a7b2;
372
- --ebony-40: #999aa7;
373
- --ebony-45: #8d8e9c;
374
- --ebony-5: #f2f2f5;
375
- --ebony-50: #81828f;
376
- --ebony-55: #757584;
377
- --ebony-60: #6a6b78;
378
- --ebony-65: #5e5f6c;
379
- --ebony-70: #525360;
380
- --ebony-75: #464755;
381
- --ebony-80: #393a49;
382
- --ebony-85: #2d2e3e;
383
- --ebony-90: #212233;
384
- --ebony-95: #141527;
385
- --grey-10: #f2f5f7;
386
- --grey-100: #262729;
387
- --grey-110: #101112;
388
- --grey-20: #edf0f2;
389
- --grey-30: #e3e6e8;
390
- --grey-40: #cfd2d4;
391
- --grey-50: #b6b8ba;
392
- --grey-60: #949699;
393
- --grey-70: #6e6f73;
394
- --grey-80: #515254;
395
- --grey-90: #3d3e40;
396
- --lavender-10: #f0f1fa;
397
- --lavender-100: #11143c;
398
- --lavender-20: #d9ddf2;
399
- --lavender-30: #c7cdeb;
400
- --lavender-40: #aeb7e2;
401
- --lavender-50: #8794d4;
402
- --lavender-60: #5a68c4;
403
- --lavender-70: #3b46ab;
404
- --lavender-80: #262f7d;
405
- --lavender-90: #181c56;
406
- --mint-10: #e6f6f0;
407
- --mint-100: #022015;
408
- --mint-20: #d0f1e3;
409
- --mint-30: #9cd9c2;
410
- --mint-40: #5ac39a;
411
- --mint-50: #37ab83;
412
- --mint-60: #1a8e60;
413
- --mint-70: #068152;
414
- --mint-80: #05613e;
415
- --mint-90: #034029;
416
- --peach-10: #fff1eb;
417
- --peach-100: #3a1503;
418
- --peach-20: #ffe4d6;
419
- --peach-30: #ffd3bd;
420
- --peach-40: #ffbf9e;
421
- --peach-50: #fd9a68;
422
- --peach-60: #fd7835;
423
- --peach-70: #e6560f;
424
- --peach-80: #ae4009;
425
- --peach-90: #742b06;
426
- --sky-10: #e1eff8;
427
- --sky-100: #011a23;
428
- --sky-20: #acd7f1;
429
- --sky-30: #64b3e7;
430
- --sky-40: #2d98d2;
431
- --sky-50: #067eb2;
432
- --sky-60: #046690;
433
- --sky-70: #044d6c;
434
- --sky-80: #003852;
435
- --sky-90: #022536;
436
- --transparent-blue-alpha10: #9ea0bd1a;
437
- --transparent-blue-alpha40: #54568c66;
438
- --transparent-canary-alpha25: #ffe08240;
439
- --transparent-canary-alpha30: #fff4cd4d;
440
- --transparent-coral-alpha20: #ff949433;
441
- --transparent-ebony-alpha15: #e5e5e926;
442
- --transparent-ebony-alpha20: #cccdd44d;
443
- --transparent-ebony-alpha25: #e5e5e940;
444
- --transparent-ebony-alpha35: #e5e5e959;
445
- --transparent-lavender-alpha70: #aeb7e2b2;
446
- --transparent-mint-alpha20: #5ac39a33;
447
- --transparent-neutral-alpha10: #cfd2d41a;
448
- --transparent-neutral-alpha15: #cfd2d426;
449
- --transparent-neutral-alpha20: #26272933;
450
- --transparent-peach-alpha70: #ffbf9eb2;
451
- --transparent-sky-alpha20: #2d98d233;
452
- --white-alpha-0: #ffffff00;
453
- --white-alpha-10: #ffffff1a;
454
- --white-alpha-100: #ffffff;
455
- --white-alpha-20: #ffffff33;
456
- --white-alpha-30: #ffffff4d;
457
- --white-alpha-40: #ffffff66;
458
- --white-alpha-50: #ffffff80;
459
- --white-alpha-60: #ffffff99;
460
- --white-alpha-70: #ffffffb2;
461
- --white-alpha-80: #ffffffcc;
462
- --white-alpha-90: #ffffffe5;
316
+ :root{
317
+ --eds-layout:1;
318
+ }:root{
319
+ --blue-10:#f6f6f9;
320
+ --blue-100:#292b6a;
321
+ --blue-20:#eaeaf1;
322
+ --blue-30:#d9dae8;
323
+ --blue-40:#bcbdd2;
324
+ --blue-50:#9ea0bd;
325
+ --blue-60:#8284ab;
326
+ --blue-70:#626493;
327
+ --blue-80:#54568c;
328
+ --blue-90:#393d79;
329
+ --canary-10:#fffbeb;
330
+ --canary-100:#483705;
331
+ --canary-20:#fff4cd;
332
+ --canary-30:#ffeeb3;
333
+ --canary-40:#ffe082;
334
+ --canary-50:#ffda6b;
335
+ --canary-60:#ffca28;
336
+ --canary-70:#e9b10c;
337
+ --canary-80:#b38909;
338
+ --canary-90:#775b09;
339
+ --coral-10:#ffe5e5;
340
+ --coral-100:#370606;
341
+ --coral-20:#ffcece;
342
+ --coral-30:#ff9494;
343
+ --coral-40:#ff5959;
344
+ --coral-50:#f73e3b;
345
+ --coral-60:#d31b1b;
346
+ --coral-70:#b31414;
347
+ --coral-80:#8a1414;
348
+ --coral-90:#5d0e0e;
349
+ --ebony-10:#e5e5e9;
350
+ --ebony-100:#08091c;
351
+ --ebony-15:#d8d9df;
352
+ --ebony-20:#cccdd4;
353
+ --ebony-25:#bfc0c8;
354
+ --ebony-30:#b3b4bd;
355
+ --ebony-35:#a6a7b2;
356
+ --ebony-40:#999aa7;
357
+ --ebony-45:#8d8e9c;
358
+ --ebony-5:#f2f2f5;
359
+ --ebony-50:#81828f;
360
+ --ebony-55:#757584;
361
+ --ebony-60:#6a6b78;
362
+ --ebony-65:#5e5f6c;
363
+ --ebony-70:#525360;
364
+ --ebony-75:#464755;
365
+ --ebony-80:#393a49;
366
+ --ebony-85:#2d2e3e;
367
+ --ebony-90:#212233;
368
+ --ebony-95:#141527;
369
+ --grey-10:#f2f5f7;
370
+ --grey-100:#262729;
371
+ --grey-110:#101112;
372
+ --grey-20:#edf0f2;
373
+ --grey-30:#e3e6e8;
374
+ --grey-40:#cfd2d4;
375
+ --grey-50:#b6b8ba;
376
+ --grey-60:#949699;
377
+ --grey-70:#6e6f73;
378
+ --grey-80:#515254;
379
+ --grey-90:#3d3e40;
380
+ --lavender-10:#f0f1fa;
381
+ --lavender-100:#11143c;
382
+ --lavender-20:#d9ddf2;
383
+ --lavender-30:#c7cdeb;
384
+ --lavender-40:#aeb7e2;
385
+ --lavender-50:#8794d4;
386
+ --lavender-60:#5a68c4;
387
+ --lavender-70:#3b46ab;
388
+ --lavender-80:#262f7d;
389
+ --lavender-90:#181c56;
390
+ --mint-10:#e6f6f0;
391
+ --mint-100:#022015;
392
+ --mint-20:#d0f1e3;
393
+ --mint-30:#9cd9c2;
394
+ --mint-40:#5ac39a;
395
+ --mint-50:#37ab83;
396
+ --mint-60:#1a8e60;
397
+ --mint-70:#068152;
398
+ --mint-80:#05613e;
399
+ --mint-90:#034029;
400
+ --peach-10:#fff1eb;
401
+ --peach-100:#3a1503;
402
+ --peach-20:#ffe4d6;
403
+ --peach-30:#ffd3bd;
404
+ --peach-40:#ffbf9e;
405
+ --peach-50:#fd9a68;
406
+ --peach-60:#fd7835;
407
+ --peach-70:#e6560f;
408
+ --peach-80:#ae4009;
409
+ --peach-90:#742b06;
410
+ --sky-10:#e1eff8;
411
+ --sky-100:#011a23;
412
+ --sky-20:#acd7f1;
413
+ --sky-30:#64b3e7;
414
+ --sky-40:#2d98d2;
415
+ --sky-50:#067eb2;
416
+ --sky-60:#046690;
417
+ --sky-70:#044d6c;
418
+ --sky-80:#003852;
419
+ --sky-90:#022536;
420
+ --transparent-blue-alpha10:rgba(158,160,189,0.10196);
421
+ --transparent-blue-alpha40:rgba(84,86,140,0.4);
422
+ --transparent-canary-alpha25:rgba(255,224,130,0.25098);
423
+ --transparent-canary-alpha30:rgba(255,244,205,0.30196);
424
+ --transparent-coral-alpha20:rgba(255,148,148,0.2);
425
+ --transparent-ebony-alpha15:rgba(229,229,233,0.14902);
426
+ --transparent-ebony-alpha20:rgba(204,205,212,0.30196);
427
+ --transparent-ebony-alpha25:rgba(229,229,233,0.25098);
428
+ --transparent-ebony-alpha35:rgba(229,229,233,0.34902);
429
+ --transparent-lavender-alpha70:rgba(174,183,226,0.69804);
430
+ --transparent-mint-alpha20:rgba(90,195,154,0.2);
431
+ --transparent-neutral-alpha10:rgba(207,210,212,0.10196);
432
+ --transparent-neutral-alpha15:rgba(207,210,212,0.14902);
433
+ --transparent-neutral-alpha20:rgba(38,39,41,0.2);
434
+ --transparent-peach-alpha70:rgba(255,191,158,0.69804);
435
+ --transparent-sky-alpha20:rgba(45,152,210,0.2);
436
+ --white-alpha-0:rgba(255,255,255,0);
437
+ --white-alpha-10:rgba(255,255,255,0.10196);
438
+ --white-alpha-100:#ffffff;
439
+ --white-alpha-20:rgba(255,255,255,0.2);
440
+ --white-alpha-30:rgba(255,255,255,0.30196);
441
+ --white-alpha-40:rgba(255,255,255,0.4);
442
+ --white-alpha-50:rgba(255,255,255,0.50196);
443
+ --white-alpha-60:rgba(255,255,255,0.6);
444
+ --white-alpha-70:rgba(255,255,255,0.69804);
445
+ --white-alpha-80:rgba(255,255,255,0.8);
446
+ --white-alpha-90:rgba(255,255,255,0.89804);
463
447
  }
464
448
 
465
- .eds-base-card {
466
- display: flex;
467
- box-shadow: 6px 6px 10px 0px var(--components-layout-card-standard-shadowlayer3), 3px 3px 6px 0px var(--components-layout-card-standard-shadowlayer2), 1px 1px 2px 0px var(--components-layout-card-standard-shadowlayer1);
468
- background-color: var(--components-layout-card-standard-fill-default-solid);
469
- border: 0.0625rem solid var(--components-layout-card-standard-border-default);
470
- color: var(--components-layout-card-standard-text);
471
- border-radius: 0.25rem;
472
- align-items: flex-start;
473
- appearance: none;
474
- text-decoration: none;
475
- }
476
- .eds-contrast .eds-base-card {
477
- background-color: var(--components-layout-card-contrast-fill-default-solid);
478
- border-color: var(--components-layout-card-contrast-border-default);
479
- box-shadow: none;
480
- color: var(--components-layout-card-contrast-text);
481
- }/* DO NOT CHANGE!*/
482
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
483
- /* DO NOT CHANGE!*/
484
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
485
- :root {
486
- --blue-10: #f6f6f9;
487
- --blue-100: #292b6a;
488
- --blue-20: #eaeaf1;
489
- --blue-30: #d9dae8;
490
- --blue-40: #bcbdd2;
491
- --blue-50: #9ea0bd;
492
- --blue-60: #8284ab;
493
- --blue-70: #626493;
494
- --blue-80: #54568c;
495
- --blue-90: #393d79;
496
- --canary-10: #fffbeb;
497
- --canary-100: #483705;
498
- --canary-20: #fff4cd;
499
- --canary-30: #ffeeb3;
500
- --canary-40: #ffe082;
501
- --canary-50: #ffda6b;
502
- --canary-60: #ffca28;
503
- --canary-70: #e9b10c;
504
- --canary-80: #b38909;
505
- --canary-90: #775b09;
506
- --coral-10: #ffe5e5;
507
- --coral-100: #370606;
508
- --coral-20: #ffcece;
509
- --coral-30: #ff9494;
510
- --coral-40: #ff5959;
511
- --coral-50: #f73e3b;
512
- --coral-60: #d31b1b;
513
- --coral-70: #b31414;
514
- --coral-80: #8a1414;
515
- --coral-90: #5d0e0e;
516
- --ebony-10: #e5e5e9;
517
- --ebony-100: #08091c;
518
- --ebony-15: #d8d9df;
519
- --ebony-20: #cccdd4;
520
- --ebony-25: #bfc0c8;
521
- --ebony-30: #b3b4bd;
522
- --ebony-35: #a6a7b2;
523
- --ebony-40: #999aa7;
524
- --ebony-45: #8d8e9c;
525
- --ebony-5: #f2f2f5;
526
- --ebony-50: #81828f;
527
- --ebony-55: #757584;
528
- --ebony-60: #6a6b78;
529
- --ebony-65: #5e5f6c;
530
- --ebony-70: #525360;
531
- --ebony-75: #464755;
532
- --ebony-80: #393a49;
533
- --ebony-85: #2d2e3e;
534
- --ebony-90: #212233;
535
- --ebony-95: #141527;
536
- --grey-10: #f2f5f7;
537
- --grey-100: #262729;
538
- --grey-110: #101112;
539
- --grey-20: #edf0f2;
540
- --grey-30: #e3e6e8;
541
- --grey-40: #cfd2d4;
542
- --grey-50: #b6b8ba;
543
- --grey-60: #949699;
544
- --grey-70: #6e6f73;
545
- --grey-80: #515254;
546
- --grey-90: #3d3e40;
547
- --lavender-10: #f0f1fa;
548
- --lavender-100: #11143c;
549
- --lavender-20: #d9ddf2;
550
- --lavender-30: #c7cdeb;
551
- --lavender-40: #aeb7e2;
552
- --lavender-50: #8794d4;
553
- --lavender-60: #5a68c4;
554
- --lavender-70: #3b46ab;
555
- --lavender-80: #262f7d;
556
- --lavender-90: #181c56;
557
- --mint-10: #e6f6f0;
558
- --mint-100: #022015;
559
- --mint-20: #d0f1e3;
560
- --mint-30: #9cd9c2;
561
- --mint-40: #5ac39a;
562
- --mint-50: #37ab83;
563
- --mint-60: #1a8e60;
564
- --mint-70: #068152;
565
- --mint-80: #05613e;
566
- --mint-90: #034029;
567
- --peach-10: #fff1eb;
568
- --peach-100: #3a1503;
569
- --peach-20: #ffe4d6;
570
- --peach-30: #ffd3bd;
571
- --peach-40: #ffbf9e;
572
- --peach-50: #fd9a68;
573
- --peach-60: #fd7835;
574
- --peach-70: #e6560f;
575
- --peach-80: #ae4009;
576
- --peach-90: #742b06;
577
- --sky-10: #e1eff8;
578
- --sky-100: #011a23;
579
- --sky-20: #acd7f1;
580
- --sky-30: #64b3e7;
581
- --sky-40: #2d98d2;
582
- --sky-50: #067eb2;
583
- --sky-60: #046690;
584
- --sky-70: #044d6c;
585
- --sky-80: #003852;
586
- --sky-90: #022536;
587
- --transparent-blue-alpha10: #9ea0bd1a;
588
- --transparent-blue-alpha40: #54568c66;
589
- --transparent-canary-alpha25: #ffe08240;
590
- --transparent-canary-alpha30: #fff4cd4d;
591
- --transparent-coral-alpha20: #ff949433;
592
- --transparent-ebony-alpha15: #e5e5e926;
593
- --transparent-ebony-alpha20: #cccdd44d;
594
- --transparent-ebony-alpha25: #e5e5e940;
595
- --transparent-ebony-alpha35: #e5e5e959;
596
- --transparent-lavender-alpha70: #aeb7e2b2;
597
- --transparent-mint-alpha20: #5ac39a33;
598
- --transparent-neutral-alpha10: #cfd2d41a;
599
- --transparent-neutral-alpha15: #cfd2d426;
600
- --transparent-neutral-alpha20: #26272933;
601
- --transparent-peach-alpha70: #ffbf9eb2;
602
- --transparent-sky-alpha20: #2d98d233;
603
- --white-alpha-0: #ffffff00;
604
- --white-alpha-10: #ffffff1a;
605
- --white-alpha-100: #ffffff;
606
- --white-alpha-20: #ffffff33;
607
- --white-alpha-30: #ffffff4d;
608
- --white-alpha-40: #ffffff66;
609
- --white-alpha-50: #ffffff80;
610
- --white-alpha-60: #ffffff99;
611
- --white-alpha-70: #ffffffb2;
612
- --white-alpha-80: #ffffffcc;
613
- --white-alpha-90: #ffffffe5;
449
+ .eds-base-card{
450
+ display:-webkit-box;
451
+ display:-webkit-flex;
452
+ display:-moz-box;
453
+ display:flex;
454
+ -webkit-box-shadow:6px 6px 10px 0px var(--components-layout-card-standard-shadowlayer3), 3px 3px 6px 0px var(--components-layout-card-standard-shadowlayer2), 1px 1px 2px 0px var(--components-layout-card-standard-shadowlayer1);
455
+ -moz-box-shadow:6px 6px 10px 0px var(--components-layout-card-standard-shadowlayer3), 3px 3px 6px 0px var(--components-layout-card-standard-shadowlayer2), 1px 1px 2px 0px var(--components-layout-card-standard-shadowlayer1);
456
+ box-shadow:6px 6px 10px 0px var(--components-layout-card-standard-shadowlayer3), 3px 3px 6px 0px var(--components-layout-card-standard-shadowlayer2), 1px 1px 2px 0px var(--components-layout-card-standard-shadowlayer1);
457
+ background-color:var(--components-layout-card-standard-fill-default-solid);
458
+ border:0.0625rem solid var(--components-layout-card-standard-border-default);
459
+ color:var(--components-layout-card-standard-text);
460
+ -webkit-border-radius:0.25rem;
461
+ -moz-border-radius:0.25rem;
462
+ border-radius:0.25rem;
463
+ -webkit-box-align:start;
464
+ -webkit-align-items:flex-start;
465
+ -moz-box-align:start;
466
+ align-items:flex-start;
467
+ -webkit-appearance:none;
468
+ -moz-appearance:none;
469
+ appearance:none;
470
+ -webkit-text-decoration:none;
471
+ text-decoration:none;
472
+ }
473
+ .eds-contrast .eds-base-card{
474
+ background-color:var(--components-layout-card-contrast-fill-default-solid);
475
+ border-color:var(--components-layout-card-contrast-border-default);
476
+ -webkit-box-shadow:none;
477
+ -moz-box-shadow:none;
478
+ box-shadow:none;
479
+ color:var(--components-layout-card-contrast-text);
480
+ }:root{
481
+ --blue-10:#f6f6f9;
482
+ --blue-100:#292b6a;
483
+ --blue-20:#eaeaf1;
484
+ --blue-30:#d9dae8;
485
+ --blue-40:#bcbdd2;
486
+ --blue-50:#9ea0bd;
487
+ --blue-60:#8284ab;
488
+ --blue-70:#626493;
489
+ --blue-80:#54568c;
490
+ --blue-90:#393d79;
491
+ --canary-10:#fffbeb;
492
+ --canary-100:#483705;
493
+ --canary-20:#fff4cd;
494
+ --canary-30:#ffeeb3;
495
+ --canary-40:#ffe082;
496
+ --canary-50:#ffda6b;
497
+ --canary-60:#ffca28;
498
+ --canary-70:#e9b10c;
499
+ --canary-80:#b38909;
500
+ --canary-90:#775b09;
501
+ --coral-10:#ffe5e5;
502
+ --coral-100:#370606;
503
+ --coral-20:#ffcece;
504
+ --coral-30:#ff9494;
505
+ --coral-40:#ff5959;
506
+ --coral-50:#f73e3b;
507
+ --coral-60:#d31b1b;
508
+ --coral-70:#b31414;
509
+ --coral-80:#8a1414;
510
+ --coral-90:#5d0e0e;
511
+ --ebony-10:#e5e5e9;
512
+ --ebony-100:#08091c;
513
+ --ebony-15:#d8d9df;
514
+ --ebony-20:#cccdd4;
515
+ --ebony-25:#bfc0c8;
516
+ --ebony-30:#b3b4bd;
517
+ --ebony-35:#a6a7b2;
518
+ --ebony-40:#999aa7;
519
+ --ebony-45:#8d8e9c;
520
+ --ebony-5:#f2f2f5;
521
+ --ebony-50:#81828f;
522
+ --ebony-55:#757584;
523
+ --ebony-60:#6a6b78;
524
+ --ebony-65:#5e5f6c;
525
+ --ebony-70:#525360;
526
+ --ebony-75:#464755;
527
+ --ebony-80:#393a49;
528
+ --ebony-85:#2d2e3e;
529
+ --ebony-90:#212233;
530
+ --ebony-95:#141527;
531
+ --grey-10:#f2f5f7;
532
+ --grey-100:#262729;
533
+ --grey-110:#101112;
534
+ --grey-20:#edf0f2;
535
+ --grey-30:#e3e6e8;
536
+ --grey-40:#cfd2d4;
537
+ --grey-50:#b6b8ba;
538
+ --grey-60:#949699;
539
+ --grey-70:#6e6f73;
540
+ --grey-80:#515254;
541
+ --grey-90:#3d3e40;
542
+ --lavender-10:#f0f1fa;
543
+ --lavender-100:#11143c;
544
+ --lavender-20:#d9ddf2;
545
+ --lavender-30:#c7cdeb;
546
+ --lavender-40:#aeb7e2;
547
+ --lavender-50:#8794d4;
548
+ --lavender-60:#5a68c4;
549
+ --lavender-70:#3b46ab;
550
+ --lavender-80:#262f7d;
551
+ --lavender-90:#181c56;
552
+ --mint-10:#e6f6f0;
553
+ --mint-100:#022015;
554
+ --mint-20:#d0f1e3;
555
+ --mint-30:#9cd9c2;
556
+ --mint-40:#5ac39a;
557
+ --mint-50:#37ab83;
558
+ --mint-60:#1a8e60;
559
+ --mint-70:#068152;
560
+ --mint-80:#05613e;
561
+ --mint-90:#034029;
562
+ --peach-10:#fff1eb;
563
+ --peach-100:#3a1503;
564
+ --peach-20:#ffe4d6;
565
+ --peach-30:#ffd3bd;
566
+ --peach-40:#ffbf9e;
567
+ --peach-50:#fd9a68;
568
+ --peach-60:#fd7835;
569
+ --peach-70:#e6560f;
570
+ --peach-80:#ae4009;
571
+ --peach-90:#742b06;
572
+ --sky-10:#e1eff8;
573
+ --sky-100:#011a23;
574
+ --sky-20:#acd7f1;
575
+ --sky-30:#64b3e7;
576
+ --sky-40:#2d98d2;
577
+ --sky-50:#067eb2;
578
+ --sky-60:#046690;
579
+ --sky-70:#044d6c;
580
+ --sky-80:#003852;
581
+ --sky-90:#022536;
582
+ --transparent-blue-alpha10:rgba(158,160,189,0.10196);
583
+ --transparent-blue-alpha40:rgba(84,86,140,0.4);
584
+ --transparent-canary-alpha25:rgba(255,224,130,0.25098);
585
+ --transparent-canary-alpha30:rgba(255,244,205,0.30196);
586
+ --transparent-coral-alpha20:rgba(255,148,148,0.2);
587
+ --transparent-ebony-alpha15:rgba(229,229,233,0.14902);
588
+ --transparent-ebony-alpha20:rgba(204,205,212,0.30196);
589
+ --transparent-ebony-alpha25:rgba(229,229,233,0.25098);
590
+ --transparent-ebony-alpha35:rgba(229,229,233,0.34902);
591
+ --transparent-lavender-alpha70:rgba(174,183,226,0.69804);
592
+ --transparent-mint-alpha20:rgba(90,195,154,0.2);
593
+ --transparent-neutral-alpha10:rgba(207,210,212,0.10196);
594
+ --transparent-neutral-alpha15:rgba(207,210,212,0.14902);
595
+ --transparent-neutral-alpha20:rgba(38,39,41,0.2);
596
+ --transparent-peach-alpha70:rgba(255,191,158,0.69804);
597
+ --transparent-sky-alpha20:rgba(45,152,210,0.2);
598
+ --white-alpha-0:rgba(255,255,255,0);
599
+ --white-alpha-10:rgba(255,255,255,0.10196);
600
+ --white-alpha-100:#ffffff;
601
+ --white-alpha-20:rgba(255,255,255,0.2);
602
+ --white-alpha-30:rgba(255,255,255,0.30196);
603
+ --white-alpha-40:rgba(255,255,255,0.4);
604
+ --white-alpha-50:rgba(255,255,255,0.50196);
605
+ --white-alpha-60:rgba(255,255,255,0.6);
606
+ --white-alpha-70:rgba(255,255,255,0.69804);
607
+ --white-alpha-80:rgba(255,255,255,0.8);
608
+ --white-alpha-90:rgba(255,255,255,0.89804);
614
609
  }
615
610
 
616
- .eds-navigation-card {
617
- display: flex;
618
- flex-direction: column;
619
- padding: 2rem;
620
- position: relative;
621
- transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
622
- }
623
- .eds-navigation-card-header {
624
- display: flex;
625
- flex-direction: column;
626
- margin-bottom: 1rem;
627
- }
628
- .eds-navigation-card-header__content {
629
- display: flex;
630
- align-items: center;
631
- }
632
- .eds-navigation-card-header__title {
633
- font-size: 1.5rem;
634
- line-height: 1.875rem;
635
- font-weight: 600;
636
- }
637
- .eds-navigation-card-header__title-icon {
638
- font-size: 1.53125rem;
639
- margin-right: 0.75rem;
640
- }
641
- .eds-navigation-card-header__highlight {
642
- width: 2rem;
643
- height: 0.1875rem;
644
- background: var(--components-layout-card-standard-divide);
645
- opacity: var(--show-active-line);
646
- transition: width 0.2s ease-in-out;
647
- }
648
- .eds-navigation-card:hover {
649
- background-color: var(--components-layout-card-standard-fill-hoveractive);
650
- box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
651
- }
652
- .eds-navigation-card:hover:before {
653
- opacity: 1;
654
- }
655
- .eds-navigation-card:hover .eds-navigation-card-header__highlight {
656
- width: 5rem;
657
- }
658
- .eds-contrast .eds-navigation-card:hover {
659
- background-color: var(--components-layout-card-contrast-fill-hoveractive);
660
- box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
661
- }
662
- .eds-navigation-card:active {
663
- background-color: var(--components-layout-card-standard-fill-hoveractive);
664
- border: 1px solid var(--components-layout-card-standard-border-active);
665
- box-shadow: none;
666
- }
667
- .eds-contrast .eds-navigation-card:active {
668
- background-color: var(--components-layout-card-contrast-fill-hoveractive);
669
- border-color: var(--components-layout-card-contrast-border-active);
670
- box-shadow: none;
671
- }
672
- .eds-navigation-card:focus-visible {
673
- outline: 2px solid #181c56;
674
- outline-color: var(--basecolors-stroke-focus-standard);
675
- outline-offset: 0.125rem;
676
- }
677
- .eds-contrast .eds-navigation-card:focus-visible {
678
- outline-color: var(--basecolors-stroke-focus-contrast);
679
- }
680
- .eds-navigation-card__arrow-icon {
681
- margin-top: 0.5rem;
682
- }
683
- .eds-navigation-card--compact {
684
- padding: 1.5rem;
685
- }
686
- .eds-navigation-card--compact .eds-navigation-card-header {
687
- margin-bottom: 0;
688
- }
689
- .eds-navigation-card .eds-paragraph {
690
- margin-bottom: 0;
611
+ .eds-navigation-card{
612
+ display:-webkit-box;
613
+ display:-webkit-flex;
614
+ display:-moz-box;
615
+ display:flex;
616
+ -webkit-box-orient:vertical;
617
+ -webkit-box-direction:normal;
618
+ -webkit-flex-direction:column;
619
+ -moz-box-orient:vertical;
620
+ -moz-box-direction:normal;
621
+ flex-direction:column;
622
+ padding:2rem;
623
+ position:relative;
624
+ -webkit-transition:background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
625
+ transition:background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
626
+ -o-transition:box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -o-transform 0.1s ease-in-out;
627
+ -moz-transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -moz-transform 0.1s ease-in-out, -moz-box-shadow 0.1s ease-in-out;
628
+ transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
629
+ transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -moz-transform 0.1s ease-in-out, -o-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out, -moz-box-shadow 0.1s ease-in-out;
630
+ }
631
+ .eds-navigation-card-header{
632
+ display:-webkit-box;
633
+ display:-webkit-flex;
634
+ display:-moz-box;
635
+ display:flex;
636
+ -webkit-box-orient:vertical;
637
+ -webkit-box-direction:normal;
638
+ -webkit-flex-direction:column;
639
+ -moz-box-orient:vertical;
640
+ -moz-box-direction:normal;
641
+ flex-direction:column;
642
+ margin-bottom:1rem;
643
+ }
644
+ .eds-navigation-card-header__content{
645
+ display:-webkit-box;
646
+ display:-webkit-flex;
647
+ display:-moz-box;
648
+ display:flex;
649
+ -webkit-box-align:center;
650
+ -webkit-align-items:center;
651
+ -moz-box-align:center;
652
+ align-items:center;
653
+ }
654
+ .eds-navigation-card-header__title{
655
+ font-size:1.5rem;
656
+ line-height:1.875rem;
657
+ font-weight:600;
658
+ }
659
+ .eds-navigation-card-header__title-icon{
660
+ font-size:1.53125rem;
661
+ margin-right:0.75rem;
662
+ }
663
+ .eds-navigation-card-header__highlight{
664
+ width:2rem;
665
+ height:0.1875rem;
666
+ background:var(--components-layout-card-standard-divide);
667
+ opacity:var(--show-active-line);
668
+ -webkit-transition:width 0.2s ease-in-out;
669
+ -o-transition:width 0.2s ease-in-out;
670
+ -moz-transition:width 0.2s ease-in-out;
671
+ transition:width 0.2s ease-in-out;
672
+ }
673
+ .eds-navigation-card:hover{
674
+ background-color:var(--components-layout-card-standard-fill-hoveractive);
675
+ -webkit-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
676
+ -moz-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
677
+ box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
678
+ }
679
+ .eds-navigation-card:hover:before{
680
+ opacity:1;
681
+ }
682
+ .eds-navigation-card:hover .eds-navigation-card-header__highlight{
683
+ width:5rem;
684
+ }
685
+ .eds-contrast .eds-navigation-card:hover{
686
+ background-color:var(--components-layout-card-contrast-fill-hoveractive);
687
+ -webkit-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
688
+ -moz-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
689
+ box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
690
+ }
691
+ .eds-navigation-card:active{
692
+ background-color:var(--components-layout-card-standard-fill-hoveractive);
693
+ border:1px solid var(--components-layout-card-standard-border-active);
694
+ -webkit-box-shadow:none;
695
+ -moz-box-shadow:none;
696
+ box-shadow:none;
697
+ }
698
+ .eds-contrast .eds-navigation-card:active{
699
+ background-color:var(--components-layout-card-contrast-fill-hoveractive);
700
+ border-color:var(--components-layout-card-contrast-border-active);
701
+ -webkit-box-shadow:none;
702
+ -moz-box-shadow:none;
703
+ box-shadow:none;
704
+ }
705
+ .eds-navigation-card:focus-visible{
706
+ outline:2px solid #181c56;
707
+ outline-color:var(--basecolors-stroke-focus-standard);
708
+ outline-offset:0.125rem;
709
+ }
710
+ .eds-contrast .eds-navigation-card:focus-visible{
711
+ outline-color:var(--basecolors-stroke-focus-contrast);
712
+ }
713
+ .eds-navigation-card__arrow-icon{
714
+ margin-top:0.5rem;
715
+ }
716
+ .eds-navigation-card--compact{
717
+ padding:1.5rem;
718
+ }
719
+ .eds-navigation-card--compact .eds-navigation-card-header{
720
+ margin-bottom:0;
721
+ }
722
+ .eds-navigation-card .eds-paragraph{
723
+ margin-bottom:0;
691
724
  }
692
725
 
693
- @media (prefers-reduced-motion: reduce) {
694
- .eds-navigation-card {
695
- transition: none;
726
+ @media (prefers-reduced-motion: reduce){
727
+ .eds-navigation-card{
728
+ -webkit-transition:none;
729
+ -o-transition:none;
730
+ -moz-transition:none;
731
+ transition:none;
696
732
  }
697
- .eds-navigation-card-header__highlight {
698
- transition: none;
733
+ .eds-navigation-card-header__highlight{
734
+ -webkit-transition:none;
735
+ -o-transition:none;
736
+ -moz-transition:none;
737
+ transition:none;
699
738
  }
700
- .eds-navigation-card:hover {
701
- transform: none;
702
- box-shadow: none;
739
+ .eds-navigation-card:hover{
740
+ -webkit-transform:none;
741
+ -moz-transform:none;
742
+ -o-transform:none;
743
+ transform:none;
744
+ -webkit-box-shadow:none;
745
+ -moz-box-shadow:none;
746
+ box-shadow:none;
703
747
  }
704
- .eds-navigation-card:hover .eds-navigation-card-header__highlight {
705
- width: 2rem;
748
+ .eds-navigation-card:hover .eds-navigation-card-header__highlight{
749
+ width:2rem;
706
750
  }
707
- }/* DO NOT CHANGE!*/
708
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
709
- .eds-media-card {
710
- display: flex;
711
- align-items: stretch;
712
- gap: 1rem;
713
- flex-direction: column;
714
- overflow: hidden;
715
- position: relative;
716
- width: fit-content;
717
- background-color: var(--components-layout-card-standard-fill-default-solid);
718
- transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
719
- }
720
- .eds-contrast .eds-media-card {
721
- background-color: var(--components-layout-card-contrast-fill-default-solid);
722
- }
723
- .eds-media-card:hover {
724
- background-color: var(--components-layout-card-standard-fill-hoveractive);
725
- box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
726
- }
727
- .eds-contrast .eds-media-card:hover {
728
- background-color: var(--components-layout-card-contrast-fill-hoveractive);
729
- box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
730
- }
731
- .eds-media-card:has(:focus-visible) {
732
- outline: 2px solid #181c56;
733
- outline-color: var(--basecolors-stroke-focus-standard);
734
- outline-offset: 0.125rem;
735
- }
736
- .eds-contrast .eds-media-card:has(:focus-visible) {
737
- outline-color: var(--basecolors-stroke-focus-contrast);
738
- }
739
- .eds-media-card:active {
740
- background-color: var(--components-layout-card-standard-fill-hoveractive);
741
- border: 1px solid var(--components-layout-card-standard-border-active);
742
- box-shadow: none;
743
- }
744
- .eds-contrast .eds-media-card:active {
745
- background-color: var(--components-layout-card-contrast-fill-hoveractive);
746
- border-color: var(--components-layout-card-contrast-border-active);
747
- box-shadow: none;
748
- }
749
- .eds-media-card__media {
750
- max-height: 15rem;
751
- display: flex;
752
- align-items: center;
753
- justify-content: center;
754
- overflow: hidden;
755
- }
756
- .eds-media-card__media img {
757
- width: 100%;
758
- height: 100%;
759
- object-fit: cover;
760
- }
761
- .eds-media-card__text {
762
- appearance: none;
763
- width: 100%;
764
- color: inherit;
765
- display: flex;
766
- flex-direction: column;
767
- text-decoration: none;
768
- padding: 1.5rem 2rem 2rem 2rem;
769
- }
770
- .eds-media-card__text:focus {
771
- outline: none;
772
- }
773
- .eds-media-card__text__title {
774
- margin: 0.25rem 0 0.25rem;
775
- }
776
- .eds-media-card__text__title-link {
777
- appearance: none;
778
- all: unset;
779
- }
780
- .eds-media-card__text__title-link::after {
781
- position: absolute;
782
- content: "";
783
- top: 0;
784
- left: 0;
785
- bottom: 0;
786
- right: 0;
787
- cursor: pointer;
788
- }
789
- .eds-media-card__text__title-link:focus {
790
- outline: none;
791
- }
792
- .eds-media-card__arrow-icon {
793
- align-self: flex-end;
794
- margin: 1rem 0 1.5rem;
795
- }
796
- .eds-media-card--horizontal {
797
- flex-direction: row;
798
- gap: 0.75rem;
799
- }
800
- .eds-media-card--horizontal.eds-base-card {
801
- align-items: flex-start;
802
- }
803
- .eds-media-card--horizontal .eds-media-card__media {
804
- padding: 1.5rem 0 1.5rem 1.5rem;
805
- overflow: unset;
806
- }
807
- .eds-media-card--horizontal .eds-media-card__media img {
808
- width: 10rem;
809
- height: 10rem;
810
- }
811
- .eds-media-card--horizontal .eds-media-card__text {
812
- padding: 1.5rem 1.5rem 1.5rem 0;
813
- }
814
- .eds-media-card--horizontal .eds-media-card__text__title {
815
- margin: 0;
816
- }
817
- .eds-media-card--horizontal .eds-media-card__arrow-icon {
818
- margin: 0;
819
- }
820
- @media screen and (min-width: 50rem) {
821
- .eds-media-card--horizontal {
822
- gap: 1rem;
751
+ }.eds-media-card{
752
+ display:-webkit-box;
753
+ display:-webkit-flex;
754
+ display:-moz-box;
755
+ display:flex;
756
+ -webkit-box-align:stretch;
757
+ -webkit-align-items:stretch;
758
+ -moz-box-align:stretch;
759
+ align-items:stretch;
760
+ gap:1rem;
761
+ -webkit-box-orient:vertical;
762
+ -webkit-box-direction:normal;
763
+ -webkit-flex-direction:column;
764
+ -moz-box-orient:vertical;
765
+ -moz-box-direction:normal;
766
+ flex-direction:column;
767
+ overflow:hidden;
768
+ position:relative;
769
+ width:-webkit-fit-content;
770
+ width:-moz-fit-content;
771
+ width:fit-content;
772
+ background-color:var(--components-layout-card-standard-fill-default-solid);
773
+ -webkit-transition:background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
774
+ transition:background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
775
+ -o-transition:box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -o-transform 0.1s ease-in-out;
776
+ -moz-transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -moz-transform 0.1s ease-in-out, -moz-box-shadow 0.1s ease-in-out;
777
+ transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
778
+ transition:transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -moz-transform 0.1s ease-in-out, -o-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out, -moz-box-shadow 0.1s ease-in-out;
779
+ }
780
+ .eds-contrast .eds-media-card{
781
+ background-color:var(--components-layout-card-contrast-fill-default-solid);
782
+ }
783
+ .eds-media-card:hover{
784
+ background-color:var(--components-layout-card-standard-fill-hoveractive);
785
+ -webkit-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
786
+ -moz-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
787
+ box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
788
+ }
789
+ .eds-contrast .eds-media-card:hover{
790
+ background-color:var(--components-layout-card-contrast-fill-hoveractive);
791
+ -webkit-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
792
+ -moz-box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
793
+ box-shadow:0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
794
+ }
795
+ .eds-media-card:has(:focus-visible){
796
+ outline:2px solid #181c56;
797
+ outline-color:var(--basecolors-stroke-focus-standard);
798
+ outline-offset:0.125rem;
799
+ }
800
+ .eds-contrast .eds-media-card:has(:focus-visible){
801
+ outline-color:var(--basecolors-stroke-focus-contrast);
802
+ }
803
+ .eds-media-card:active{
804
+ background-color:var(--components-layout-card-standard-fill-hoveractive);
805
+ border:1px solid var(--components-layout-card-standard-border-active);
806
+ -webkit-box-shadow:none;
807
+ -moz-box-shadow:none;
808
+ box-shadow:none;
809
+ }
810
+ .eds-contrast .eds-media-card:active{
811
+ background-color:var(--components-layout-card-contrast-fill-hoveractive);
812
+ border-color:var(--components-layout-card-contrast-border-active);
813
+ -webkit-box-shadow:none;
814
+ -moz-box-shadow:none;
815
+ box-shadow:none;
816
+ }
817
+ .eds-media-card__media{
818
+ max-height:15rem;
819
+ display:-webkit-box;
820
+ display:-webkit-flex;
821
+ display:-moz-box;
822
+ display:flex;
823
+ -webkit-box-align:center;
824
+ -webkit-align-items:center;
825
+ -moz-box-align:center;
826
+ align-items:center;
827
+ -webkit-box-pack:center;
828
+ -webkit-justify-content:center;
829
+ -moz-box-pack:center;
830
+ justify-content:center;
831
+ overflow:hidden;
832
+ }
833
+ .eds-media-card__media img{
834
+ width:100%;
835
+ height:100%;
836
+ -o-object-fit:cover;
837
+ object-fit:cover;
838
+ }
839
+ .eds-media-card__text{
840
+ -webkit-appearance:none;
841
+ -moz-appearance:none;
842
+ appearance:none;
843
+ width:100%;
844
+ color:inherit;
845
+ display:-webkit-box;
846
+ display:-webkit-flex;
847
+ display:-moz-box;
848
+ display:flex;
849
+ -webkit-box-orient:vertical;
850
+ -webkit-box-direction:normal;
851
+ -webkit-flex-direction:column;
852
+ -moz-box-orient:vertical;
853
+ -moz-box-direction:normal;
854
+ flex-direction:column;
855
+ -webkit-text-decoration:none;
856
+ text-decoration:none;
857
+ padding:1.5rem 2rem 2rem 2rem;
858
+ }
859
+ .eds-media-card__text:focus{
860
+ outline:none;
861
+ }
862
+ .eds-media-card__text__title{
863
+ margin:0.25rem 0 0.25rem;
864
+ }
865
+ .eds-media-card__text__title-link{
866
+ -webkit-appearance:none;
867
+ -moz-appearance:none;
868
+ appearance:none;
869
+ all:unset;
870
+ }
871
+ .eds-media-card__text__title-link::after{
872
+ position:absolute;
873
+ content:"";
874
+ top:0;
875
+ left:0;
876
+ bottom:0;
877
+ right:0;
878
+ cursor:pointer;
879
+ }
880
+ .eds-media-card__text__title-link:focus{
881
+ outline:none;
882
+ }
883
+ .eds-media-card__arrow-icon{
884
+ -webkit-align-self:flex-end;
885
+ align-self:flex-end;
886
+ margin:1rem 0 1.5rem;
887
+ }
888
+ .eds-media-card--horizontal{
889
+ -webkit-box-orient:horizontal;
890
+ -webkit-box-direction:normal;
891
+ -webkit-flex-direction:row;
892
+ -moz-box-orient:horizontal;
893
+ -moz-box-direction:normal;
894
+ flex-direction:row;
895
+ gap:0.75rem;
896
+ }
897
+ .eds-media-card--horizontal.eds-base-card{
898
+ -webkit-box-align:start;
899
+ -webkit-align-items:flex-start;
900
+ -moz-box-align:start;
901
+ align-items:flex-start;
902
+ }
903
+ .eds-media-card--horizontal .eds-media-card__media{
904
+ padding:1.5rem 0 1.5rem 1.5rem;
905
+ overflow:visible;
906
+ overflow:initial;
907
+ }
908
+ .eds-media-card--horizontal .eds-media-card__media img{
909
+ width:10rem;
910
+ height:10rem;
911
+ }
912
+ .eds-media-card--horizontal .eds-media-card__text{
913
+ padding:1.5rem 1.5rem 1.5rem 0;
914
+ }
915
+ .eds-media-card--horizontal .eds-media-card__text__title{
916
+ margin:0;
917
+ }
918
+ .eds-media-card--horizontal .eds-media-card__arrow-icon{
919
+ margin:0;
920
+ }
921
+ @media screen and (min-width: 50rem){
922
+ .eds-media-card--horizontal{
923
+ gap:1rem;
823
924
  }
824
- .eds-media-card--horizontal.eds-base-card {
825
- align-items: center;
925
+ .eds-media-card--horizontal.eds-base-card{
926
+ -webkit-box-align:center;
927
+ -webkit-align-items:center;
928
+ -moz-box-align:center;
929
+ align-items:center;
826
930
  }
827
- .eds-media-card--horizontal.eds-base-card:has(.eds-media-card__arrow-icon) {
828
- align-items: flex-start;
931
+ .eds-media-card--horizontal.eds-base-card:has(.eds-media-card__arrow-icon){
932
+ -webkit-box-align:start;
933
+ -webkit-align-items:flex-start;
934
+ -moz-box-align:start;
935
+ align-items:flex-start;
829
936
  }
830
- .eds-media-card--horizontal .eds-media-card__media {
831
- padding: 2rem 0 2rem 2rem;
832
- width: 12.5rem;
937
+ .eds-media-card--horizontal .eds-media-card__media{
938
+ padding:2rem 0 2rem 2rem;
939
+ width:12.5rem;
833
940
  }
834
- .eds-media-card--horizontal .eds-media-card__text {
835
- padding: 2rem 2rem 2rem 0;
941
+ .eds-media-card--horizontal .eds-media-card__text{
942
+ padding:2rem 2rem 2rem 0;
836
943
  }
837
- }/* DO NOT CHANGE!*/
838
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
839
- .eds-badge {
840
- display: flex;
841
- justify-content: center;
842
- align-items: center;
843
- font-family: inherit;
844
- font-weight: 500;
845
- font-size: 0.75rem;
846
- min-width: 1.5rem;
847
- height: 1.5rem;
848
- width: fit-content;
849
- line-height: 1rem;
850
- padding: 2px 8px;
851
- border-radius: 0.75rem;
852
- top: 0;
853
- right: 0;
854
- opacity: 1;
855
- visibility: visible;
856
- color: var(--components-layout-badge-primary-standard-text);
857
- transition: opacity 0.2s ease-in-out, visibility 0s linear;
858
- }
859
- .eds-badge--hide {
860
- opacity: 0;
861
- visibility: hidden;
862
- transition: opacity 0.2s ease-in-out, visibility 0s linear 0.3s;
863
- }
864
- .eds-badge--variant-primary {
865
- background-color: var(--components-layout-badge-primary-standard-fill);
866
- color: var(--components-layout-badge-primary-standard-text);
867
- }
868
- .eds-contrast .eds-badge--variant-primary {
869
- color: var(--components-layout-badge-primary-contrast-text);
870
- background-color: var(--components-layout-badge-primary-contrast-fill);
871
- }
872
- .eds-badge--variant-primary.eds-badge--type-bullet::before {
873
- background-color: var(--components-layout-badge-primary-standard-bullet);
874
- }
875
- .eds-contrast .eds-badge--variant-primary.eds-badge--type-bullet::before {
876
- background-color: var(--components-layout-badge-primary-contrast-bullet);
877
- }
878
- .eds-badge--variant-success {
879
- background-color: var(--components-layout-badge-success-standard-fill);
880
- color: var(--components-layout-badge-success-standard-text);
881
- }
882
- .eds-contrast .eds-badge--variant-success {
883
- background-color: var(--components-layout-badge-success-contrast-fill);
884
- color: var(--components-layout-badge-success-contrast-text);
885
- }
886
- .eds-badge--variant-success.eds-badge--type-status, .eds-badge--variant-success.eds-badge--type-notification {
887
- border-color: var(--components-layout-badge-success-standard-border);
888
- }
889
- .eds-contrast .eds-badge--variant-success.eds-badge--type-status, .eds-contrast .eds-badge--variant-success.eds-badge--type-notification {
890
- border-color: var(--components-layout-badge-success-contrast-border);
891
- }
892
- .eds-badge--variant-success.eds-badge--type-bullet::before {
893
- background-color: var(--components-layout-badge-success-standard-bullet);
894
- }
895
- .eds-contrast .eds-badge--variant-success.eds-badge--type-bullet::before {
896
- background-color: var(--components-layout-badge-success-contrast-bullet);
897
- }
898
- .eds-badge--variant-warning {
899
- background-color: var(--components-layout-badge-warning-standard-fill);
900
- color: var(--components-layout-badge-warning-standard-text);
901
- }
902
- .eds-contrast .eds-badge--variant-warning {
903
- background-color: var(--components-layout-badge-warning-contrast-fill);
904
- color: var(--components-layout-badge-warning-contrast-text);
905
- }
906
- .eds-badge--variant-warning.eds-badge--type-status, .eds-badge--variant-warning.eds-badge--type-notification {
907
- border-color: var(--components-layout-badge-warning-standard-border);
908
- }
909
- .eds-contrast .eds-badge--variant-warning.eds-badge--type-status, .eds-contrast .eds-badge--variant-warning.eds-badge--type-notification {
910
- border-color: var(--components-layout-badge-warning-contrast-border);
911
- }
912
- .eds-badge--variant-warning.eds-badge--type-bullet::before {
913
- background-color: var(--components-layout-badge-warning-standard-bullet);
914
- }
915
- .eds-contrast .eds-badge--variant-warning.eds-badge--type-bullet::before {
916
- background-color: var(--components-layout-badge-warning-contrast-bullet);
917
- }
918
- .eds-badge--variant-danger, .eds-badge--variant-negative {
919
- background-color: var(--components-layout-badge-negative-standard-fill);
920
- color: var(--components-layout-badge-negative-standard-text);
921
- }
922
- .eds-contrast .eds-badge--variant-danger, .eds-contrast .eds-badge--variant-negative {
923
- background-color: var(--components-layout-badge-negative-contrast-fill);
924
- color: var(--components-layout-badge-negative-contrast-text);
925
- }
926
- .eds-badge--variant-danger.eds-badge--type-status, .eds-badge--variant-danger.eds-badge--type-notification, .eds-badge--variant-negative.eds-badge--type-status, .eds-badge--variant-negative.eds-badge--type-notification {
927
- border-color: var(--components-layout-badge-negative-standard-border);
928
- }
929
- .eds-contrast .eds-badge--variant-danger.eds-badge--type-status, .eds-contrast .eds-badge--variant-danger.eds-badge--type-notification, .eds-contrast .eds-badge--variant-negative.eds-badge--type-status, .eds-contrast .eds-badge--variant-negative.eds-badge--type-notification {
930
- border-color: var(--components-layout-badge-negative-contrast-border);
931
- }
932
- .eds-badge--variant-danger.eds-badge--type-bullet::before, .eds-badge--variant-negative.eds-badge--type-bullet::before {
933
- background-color: var(--components-layout-badge-negative-standard-bullet);
934
- }
935
- .eds-contrast .eds-badge--variant-danger.eds-badge--type-bullet::before, .eds-contrast .eds-badge--variant-negative.eds-badge--type-bullet::before {
936
- background-color: var(--components-layout-badge-negative-contrast-bullet);
937
- }
938
- .eds-badge--variant-info, .eds-badge--variant-information {
939
- background-color: var(--components-layout-badge-information-standard-fill);
940
- color: var(--components-layout-badge-information-standard-text);
941
- }
942
- .eds-contrast .eds-badge--variant-info, .eds-contrast .eds-badge--variant-information {
943
- background-color: var(--components-layout-badge-information-contrast-fill);
944
- color: var(--components-layout-badge-information-contrast-text);
945
- }
946
- .eds-badge--variant-info.eds-badge--type-status, .eds-badge--variant-info.eds-badge--type-notification, .eds-badge--variant-information.eds-badge--type-status, .eds-badge--variant-information.eds-badge--type-notification {
947
- border-color: var(--components-layout-badge-information-standard-border);
948
- }
949
- .eds-contrast .eds-badge--variant-info.eds-badge--type-status, .eds-contrast .eds-badge--variant-info.eds-badge--type-notification, .eds-contrast .eds-badge--variant-information.eds-badge--type-status, .eds-contrast .eds-badge--variant-information.eds-badge--type-notification {
950
- border-color: var(--components-layout-badge-information-contrast-border);
951
- }
952
- .eds-badge--variant-info.eds-badge--type-bullet::before, .eds-badge--variant-information.eds-badge--type-bullet::before {
953
- background-color: var(--components-layout-badge-information-standard-bullet);
954
- }
955
- .eds-contrast .eds-badge--variant-info.eds-badge--type-bullet::before, .eds-contrast .eds-badge--variant-information.eds-badge--type-bullet::before {
956
- background-color: var(--components-layout-badge-information-contrast-bullet);
957
- }
958
- .eds-badge--variant-neutral {
959
- background-color: var(--components-layout-badge-neutral-standard-fill);
960
- color: var(--components-layout-badge-neutral-standard-text);
961
- }
962
- .eds-contrast .eds-badge--variant-neutral {
963
- background-color: var(--components-layout-badge-neutral-contrast-fill);
964
- color: var(--components-layout-badge-neutral-contrast-text);
965
- }
966
- .eds-badge--variant-neutral.eds-badge--type-status, .eds-badge--variant-neutral.eds-badge--type-notification {
967
- border-color: var(--components-layout-badge-neutral-standard-border);
968
- }
969
- .eds-contrast .eds-badge--variant-neutral.eds-badge--type-status, .eds-contrast .eds-badge--variant-neutral.eds-badge--type-notification {
970
- border-color: var(--components-layout-badge-neutral-contrast-border);
971
- }
972
- .eds-badge--variant-neutral.eds-badge--type-bullet::before {
973
- background-color: var(--components-layout-badge-neutral-standard-bullet);
974
- }
975
- .eds-contrast .eds-badge--variant-neutral.eds-badge--type-bullet::before {
976
- background-color: var(--components-layout-badge-neutral-contrast-bullet);
977
- }
978
- .eds-badge--type-status {
979
- display: block;
980
- text-transform: uppercase;
981
- border-radius: 0.25rem;
982
- line-height: 1.25rem;
983
- padding: 0 0.5rem;
984
- height: 1.25rem;
985
- border: 0.0625rem solid transparent;
986
- border-color: transparent;
987
- }
988
- .eds-badge--type-notification {
989
- line-height: 1.5rem;
990
- height: 1.5rem;
991
- min-width: 1.5rem;
992
- padding: 0 0.25rem;
993
- border: 0.0625rem solid transparent;
994
- }
995
- .eds-contrast .eds-badge--type-notification {
996
- border-color: transparent;
997
- }
998
- .eds-badge--type-bullet {
999
- background: none;
1000
- font-size: 1rem;
1001
- line-height: 1.5rem;
1002
- color: var(--components-layout-badge-primary-standard-text-bullet);
1003
- border: none;
1004
- position: relative;
1005
- padding-left: 1.375rem;
1006
- }
1007
- .eds-contrast .eds-badge--type-bullet {
1008
- color: var(--components-layout-badge-primary-contrast-text-bullet);
1009
- background: none;
1010
- }
1011
- .eds-badge--type-bullet::before {
1012
- background: var(--components-layout-badge-primary-standard-fill);
1013
- left: 0;
1014
- content: "";
1015
- position: absolute;
1016
- top: 0.3125rem;
1017
- height: 0.625rem;
1018
- width: 0.625rem;
1019
- border-radius: 50%;
1020
- }/* DO NOT CHANGE!*/
1021
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1022
- .eds-tag {
1023
- background: #e9e9e9;
1024
- color: #181c56;
1025
- display: inline-block;
1026
- min-width: 2rem;
1027
- padding: 0.25rem 0.75rem;
1028
- font-size: 0.875rem;
1029
- line-height: 1.375rem;
1030
- }
1031
- .eds-tag--leading-icon .eds-icon {
1032
- margin-right: 0.5rem;
1033
- }
1034
- .eds-tag--trailing-icon .eds-icon {
1035
- margin-left: 0.5rem;
1036
- }
1037
- .eds-tag--compact {
1038
- font-size: 0.75rem;
1039
- padding: 0.125rem 0.5rem;
1040
- line-height: 1.25rem;
1041
- height: 1.5rem;
1042
- }
1043
- .eds-tag--compact.eds-tag--leading-icon .eds-icon {
1044
- margin-right: 0.25rem;
1045
- }
1046
- .eds-tag--compact.eds-tag--trailing-icon .eds-icon {
1047
- margin-left: 0.25rem;
944
+ }.eds-badge{
945
+ display:-webkit-box;
946
+ display:-webkit-flex;
947
+ display:-moz-box;
948
+ display:flex;
949
+ -webkit-box-pack:center;
950
+ -webkit-justify-content:center;
951
+ -moz-box-pack:center;
952
+ justify-content:center;
953
+ -webkit-box-align:center;
954
+ -webkit-align-items:center;
955
+ -moz-box-align:center;
956
+ align-items:center;
957
+ font-family:inherit;
958
+ font-weight:500;
959
+ font-size:0.75rem;
960
+ min-width:1.5rem;
961
+ height:1.5rem;
962
+ width:-webkit-fit-content;
963
+ width:-moz-fit-content;
964
+ width:fit-content;
965
+ line-height:1rem;
966
+ padding:2px 8px;
967
+ -webkit-border-radius:0.75rem;
968
+ -moz-border-radius:0.75rem;
969
+ border-radius:0.75rem;
970
+ top:0;
971
+ right:0;
972
+ opacity:1;
973
+ visibility:visible;
974
+ color:var(--components-layout-badge-primary-standard-text);
975
+ -webkit-transition:opacity 0.2s ease-in-out, visibility 0s linear;
976
+ -o-transition:opacity 0.2s ease-in-out, visibility 0s linear;
977
+ -moz-transition:opacity 0.2s ease-in-out, visibility 0s linear;
978
+ transition:opacity 0.2s ease-in-out, visibility 0s linear;
979
+ }
980
+ .eds-badge--hide{
981
+ opacity:0;
982
+ visibility:hidden;
983
+ -webkit-transition:opacity 0.2s ease-in-out, visibility 0s linear 0.3s;
984
+ -o-transition:opacity 0.2s ease-in-out, visibility 0s linear 0.3s;
985
+ -moz-transition:opacity 0.2s ease-in-out, visibility 0s linear 0.3s;
986
+ transition:opacity 0.2s ease-in-out, visibility 0s linear 0.3s;
987
+ }
988
+ .eds-badge--variant-primary{
989
+ background-color:var(--components-layout-badge-primary-standard-fill);
990
+ color:var(--components-layout-badge-primary-standard-text);
991
+ }
992
+ .eds-contrast .eds-badge--variant-primary{
993
+ color:var(--components-layout-badge-primary-contrast-text);
994
+ background-color:var(--components-layout-badge-primary-contrast-fill);
995
+ }
996
+ .eds-badge--variant-primary.eds-badge--type-bullet::before{
997
+ background-color:var(--components-layout-badge-primary-standard-bullet);
998
+ }
999
+ .eds-contrast .eds-badge--variant-primary.eds-badge--type-bullet::before{
1000
+ background-color:var(--components-layout-badge-primary-contrast-bullet);
1001
+ }
1002
+ .eds-badge--variant-success{
1003
+ background-color:var(--components-layout-badge-success-standard-fill);
1004
+ color:var(--components-layout-badge-success-standard-text);
1005
+ }
1006
+ .eds-contrast .eds-badge--variant-success{
1007
+ background-color:var(--components-layout-badge-success-contrast-fill);
1008
+ color:var(--components-layout-badge-success-contrast-text);
1009
+ }
1010
+ .eds-badge--variant-success.eds-badge--type-status, .eds-badge--variant-success.eds-badge--type-notification{
1011
+ border-color:var(--components-layout-badge-success-standard-border);
1012
+ }
1013
+ .eds-contrast .eds-badge--variant-success.eds-badge--type-status, .eds-contrast .eds-badge--variant-success.eds-badge--type-notification{
1014
+ border-color:var(--components-layout-badge-success-contrast-border);
1015
+ }
1016
+ .eds-badge--variant-success.eds-badge--type-bullet::before{
1017
+ background-color:var(--components-layout-badge-success-standard-bullet);
1018
+ }
1019
+ .eds-contrast .eds-badge--variant-success.eds-badge--type-bullet::before{
1020
+ background-color:var(--components-layout-badge-success-contrast-bullet);
1021
+ }
1022
+ .eds-badge--variant-warning{
1023
+ background-color:var(--components-layout-badge-warning-standard-fill);
1024
+ color:var(--components-layout-badge-warning-standard-text);
1025
+ }
1026
+ .eds-contrast .eds-badge--variant-warning{
1027
+ background-color:var(--components-layout-badge-warning-contrast-fill);
1028
+ color:var(--components-layout-badge-warning-contrast-text);
1029
+ }
1030
+ .eds-badge--variant-warning.eds-badge--type-status, .eds-badge--variant-warning.eds-badge--type-notification{
1031
+ border-color:var(--components-layout-badge-warning-standard-border);
1032
+ }
1033
+ .eds-contrast .eds-badge--variant-warning.eds-badge--type-status, .eds-contrast .eds-badge--variant-warning.eds-badge--type-notification{
1034
+ border-color:var(--components-layout-badge-warning-contrast-border);
1035
+ }
1036
+ .eds-badge--variant-warning.eds-badge--type-bullet::before{
1037
+ background-color:var(--components-layout-badge-warning-standard-bullet);
1038
+ }
1039
+ .eds-contrast .eds-badge--variant-warning.eds-badge--type-bullet::before{
1040
+ background-color:var(--components-layout-badge-warning-contrast-bullet);
1041
+ }
1042
+ .eds-badge--variant-danger, .eds-badge--variant-negative{
1043
+ background-color:var(--components-layout-badge-negative-standard-fill);
1044
+ color:var(--components-layout-badge-negative-standard-text);
1045
+ }
1046
+ .eds-contrast .eds-badge--variant-danger, .eds-contrast .eds-badge--variant-negative{
1047
+ background-color:var(--components-layout-badge-negative-contrast-fill);
1048
+ color:var(--components-layout-badge-negative-contrast-text);
1049
+ }
1050
+ .eds-badge--variant-danger.eds-badge--type-status, .eds-badge--variant-danger.eds-badge--type-notification, .eds-badge--variant-negative.eds-badge--type-status, .eds-badge--variant-negative.eds-badge--type-notification{
1051
+ border-color:var(--components-layout-badge-negative-standard-border);
1052
+ }
1053
+ .eds-contrast .eds-badge--variant-danger.eds-badge--type-status, .eds-contrast .eds-badge--variant-danger.eds-badge--type-notification, .eds-contrast .eds-badge--variant-negative.eds-badge--type-status, .eds-contrast .eds-badge--variant-negative.eds-badge--type-notification{
1054
+ border-color:var(--components-layout-badge-negative-contrast-border);
1055
+ }
1056
+ .eds-badge--variant-danger.eds-badge--type-bullet::before, .eds-badge--variant-negative.eds-badge--type-bullet::before{
1057
+ background-color:var(--components-layout-badge-negative-standard-bullet);
1058
+ }
1059
+ .eds-contrast .eds-badge--variant-danger.eds-badge--type-bullet::before, .eds-contrast .eds-badge--variant-negative.eds-badge--type-bullet::before{
1060
+ background-color:var(--components-layout-badge-negative-contrast-bullet);
1061
+ }
1062
+ .eds-badge--variant-info, .eds-badge--variant-information{
1063
+ background-color:var(--components-layout-badge-information-standard-fill);
1064
+ color:var(--components-layout-badge-information-standard-text);
1065
+ }
1066
+ .eds-contrast .eds-badge--variant-info, .eds-contrast .eds-badge--variant-information{
1067
+ background-color:var(--components-layout-badge-information-contrast-fill);
1068
+ color:var(--components-layout-badge-information-contrast-text);
1069
+ }
1070
+ .eds-badge--variant-info.eds-badge--type-status, .eds-badge--variant-info.eds-badge--type-notification, .eds-badge--variant-information.eds-badge--type-status, .eds-badge--variant-information.eds-badge--type-notification{
1071
+ border-color:var(--components-layout-badge-information-standard-border);
1072
+ }
1073
+ .eds-contrast .eds-badge--variant-info.eds-badge--type-status, .eds-contrast .eds-badge--variant-info.eds-badge--type-notification, .eds-contrast .eds-badge--variant-information.eds-badge--type-status, .eds-contrast .eds-badge--variant-information.eds-badge--type-notification{
1074
+ border-color:var(--components-layout-badge-information-contrast-border);
1075
+ }
1076
+ .eds-badge--variant-info.eds-badge--type-bullet::before, .eds-badge--variant-information.eds-badge--type-bullet::before{
1077
+ background-color:var(--components-layout-badge-information-standard-bullet);
1078
+ }
1079
+ .eds-contrast .eds-badge--variant-info.eds-badge--type-bullet::before, .eds-contrast .eds-badge--variant-information.eds-badge--type-bullet::before{
1080
+ background-color:var(--components-layout-badge-information-contrast-bullet);
1081
+ }
1082
+ .eds-badge--variant-neutral{
1083
+ background-color:var(--components-layout-badge-neutral-standard-fill);
1084
+ color:var(--components-layout-badge-neutral-standard-text);
1085
+ }
1086
+ .eds-contrast .eds-badge--variant-neutral{
1087
+ background-color:var(--components-layout-badge-neutral-contrast-fill);
1088
+ color:var(--components-layout-badge-neutral-contrast-text);
1089
+ }
1090
+ .eds-badge--variant-neutral.eds-badge--type-status, .eds-badge--variant-neutral.eds-badge--type-notification{
1091
+ border-color:var(--components-layout-badge-neutral-standard-border);
1092
+ }
1093
+ .eds-contrast .eds-badge--variant-neutral.eds-badge--type-status, .eds-contrast .eds-badge--variant-neutral.eds-badge--type-notification{
1094
+ border-color:var(--components-layout-badge-neutral-contrast-border);
1095
+ }
1096
+ .eds-badge--variant-neutral.eds-badge--type-bullet::before{
1097
+ background-color:var(--components-layout-badge-neutral-standard-bullet);
1098
+ }
1099
+ .eds-contrast .eds-badge--variant-neutral.eds-badge--type-bullet::before{
1100
+ background-color:var(--components-layout-badge-neutral-contrast-bullet);
1101
+ }
1102
+ .eds-badge--type-status{
1103
+ display:block;
1104
+ text-transform:uppercase;
1105
+ -webkit-border-radius:0.25rem;
1106
+ -moz-border-radius:0.25rem;
1107
+ border-radius:0.25rem;
1108
+ line-height:1.25rem;
1109
+ padding:0 0.5rem;
1110
+ height:1.25rem;
1111
+ border:0.0625rem solid transparent;
1112
+ border-color:transparent;
1113
+ }
1114
+ .eds-badge--type-notification{
1115
+ line-height:1.5rem;
1116
+ height:1.5rem;
1117
+ min-width:1.5rem;
1118
+ padding:0 0.25rem;
1119
+ border:0.0625rem solid transparent;
1120
+ }
1121
+ .eds-contrast .eds-badge--type-notification{
1122
+ border-color:transparent;
1123
+ }
1124
+ .eds-badge--type-bullet{
1125
+ background:none;
1126
+ font-size:1rem;
1127
+ line-height:1.5rem;
1128
+ color:var(--components-layout-badge-primary-standard-text-bullet);
1129
+ border:none;
1130
+ position:relative;
1131
+ padding-left:1.375rem;
1132
+ }
1133
+ .eds-contrast .eds-badge--type-bullet{
1134
+ color:var(--components-layout-badge-primary-contrast-text-bullet);
1135
+ background:none;
1136
+ }
1137
+ .eds-badge--type-bullet::before{
1138
+ background:var(--components-layout-badge-primary-standard-fill);
1139
+ left:0;
1140
+ content:"";
1141
+ position:absolute;
1142
+ top:0.3125rem;
1143
+ height:0.625rem;
1144
+ width:0.625rem;
1145
+ -webkit-border-radius:50%;
1146
+ -moz-border-radius:50%;
1147
+ border-radius:50%;
1148
+ }.eds-tag{
1149
+ background:#e9e9e9;
1150
+ color:#181c56;
1151
+ display:inline-block;
1152
+ min-width:2rem;
1153
+ padding:0.25rem 0.75rem;
1154
+ font-size:0.875rem;
1155
+ line-height:1.375rem;
1156
+ }
1157
+ .eds-tag--leading-icon .eds-icon{
1158
+ margin-right:0.5rem;
1159
+ }
1160
+ .eds-tag--trailing-icon .eds-icon{
1161
+ margin-left:0.5rem;
1162
+ }
1163
+ .eds-tag--compact{
1164
+ font-size:0.75rem;
1165
+ padding:0.125rem 0.5rem;
1166
+ line-height:1.25rem;
1167
+ height:1.5rem;
1168
+ }
1169
+ .eds-tag--compact.eds-tag--leading-icon .eds-icon{
1170
+ margin-right:0.25rem;
1171
+ }
1172
+ .eds-tag--compact.eds-tag--trailing-icon .eds-icon{
1173
+ margin-left:0.25rem;
1048
1174
  }