@ons/design-system 45.1.4 → 45.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/footer/_footer.scss +2 -2
- package/components/header/_header.scss +10 -38
- package/components/header/_macro.njk +3 -3
- package/components/icons/_macro.njk +246 -191
- package/css/census.css +1 -1
- package/css/main.css +1 -1
- package/package.json +1 -1
- package/scss/vars/_colors.scss +0 -9
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
height: 46px;
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
|
-
&__grid-top-
|
|
33
|
+
&__grid-top-tall {
|
|
34
34
|
@include mq(xs) {
|
|
35
35
|
height: 76px;
|
|
36
36
|
}
|
|
@@ -119,9 +119,9 @@
|
|
|
119
119
|
background: $color-header-top-internal;
|
|
120
120
|
.ons-svg-logo {
|
|
121
121
|
display: block;
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
fill: $color-
|
|
122
|
+
.ons-svg-logo__group--text,
|
|
123
|
+
.ons-svg-logo__group--primary {
|
|
124
|
+
fill: $color-white;
|
|
125
125
|
}
|
|
126
126
|
}
|
|
127
127
|
}
|
|
@@ -129,6 +129,9 @@
|
|
|
129
129
|
background-color: transparent;
|
|
130
130
|
box-shadow: none;
|
|
131
131
|
outline: 3px solid $color-focus;
|
|
132
|
+
.ons-svg-logo {
|
|
133
|
+
fill: $color-text-link-focus;
|
|
134
|
+
}
|
|
132
135
|
}
|
|
133
136
|
&__grid-top {
|
|
134
137
|
min-height: 36px;
|
|
@@ -141,45 +144,13 @@
|
|
|
141
144
|
}
|
|
142
145
|
}
|
|
143
146
|
|
|
144
|
-
.ons-svg-logo,
|
|
145
|
-
.ons-nisra-svg-logo {
|
|
146
|
-
display: block;
|
|
147
|
-
}
|
|
148
|
-
|
|
149
147
|
.ons-svg-logo {
|
|
150
|
-
|
|
151
|
-
&--accent {
|
|
152
|
-
fill: $color-ons-logo-secondary;
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
.ons-nisra-svg-logo {
|
|
157
|
-
.ons-st0 {
|
|
158
|
-
fill: $color-nisra-logo-primary;
|
|
159
|
-
}
|
|
160
|
-
.ons-st1 {
|
|
161
|
-
fill: $color-nisra-logo-secondary;
|
|
162
|
-
}
|
|
163
|
-
.ons-st2 {
|
|
164
|
-
fill: $color-nisra-logo-tertiary;
|
|
165
|
-
}
|
|
148
|
+
display: block;
|
|
166
149
|
}
|
|
167
150
|
|
|
168
151
|
&__logo-link:focus {
|
|
169
152
|
.ons-svg-logo {
|
|
170
|
-
|
|
171
|
-
&--accent {
|
|
172
|
-
fill: $color-black !important;
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
.ons-nisra-svg-logo {
|
|
176
|
-
.ons-st0 {
|
|
177
|
-
fill: $color-black !important;
|
|
178
|
-
}
|
|
179
|
-
.ons-st1 {
|
|
180
|
-
fill: $color-black !important;
|
|
181
|
-
}
|
|
182
|
-
.ons-st2 {
|
|
153
|
+
.ons-svg-logo__group {
|
|
183
154
|
fill: $color-black !important;
|
|
184
155
|
}
|
|
185
156
|
}
|
|
@@ -199,6 +170,7 @@
|
|
|
199
170
|
|
|
200
171
|
&__logo-link,
|
|
201
172
|
&__logo-link:hover {
|
|
173
|
+
font-size: 0;
|
|
202
174
|
text-decoration: none;
|
|
203
175
|
}
|
|
204
176
|
|
|
@@ -18,18 +18,18 @@
|
|
|
18
18
|
{% endif %}
|
|
19
19
|
<div class="ons-header__top">
|
|
20
20
|
<div class="ons-container{{ ' ons-container--full-width' if params.fullWidth }}{{ ' ons-container--wide' if params.wide }}">
|
|
21
|
-
<div class="ons-header__grid-top ons-grid ons-grid--gutterless ons-grid--flex ons-grid--between ons-grid--vertical-center ons-grid--no-wrap
|
|
21
|
+
<div class="ons-header__grid-top ons-grid ons-grid--gutterless ons-grid--flex ons-grid--between ons-grid--vertical-center ons-grid--no-wrap{{ ' ons-header__grid-top-tall' if params.customHeaderLogo is defined and params.customHeaderLogo }}">
|
|
22
22
|
|
|
23
23
|
<div class="ons-grid__col ons-col-auto">
|
|
24
24
|
<div class="ons-header__logo--large">
|
|
25
|
-
{
|
|
25
|
+
{%-if params.logoHref is defined and params.logoHref %}<a class="ons-header__logo-link" href="{{ params.logoHref }}">{% endif -%}
|
|
26
26
|
{{
|
|
27
27
|
onsIcon({
|
|
28
28
|
"iconType": params.logo | default('ons-logo-' + currentLanguageISOCode),
|
|
29
29
|
"altText": params.logoAlt | default('Office for National Statistics logo')
|
|
30
30
|
})
|
|
31
31
|
}}
|
|
32
|
-
{
|
|
32
|
+
{%- if params.logoHref is defined and params.logoHref %}</a>{% endif -%}
|
|
33
33
|
</div>
|
|
34
34
|
<div class="ons-header__logo--small">
|
|
35
35
|
{% if params.logoHref is defined and params.logoHref %}<a class="ons-header__logo-link" href="{{ params.logoHref }}">{% endif %}
|