Skip to content

Commit f91f260

Browse files
committed
Revert "Reapply "updated scss and layout files to rationalise .nhsuk overrides""
This reverts commit b571998.
1 parent b571998 commit f91f260

File tree

10 files changed

+6717
-190
lines changed

10 files changed

+6717
-190
lines changed

.gitignore

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -512,6 +512,3 @@ DigitalLearningSolutions.Web/Views/Shared/Components/SelectList/Default.cshtml
512512
DigitalLearningSolutions.Web/Views/Shared/Components/SingleCheckbox/Default.cshtml
513513
DigitalLearningSolutions.Web/Views/Shared/Components/TextArea/Default.cshtml
514514
DigitalLearningSolutions.Web/Views/Shared/Components/TextInput/Default.cshtml
515-
/DigitalLearningSolutions.Web/appsettings.Test.json
516-
/DigitalLearningSolutions.Web/web.config
517-
/DigitalLearningSolutions.Web/yarn.lock

DigitalLearningSolutions.Web/Styles/index.scss

Lines changed: 45 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,11 @@ ul > li > ul > li {
6262
padding-top: 0;
6363
}
6464

65-
65+
.nhsuk-button {
66+
@include mq($until: tablet) {
67+
margin-top: nhsuk-spacing(3);
68+
}
69+
}
6670

6771
input:invalid {
6872
border: $nhsuk-border-width-form-element-error solid $nhsuk-error-color;
@@ -74,7 +78,13 @@ input[type=file] {
7478
}
7579
}
7680

81+
input[type=file].nhsuk-input--error {
82+
height: 44px;
7783

84+
@include govuk-media-query($until: tablet) {
85+
height: 40px;
86+
}
87+
}
7888

7989
h1#page-heading {
8090
margin-bottom: 16px;
@@ -88,6 +98,9 @@ h1#page-heading {
8898
display: flex;
8999
}
90100

101+
.nhsuk-main-wrapper {
102+
flex: 1;
103+
}
91104

92105
.responsive-iframe-wrapper {
93106
height: 100%;
@@ -108,6 +121,10 @@ h1#page-heading {
108121
padding-bottom: $iframe-padding-bottom * 1.5;
109122
}
110123

124+
.nhsuk-heading-xl.heading-margin-2 {
125+
margin-bottom: nhsuk-spacing(2);
126+
}
127+
111128
.responsive-iframe {
112129
width: 100%;
113130
height: 100%;
@@ -130,6 +147,25 @@ h1#page-heading {
130147
margin-bottom: 0;
131148
}
132149

150+
.basic-summary-list__row:last-child .nhsuk-summary-list__key {
151+
border: none;
152+
}
153+
154+
.basic-summary-list__row:last-child .nhsuk-summary-list__value {
155+
border: none;
156+
margin-bottom: 0;
157+
}
158+
159+
.nhsuk-summary-list__value {
160+
@include govuk-media-query($until: tablet) {
161+
word-break: break-word;
162+
@include word-break-ie-fix;
163+
}
164+
}
165+
166+
.nhsuk-tag {
167+
text-align: center;
168+
}
133169

134170
.right-align-tag-column {
135171
padding: 0;
@@ -175,6 +211,10 @@ ul.no-bullets {
175211
margin-bottom: 0;
176212
}
177213

214+
.nhsuk-details__text > .nhsuk-button {
215+
margin-bottom: 0;
216+
}
217+
178218
@mixin hidden-submit-ie-fix {
179219
// IE11 hack
180220
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
@@ -295,6 +335,10 @@ ul.no-bullets {
295335
}
296336
}
297337

338+
.nhsuk-error-message.error-message--margin-bottom-1 {
339+
margin-bottom: nhsuk-spacing(1);
340+
}
341+
298342
.display-none {
299343
display: none;
300344
}

DigitalLearningSolutions.Web/Styles/layout.scss

Lines changed: 94 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,14 +24,74 @@ body {
2424
flex: 1 0 auto;
2525
align-self: center;
2626
width: 100%;
27-
padding-left: 32px;
28-
padding-right: 32px;
27+
margin: 0;
2928
}
3029

3130
footer {
3231
flex-shrink: 0;
3332
}
3433

34+
.nhsuk-header__navigation-item.selected {
35+
a {
36+
font-weight: bold;
37+
}
38+
}
39+
40+
.nhsuk-header__logo {
41+
@include mq($until: large-desktop) {
42+
max-width: unset;
43+
44+
.nhsuk-header__link--service {
45+
align-items: center;
46+
display: flex;
47+
-ms-flex-align: center;
48+
margin-bottom: 0;
49+
width: auto;
50+
}
51+
52+
.nhsuk-header__service-name {
53+
padding-left: nhsuk-spacing(3);
54+
max-width: unset;
55+
}
56+
}
57+
}
58+
.nhsuk-navigation-container {
59+
@include mq($until: tablet) {
60+
margin-top: unset;
61+
}
62+
}
63+
64+
body:not(.js-enabled) {
65+
.nhsuk-header__menu {
66+
display: none;
67+
}
68+
69+
#close-menu {
70+
display: none;
71+
}
72+
73+
.nhsuk-header__navigation {
74+
display: block;
75+
}
76+
}
77+
78+
:not(.nhsuk-header--transactional) div.nhsuk-header__container {
79+
@media (max-width: 40.0525em) {
80+
margin: 0;
81+
}
82+
}
83+
84+
.nhsuk-header--transactional {
85+
.nhsuk-header__link--service {
86+
width: auto;
87+
height: auto;
88+
89+
@include mq($from: large-desktop) {
90+
display: flex;
91+
}
92+
}
93+
}
94+
3595
.centre-brand-logo {
3696
float: right;
3797
max-width: 280px;
@@ -42,7 +102,13 @@ footer {
42102
}
43103
}
44104

105+
nav .nhsuk-width-container {
106+
margin: 0 auto;
107+
}
45108

109+
nav, .nhsuk-header__navigation, #header-navigation {
110+
border-bottom: 0;
111+
}
46112

47113
.visual-separator {
48114
height: 8px;
@@ -241,7 +307,19 @@ footer {
241307
clip: auto;
242308
}
243309

310+
.nhsuk-button--danger {
311+
background-color: $color_nhsuk-red;
312+
box-shadow: 0 4px 0 shade($color_nhsuk-red, 50%);
313+
margin-bottom: 16px !important;
244314

315+
&:hover {
316+
background-color: shade($color_nhsuk-red, 20%);
317+
}
318+
319+
&:active {
320+
background-color: shade($color_nhsuk-red, 50%);
321+
}
322+
}
245323

246324
.first-row td {
247325
border-top: 2px solid #d8dde0;
@@ -252,6 +330,12 @@ footer {
252330
white-space: nowrap;
253331
}
254332

333+
.nhsuk-header__link--service {
334+
@include mq($from: large-desktop) {
335+
align-items: unset;
336+
}
337+
}
338+
255339
.header-beta {
256340
color: #c8e4ff;
257341
font-family: FrutigerLTW01-55Roman, Arial, sans-serif;
@@ -263,8 +347,15 @@ footer {
263347
}
264348
}
265349

350+
.nhsuk-width-container, .nhsuk-header__navigation-list {
351+
max-width: 1144px !important;
352+
padding-left: $nhsuk-gutter !important;
353+
padding-right: $nhsuk-gutter !important;
354+
}
266355

267-
356+
.nhsuk-width-container {
357+
margin: auto !important;
358+
}
268359

269360
@media only screen and (max-width: 767px) {
270361
.section-card-result {

DigitalLearningSolutions.Web/Styles/nhsuk.scss

Lines changed: 0 additions & 149 deletions
Original file line numberDiff line numberDiff line change
@@ -7,152 +7,3 @@
77
.nhsuk-hint {
88
white-space: initial;
99
}
10-
11-
12-
@mixin word-break-ie-fix {
13-
// IE11 hack
14-
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
15-
word-break: break-all;
16-
}
17-
}
18-
19-
/* Items below moved from layout.scss or index.scss and deemed to be part of NHSE frontend */
20-
21-
body:not(.js-enabled) {
22-
.nhsuk-header__menu {
23-
display: none;
24-
}
25-
26-
#close-menu {
27-
display: none;
28-
}
29-
30-
.nhsuk-header__navigation {
31-
display: block;
32-
}
33-
}
34-
35-
/* nhsuk-header__navigation-item paired with menu li items that become bold when you're on that page */
36-
/* <li class="nhsuk-header__navigation-item @Html.GetSelectedCssClassIfTabSelected(NavMenuTab.Dashboard)"> */
37-
.nhsuk-header__navigation-item.selected {
38-
a {
39-
font-weight: bold;
40-
}
41-
}
42-
43-
/* stops blue menu overlapping white header, noticable because it's white, not as noticable in blue headers */
44-
.nhsuk-header--white .nhsuk-navigation-container {
45-
@include mq($until: tablet) {
46-
margin-top: unset;
47-
}
48-
}
49-
50-
/* .nhsuk-header--transactional brought from live design-system, not in current implentation */
51-
.nhsuk-header--transactional {
52-
.nhsuk-header__container {
53-
justify-content: normal;
54-
}
55-
56-
.nhsuk-header__link {
57-
display: block;
58-
height: 32px;
59-
width: 80px
60-
}
61-
62-
.nhsuk-logo {
63-
height: 32px;
64-
width: 80px
65-
}
66-
}
67-
68-
.nhsuk-main-wrapper {
69-
flex: 1;
70-
}
71-
72-
/*
73-
Included as fixing issue caused by older grid implementation of NHS breadcrumbs and nav
74-
TODO: Update header and breadcrumbs to reflect current nhsuk implementation
75-
*/
76-
.nhsuk-breadcrumb .nhsuk-width-container {
77-
padding-left: $nhsuk-gutter !important;
78-
padding-right: $nhsuk-gutter !important;
79-
}
80-
81-
.feedback-bar .nhsuk-width-container {
82-
margin-bottom: 0;
83-
}
84-
85-
nav, .nhsuk-header__navigation, #header-navigation {
86-
border-bottom: 0;
87-
}
88-
89-
.nhsuk-heading-xl.heading-margin-2 {
90-
margin-bottom: nhsuk-spacing(2);
91-
}
92-
93-
.nhsuk-button {
94-
@include mq($until: tablet) {
95-
margin-top: nhsuk-spacing(3);
96-
}
97-
}
98-
99-
.nhsuk-button--danger {
100-
background-color: $color_nhsuk-red;
101-
box-shadow: 0 4px 0 shade($color_nhsuk-red, 50%);
102-
margin-bottom: 16px !important;
103-
104-
&:hover {
105-
background-color: shade($color_nhsuk-red, 20%);
106-
}
107-
108-
&:active {
109-
background-color: shade($color_nhsuk-red, 50%);
110-
}
111-
}
112-
113-
.nhsuk-details__text > .nhsuk-button {
114-
margin-bottom: 0;
115-
}
116-
117-
input[type=file].nhsuk-input--error {
118-
height: 44px;
119-
120-
@include govuk-media-query($until: tablet) {
121-
height: 40px;
122-
}
123-
}
124-
125-
.nhsuk-error-message.error-message--margin-bottom-1 {
126-
margin-bottom: nhsuk-spacing(1);
127-
}
128-
129-
.basic-summary-list__row:last-child .nhsuk-summary-list__key {
130-
border: none;
131-
}
132-
133-
.basic-summary-list__row:last-child .nhsuk-summary-list__value {
134-
border: none;
135-
margin-bottom: 0;
136-
}
137-
138-
.nhsuk-summary-list__value {
139-
@include govuk-media-query($until: tablet) {
140-
word-break: break-word;
141-
@include word-break-ie-fix;
142-
}
143-
}
144-
145-
.nhsuk-tag {
146-
text-align: center;
147-
}
148-
149-
150-
151-
/*
152-
styles/index.scss has the following nhsuk dependancies - FGC 2/6/25
153-
.nhsuk-u-font-weight-normal;
154-
.nhsuk-u-font-weight-bold;
155-
.nhsuk-u-font-size-16;
156-
.nhsuk-u-font-size-19;
157-
*/
158-

0 commit comments

Comments
 (0)