From 0560066638bd7366b1f816587363cf1420ad6f8f Mon Sep 17 00:00:00 2001 From: Tom Byers Date: Fri, 28 Aug 2020 15:31:54 +0100 Subject: [PATCH] Change mixins-before-declarations Sass-lint rule We write our Sass to be mobile-first, meaning we declare the value for a property (for mobile) and then add all other variations (for other viewports) afterwards. Because of this, we need mixins that produce media queries to be able to follow declarations. This extension to the rule is also hinted at as good practice in the docs: https://gitlab.skotty.io/forks/sass-lint/blob/7847511b61b3ca01a86a8870c00b5a7fca94bac5/docs/rules/mixins-before-declarations.md --- app/assets/stylesheets/components/cookie-message.scss | 1 - gulpfile.js | 3 ++- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/components/cookie-message.scss b/app/assets/stylesheets/components/cookie-message.scss index f72132ab5..28684d611 100644 --- a/app/assets/stylesheets/components/cookie-message.scss +++ b/app/assets/stylesheets/components/cookie-message.scss @@ -1,6 +1,5 @@ // GOV.UK Publishing components cookie banner styles // https://github.com/alphagov/govuk_publishing_components/blob/master/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss -// sass-lint:disable mixins-before-declarations // component uses .govuk-body and .govuk-button classes from govuk-frontend @import 'core/typography'; diff --git a/gulpfile.js b/gulpfile.js index d8e8686d9..aef452c39 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -259,7 +259,8 @@ const lint = { paths.src + 'stylesheets/views/*.scss', ]) .pipe(plugins.sassLint({ - 'options': { 'formatter': 'stylish' } + 'options': { 'formatter': 'stylish' }, + 'rules': { 'mixins-before-declarations': [2, { 'exclude': ['media', 'govuk-media-query'] } ] } })) .pipe(plugins.sassLint.format()) .pipe(plugins.sassLint.failOnError());