From d36fa1b01a635a46d9e91fce425eb828cbe3edce Mon Sep 17 00:00:00 2001 From: Jani Kraner Date: Fri, 8 Jun 2018 15:07:38 +0100 Subject: [PATCH 1/2] Remove prose-scope --- app/__tests__/app.test.js | 16 ---- app/views/examples/prose-scope/index.njk | 103 ----------------------- src/core/_all.scss | 1 - src/core/_links.scss | 4 - src/core/_lists.scss | 4 - src/core/_prose-scope.scss | 57 ------------- src/core/_section-break.scss | 2 - src/core/_typography.scss | 11 --- 8 files changed, 198 deletions(-) delete mode 100644 app/views/examples/prose-scope/index.njk delete mode 100644 src/core/_prose-scope.scss diff --git a/app/__tests__/app.test.js b/app/__tests__/app.test.js index ddc28788cc..db5bb8a2aa 100644 --- a/app/__tests__/app.test.js +++ b/app/__tests__/app.test.js @@ -50,13 +50,6 @@ const requestParamsExampleLinks = { } } -const requestParamsExampleProseScope = { - url: `http://localhost:${PORT}/examples/prose-scope`, - headers: { - 'Content-Type': 'text/plain' - } -} - const requestParamsExampleTypography = { url: `http://localhost:${PORT}/examples/typography`, headers: { @@ -148,15 +141,6 @@ describe('frontend app', () => { }) }) - describe('prose scope examples', () => { - it('should resolve with a http status code of 200', done => { - request.get(requestParamsExampleProseScope, (err, res) => { - expect(res.statusCode).toEqual(200) - done(err) - }) - }) - }) - describe('template examples', () => { describe('default', () => { it('should resolve with a http status code of 200', done => { diff --git a/app/views/examples/prose-scope/index.njk b/app/views/examples/prose-scope/index.njk deleted file mode 100644 index 923ed89a5f..0000000000 --- a/app/views/examples/prose-scope/index.njk +++ /dev/null @@ -1,103 +0,0 @@ -{% from "back-link/macro.njk" import govukBackLink %} - -{% extends "layout.njk" %} - -{% block beforeContent %} - {{ govukBackLink({ - "href": "/", - "text": "Back" - }) }} -{% endblock %} - -{% block content %} - -
-
-

- Prose scope -

-
- -

H1 heading

- -

- A paragraph. This includes even more text to give a good representation - of a more average length paragraph. That way you can see more than one - line wrapping. -

- -

- This paragraph contains a link with surrounding text - which shows the link in more context. -

- -

This is a link without any surrounding text

- -

H2 heading with a link in it

- -

H3 heading immediately after an H2

- -

- A paragraph. This includes even more text to give a good representation - of a more average length paragraph. That way you can see more than one - line wrapping. -

- -

- Our guidance says to avoid using bold text in body - copy, but we still need to see what it looks like if people do. -

- -

Unordered list (ul):

- - -

Nested lists (ul with ol):

-
    -
  • apples -
      -
    1. Granny Smith
      2. -
    2. Gala
      3. -
    -
    • -
  • oranges
    • -
- -

Another H3 heading after a list

- -

An H4 heading

- -

Ordered list (ol):

- -
    -
  1. This is the first list item in the ordered list.
    2. -
  2. - This is the second list item in the ordered list which - contains a link and is very long so it spans multiple - lines. -
    3. -
  3. This is the third and final item in the ordered list.
    4. -
- -
- -

An H2 after a thematic break

- -

- A paragraph. This includes even more text to give a good representation - of a more average length paragraph. That way you can see more than one - line wrapping. -

- -
- -
-
- - - -{% endblock %} diff --git a/src/core/_all.scss b/src/core/_all.scss index dd39164fde..6acbb5fae9 100644 --- a/src/core/_all.scss +++ b/src/core/_all.scss @@ -2,6 +2,5 @@ @import "lists"; @import "template"; @import "typography"; -@import "prose-scope"; @import "section-break"; @import "global-styles"; diff --git a/src/core/_links.scss b/src/core/_links.scss index d4de885188..8307dc0c96 100644 --- a/src/core/_links.scss +++ b/src/core/_links.scss @@ -1,9 +1,5 @@ @include govuk-exports("govuk/core/links") { - // We use a placeholder class here so that we can @extend from the prose scope - // without also applying every other occurrence of the .govuk-link selector to - // the prose scope. - %govuk-link { @include govuk-link-common; @include govuk-link-style-default; diff --git a/src/core/_lists.scss b/src/core/_lists.scss index 289218c758..b7efe9ac37 100644 --- a/src/core/_lists.scss +++ b/src/core/_lists.scss @@ -1,9 +1,5 @@ @include govuk-exports("govuk/core/lists") { - // We use a placeholder class here so that we can @extend from the prose scope - // without also applying every other occurrence of the .govuk-list selector to - // the prose scope. - %govuk-list { @include govuk-font($size: 19); @include govuk-text-colour; diff --git a/src/core/_prose-scope.scss b/src/core/_prose-scope.scss deleted file mode 100644 index d706f4e02e..0000000000 --- a/src/core/_prose-scope.scss +++ /dev/null @@ -1,57 +0,0 @@ -@include govuk-exports("govuk/core/prose-scope") { - .govuk-prose-scope { - - // @extend inheritance - - // Contextual heading and paragraph combinations are inherited - // through the use of @extend - - h1 { - @extend %govuk-heading-xl; - } - - h2 { - @extend %govuk-heading-l; - } - - h3 { - @extend %govuk-heading-m; - } - - h4 { - @extend %govuk-heading-s; - } - - p { - @extend %govuk-body-m; - } - - strong, - b { - @include govuk-typography-weight-bold; - } - - ul, - ol { - @extend %govuk-list; - } - - ol { - @extend %govuk-list--number; - } - - ul { - @extend %govuk-list--bullet; - } - - a { - @extend %govuk-link; - } - - hr { - @extend %govuk-section-break; - @extend %govuk-section-break--visible; - @extend %govuk-section-break--xl; - } - } -} diff --git a/src/core/_section-break.scss b/src/core/_section-break.scss index 41de577797..b8c4dc9745 100644 --- a/src/core/_section-break.scss +++ b/src/core/_section-break.scss @@ -1,7 +1,5 @@ @include govuk-exports("govuk/core/section-break") { - // We use placeholder classes here so that we can @extend from the prose scope - %govuk-section-break { margin: 0; border: 0; diff --git a/src/core/_typography.scss b/src/core/_typography.scss index 264fff79f9..5dc693267d 100644 --- a/src/core/_typography.scss +++ b/src/core/_typography.scss @@ -1,9 +1,5 @@ @include govuk-exports("govuk/core/typography") { - // We use placeholder classes here so that we can @extend from the prose scope - // without also applying every other occurrence of the typography selectors to - // the prose scope. - // Headings %govuk-heading-xl { @@ -63,9 +59,6 @@ } // Captions to be used inside headings - // - // As these are not used in the prose scope, there is no need to use - // placeholder classes. .govuk-caption-xl { @include govuk-font($size: 27); @@ -162,10 +155,6 @@ } // Contextual adjustments - // - // Because these adjustments are made to the placeholder classes, they will - // be inherited by the prose scope as well. - // Add top padding to headings that appear directly after paragraphs. %govuk-body-l + %govuk-heading-l { From 177c7acb4dfa28f35347af66293295a210c60f82 Mon Sep 17 00:00:00 2001 From: Jani Kraner Date: Fri, 8 Jun 2018 15:17:56 +0100 Subject: [PATCH 2/2] Document in changelog --- CHANGELOG.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index ad3562d682..e56a33c185 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -139,6 +139,19 @@ Note: We're not following semantic versioning yet, we are going to talk about th has been updated to make it circular without the need for another class. ([PR #782](https://github.com/alphagov/govuk-frontend/pull/782)) +- Removal of `govuk-prose-scope` + We don't have confidence that the prose scope is well understood – + without further research / better documentation it's safer to remove it for now. + + If you are currently using prose-scope, you should revert to applying classes to + individual headings, lists and hr elements. + In version [0.0.29-alpha](https://github.com/alphagov/govuk-frontend/releases/tag/v0.0.29-alpha) + release we have added the option to enable global link and paragraph styles. + + If you're using a recent version of the Private Beta Prototype kit, + this is enabled by default. + + ([PR #778](https://github.com/alphagov/govuk-frontend/pull/778)) 🔧 Fixes: