Skip to content

Commit 17f8554

Browse files
colinrotherhamcolinrotherham
committed
Fix NHS.UK frontend deprecations
1 parent 5e2885a commit 17f8554

9 files changed

Lines changed: 43 additions & 43 deletions

‎app/assets/sass/_button-group.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@
5959

6060
// On tablet and above, we also introduce a 'column gap' between the
6161
// buttons and links in each row and left align links
62-
@include govuk-media-query($from: tablet) {
62+
@include nhsuk-media-query($from: tablet) {
6363
// Cancel out the column gap for the last item in each row
6464
margin-right: ($horizontal-gap * -1);
6565

‎app/assets/sass/components/_dark-mode.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,16 @@
33

44
$app-dark-mode-blue: #348de0;
55
$app-dark-mode-background: #1C1C1C;
6-
$app-dark-mode-background-secondary: tint($app-dark-mode-background, 10%);
6+
$app-dark-mode-background-secondary: nhsuk-tint($app-dark-mode-background, 10%);
77
$app-dark-mode-white: #E8E8E8;
88
$app-dark-mode-text-colour: $app-dark-mode-white;
9-
$app-dark-mode-text-colour-secondary: shade($app-dark-mode-text-colour, 30%);
9+
$app-dark-mode-text-colour-secondary: nhsuk-shade($app-dark-mode-text-colour, 30%);
1010

1111
// Links
1212
$app-dark-mode-link-color: $app-dark-mode-blue;
13-
$app-dark-mode-link-hover-color: tint($color_nhsuk-dark-pink, 50%);
14-
$app-dark-mode-link-active-color: shade($app-dark-mode-link-color, 20%);
15-
$app-dark-mode-link-visited-color: tint($color_nhsuk-purple, 50%);
13+
$app-dark-mode-link-hover-color: nhsuk-tint($color_nhsuk-dark-pink, 50%);
14+
$app-dark-mode-link-active-color: nhsuk-shade($app-dark-mode-link-color, 20%);
15+
$app-dark-mode-link-visited-color: nhsuk-tint($color_nhsuk-purple, 50%);
1616

1717
// Paul's colours
1818
$app-dark-mode-link-color: #348de0;

‎app/assets/sass/components/_forward-link.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
margin-top: nhsuk-spacing(3);
1717
line-height: 1; // [5]
1818

19-
@include mq($from: tablet) {
19+
@include nhsuk-media-query($from: tablet) {
2020
margin-top: nhsuk-spacing(4);
2121
}
2222
}
@@ -30,7 +30,7 @@
3030
position: relative;
3131
text-decoration: none;
3232
@include nhsuk-link-style-default;
33-
@include nhsuk-typography-responsive(16);
33+
@include nhsuk-font-size(16);
3434

3535
.nhsuk-icon__chevron-right {
3636
height: 24px;
@@ -39,7 +39,7 @@
3939
top: -1px; // [3]
4040
width: 24px;
4141

42-
@include mq($from: tablet) {
42+
@include nhsuk-media-query($from: tablet) {
4343
top: 0; // [3]
4444
}
4545
}

‎app/assets/sass/components/_header-organisation.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
height: 24px;
2424
width: 60px;
2525

26-
@include mq($from: tablet) {
26+
@include nhsuk-media-query($from: tablet) {
2727
height: 32px;
2828
width: 80px;
2929
}
@@ -35,7 +35,7 @@
3535
display: block;
3636
@include nhsuk-font(22, $line-height: 1.1, $weight: bold);
3737

38-
@include mq($media-type: print) {
38+
@include nhsuk-media-query($media-type: print) {
3939
color: $nhsuk-print-text-color;
4040
}
4141
}
@@ -49,7 +49,7 @@
4949
display: block;
5050
@include nhsuk-font(14, $weight: bold);
5151

52-
@include mq($media-type: print) {
52+
@include nhsuk-media-query($media-type: print) {
5353
color: $color_nhsuk-blue;
5454
}
5555
}

‎app/assets/sass/components/_header.scss‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,9 @@
6060
flex-flow: column wrap;
6161
gap: nhsuk-spacing(3);
6262
padding: nhsuk-spacing(3) 0;
63-
@include govuk-width-container;
63+
@include nhsuk-width-container;
6464

65-
@include mq($from: tablet) {
65+
@include nhsuk-media-query($from: tablet) {
6666
flex-direction: row;
6767
}
6868
}
@@ -85,7 +85,7 @@
8585
flex-wrap: wrap;
8686
gap: nhsuk-spacing(2) nhsuk-spacing(3);
8787

88-
@include mq($media-type: print) {
88+
@include nhsuk-media-query($media-type: print) {
8989
color: $color_nhsuk-black;
9090

9191
&:after {
@@ -117,13 +117,13 @@
117117
* Account
118118
*/
119119
.nhsuk-header__account {
120-
background: shade($color_nhsuk-blue, 20%);
120+
background: nhsuk-shade($color_nhsuk-blue, 20%);
121121
border-radius: $nhsuk-border-radius;
122122
flex-grow: 1;
123-
outline: 1px solid shade($color_nhsuk-blue, 20%);
123+
outline: 1px solid nhsuk-shade($color_nhsuk-blue, 20%);
124124
margin-bottom: 1px;
125125

126-
@include mq($from: tablet) {
126+
@include nhsuk-media-query($from: tablet) {
127127
align-self: start;
128128
}
129129
}
@@ -139,7 +139,7 @@
139139
}
140140

141141
.nhsuk-header__account-item {
142-
background-color: shade($color_nhsuk-blue, 20%);
142+
background-color: nhsuk-shade($color_nhsuk-blue, 20%);
143143
display: flex;
144144
flex-grow: 1;
145145
gap: nhsuk-spacing(2);
@@ -168,15 +168,15 @@
168168
flex-grow: 1;
169169
position: relative;
170170
z-index: 13;
171-
@include print-hide();
171+
@include nhsuk-print-hide();
172172
}
173173

174174
.nhsuk-header__search-form {
175175
display: flex;
176176
height: 100%;
177177
overflow: visible;
178178

179-
@include mq($until: tablet) {
179+
@include nhsuk-media-query($until: tablet) {
180180
position: relative;
181181
}
182182
}
@@ -202,7 +202,7 @@
202202
opacity: 1; // Fixes low contrast of placeholder text in firefox
203203
}
204204

205-
@include mq($until: tablet) {
205+
@include nhsuk-media-query($until: tablet) {
206206
border-radius: $nhsuk-border-radius;
207207
}
208208
}
@@ -218,7 +218,7 @@
218218
margin: 0;
219219
width: 44px;
220220

221-
@include mq($until: tablet) {
221+
@include nhsuk-media-query($until: tablet) {
222222
position: absolute;
223223
right: 0;
224224
top: 0;
@@ -248,17 +248,17 @@
248248
*/
249249
.nhsuk-navigation-container {
250250
position: relative;
251-
@include print-hide();
251+
@include nhsuk-print-hide();
252252

253-
@include mq($until: tablet) {
253+
@include nhsuk-media-query($until: tablet) {
254254
margin-top: -(nhsuk-spacing(3));
255255
}
256256
}
257257

258258
.nhsuk-navigation {
259259
display: flex;
260260

261-
@include mq($until: tablet) {
261+
@include nhsuk-media-query($until: tablet) {
262262
position: relative;
263263
z-index: 10;
264264
}
@@ -269,13 +269,13 @@
269269
list-style: none;
270270
padding: 0;
271271
width: 100%;
272-
@include govuk-width-container;
272+
@include nhsuk-width-container;
273273

274-
@include mq($from: tablet) {
274+
@include nhsuk-media-query($from: tablet) {
275275
border-top: 1px solid $color_transparent_nhsuk-white-20;
276276
}
277277

278-
@include mq($from: desktop) {
278+
@include nhsuk-media-query($from: desktop) {
279279
justify-content: space-between;
280280
}
281281

@@ -286,7 +286,7 @@
286286
}
287287

288288
.nhsuk-header__navigation-list--left-aligned {
289-
@include mq($from: desktop) {
289+
@include nhsuk-media-query($from: desktop) {
290290
justify-content: initial;
291291
}
292292
}
@@ -374,11 +374,11 @@
374374
right: 0;
375375
top: 100%;
376376
left: 0;
377-
@include print-hide();
377+
@include nhsuk-print-hide();
378378

379379
.nhsuk-header__navigation-link {
380380
padding: 12px 0;
381-
@include govuk-width-container;
381+
@include nhsuk-width-container;
382382
@include nhsuk-link-style-no-visited-state;
383383

384384
// When in expanded menu, a current item link should revert to having a

‎app/assets/sass/components/_notification-banner.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ $nhsuk-success-color: $color_nhsuk-green !default;
6363
// text in high contrast mode
6464
border-bottom: 1px solid transparent;
6565

66-
@include govuk-media-query($from: tablet) {
66+
@include nhsuk-media-query($from: tablet) {
6767
padding: 2px nhsuk-spacing(4) nhsuk-spacing(1);
6868
}
6969
}
@@ -84,7 +84,7 @@ $nhsuk-success-color: $color_nhsuk-green !default;
8484

8585
background-color: $color_nhsuk-white;
8686

87-
@include govuk-media-query($from: tablet) {
87+
@include nhsuk-media-query($from: tablet) {
8888
padding: $padding-tablet;
8989
}
9090

@@ -111,7 +111,7 @@ $nhsuk-success-color: $color_nhsuk-green !default;
111111
.app-notification-banner__heading {
112112
margin: 0 0 nhsuk-spacing(3);
113113
padding: 0;
114-
@include nhsuk-font($size: 24, $weight: bold);
114+
@include nhsuk-font($size: 26, $weight: bold);
115115
}
116116

117117
.app-notification-banner__link {

‎app/assets/sass/components/_reading.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
// app/assets/sass/components/_reading.scss
55

66
.app-reading-status {
7-
background-color: shade($color_nhsuk-blue, 40%);
7+
background-color: nhsuk-shade($color_nhsuk-blue, 40%);
88
color: $color_nhsuk-white;
99
a {
1010
color: $color_nhsuk-white;
@@ -13,7 +13,7 @@
1313
}
1414

1515
.app-reading-status {
16-
background-color: shade($color_nhsuk-blue, 40%);
16+
background-color: nhsuk-shade($color_nhsuk-blue, 40%);
1717
color: $color_nhsuk-white;
1818
padding: 8px 0;
1919
border-bottom: 1px solid #d8dde0;

‎app/assets/sass/components/_related-nav.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,19 +8,19 @@
88
.nhsuk-related-nav {
99
border-top: 1px solid $nhsuk-border-color;
1010

11-
@include mq($until: desktop) {
11+
@include nhsuk-media-query($until: desktop) {
1212
margin-top: nhsuk-spacing(7);
1313
}
1414
}
1515

1616
.nhsuk-related-nav__heading {
1717
margin-bottom: 12px;
1818
padding-top: nhsuk-spacing(3);
19-
@include nhsuk-typography-responsive(19, $override-line-height: 1.2);
19+
@include nhsuk-font-size(19, $line-height: 1.2);
2020
}
2121

2222
.nhsuk-related-nav__list {
2323
list-style: none;
2424
padding-left: 0;
25-
@include nhsuk-typography-responsive(16);
25+
@include nhsuk-font-size(16);
2626
}

‎app/assets/sass/components/_secondary-navigation.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ $govuk-spacing4: 20px;
4949
}
5050

5151
.app-secondary-navigation__list {
52-
@include clearfix;
52+
@include nhsuk-clearfix;
5353

5454
// The list uses box-shadow rather than a border to set a 1px
5555
// grey line at the bottom, so that border from the current
@@ -71,7 +71,7 @@ $govuk-spacing4: 20px;
7171
position: relative;
7272

7373
// More generous padding beneath items on wider screens
74-
@include mq($from: tablet) {
74+
@include nhsuk-media-query($from: tablet) {
7575
padding-bottom: $govuk-spacing3;
7676
}
7777
}
@@ -88,7 +88,7 @@ $govuk-spacing4: 20px;
8888
padding-bottom: $govuk-spacing1;
8989

9090
// More generous padding beneath items on wider screens
91-
@include mq($from: tablet) {
91+
@include nhsuk-media-query($from: tablet) {
9292
padding-bottom: $govuk-spacing2;
9393
}
9494
}

0 commit comments

Comments
 (0)