Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove deprecated govuk-main-wrapper and govuk-main-wrapper--l mixins #2385

Merged
merged 2 commits into from
Oct 25, 2021
Merged

Remove deprecated govuk-main-wrapper and govuk-main-wrapper--l mixins #2385

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
813171e
Remove previously deprecated govuk-main-wrapper and govuk-main-wrappe…
Oct 15, 2021
8753d1c
Add to Changelog
Oct 15, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,15 @@
### Breaking changes
You must make the following changes when you migrate to this release, or your service may break.

#### Remove deprecated `govuk-main-wrapper` and `govuk-main-wrapper--l` mixins
In [GOV.UK Frontend version 3.0.0](https://github.com/alphagov/govuk-frontend/releases/tag/v3.0.0), we deprecated the `govuk-main-wrapper` and `govuk-main-wrapper--l` Sass mixins.

We've now removed the `govuk-main-wrapper` and `govuk-main-wrapper--l` mixins.

Remove any use of these mixins in your own Sass. You can replace these mixins with direct references to the [spacing mixins](https://design-system.service.gov.uk/styles/spacing/#spacing-on-custom-components)

This change was introduced in [pull request #2385: Remove deprecated `govuk-main-wrapper` and `govuk-main-wrapper--l` mixins](https://github.com/alphagov/govuk-frontend/pull/2385).

#### Remove deprecated `$govuk-border-width-form-element-error` variable
In [GOV.UK Frontend version 3.8.0](https://github.com/alphagov/govuk-frontend/releases/tag/v3.8.0), we made the border width of form elements in their error state the same as for form elements in their normal state, and deprecated the `$govuk-border-width-form-element-error` variable.

Expand Down
45 changes: 15 additions & 30 deletions src/govuk/objects/_main-wrapper.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,37 +21,22 @@
// </div>
// </div>

/// @deprecated Replace this mixin with more direct references to the [spacing
/// mixins](https://design-system.service.gov.uk/styles/spacing/#spacing-on-custom-components).
@mixin govuk-main-wrapper {
// In IE11 the `main` element can be used, but is not recognized –
// meaning it's not defined in IE's default style sheet,
// so it uses CSS initial value, which is inline.
display: block;
padding-top: govuk-spacing(4);
padding-bottom: govuk-spacing(4);

@include govuk-media-query($from: tablet) {
// This spacing is manually adjusted to replicate the margin of
// govuk-heading-xl (50px) minus the spacing of back link and
// breadcrumbs (10px)
padding-top: govuk-spacing(7);
padding-bottom: govuk-spacing(7);
}
}

/// Use govuk-main-wrapper--l when you page does not have Breadcrumbs, phase
/// banners or back links.
///
/// @deprecated Replace this mixin with more direct references to the [spacing
/// mixins](https://design-system.service.gov.uk/styles/spacing/#spacing-on-custom-components).
@mixin govuk-main-wrapper--l {
@include govuk-responsive-padding(8, "top");
}

@include govuk-exports("govuk/objects/main-wrapper") {
.govuk-main-wrapper {
@include govuk-main-wrapper;
// In IE11 the `main` element can be used, but is not recognized –
// meaning it's not defined in IE's default style sheet,
// so it uses CSS initial value, which is inline.
display: block;
padding-top: govuk-spacing(4);
padding-bottom: govuk-spacing(4);

@include govuk-media-query($from: tablet) {
// This spacing is manually adjusted to replicate the margin of
// govuk-heading-xl (50px) minus the spacing of back link and
// breadcrumbs (10px)
padding-top: govuk-spacing(7);
padding-bottom: govuk-spacing(7);
}
}

// Using the `.govuk-main-wrapper--auto-spacing` modifier should apply the
Expand All @@ -63,6 +48,6 @@
// `govuk-main-wrapper--l` modifier instead.
.govuk-main-wrapper--auto-spacing:first-child,
.govuk-main-wrapper--l {
@include govuk-main-wrapper--l;
@include govuk-responsive-padding(8, "top");
}
}