fix: revert stylelint change

fluid-project · Feb 2, 2024 · b68b635 · b68b635
1 parent 5bba4a4
commit b68b635
Show file tree

Hide file tree

Showing 29 changed files with 1,252 additions and 1,253 deletions.
diff --git a/.stylelintrc.js b/.stylelintrc.js
@@ -5,7 +5,6 @@ module.exports = {
     plugins: ["stylelint-use-logical-spec"],
     ignoreFiles: ["_site/**/*.scss"],
     rules: {
-        indentation: 4,
         "custom-property-pattern": null,
         "import-notation": "string",
         "scss/at-if-closing-brace-space-after": null,

diff --git a/src/assets/styles/abstracts/_mixins.scss b/src/assets/styles/abstracts/_mixins.scss
@@ -4,99 +4,99 @@
 
 // Media query breakpoint calculations
 @mixin breakpoint-up($name, $breakpoints: variables.$breakpoints) {
-    $min: map-get($breakpoints, $name);
+  $min: map-get($breakpoints, $name);
 
-    @if $min {
-        @media (min-width: $min) {
-            @content;
-        }
-    }
-    @else {
-        @content;
+  @if $min {
+    @media (min-width: $min) {
+      @content;
     }
+  }
+  @else {
+    @content;
+  }
 }
 
 @mixin breakpoint-down($name, $breakpoints: variables.$breakpoints) {
-    $max: map-get($breakpoints, $name);
+  $max: map-get($breakpoints, $name);
 
-    @if $max {
-        @media (max-width: $max) {
-            @content;
-        }
-    }
-    @else {
-        @content;
+  @if $max {
+    @media (max-width: $max) {
+      @content;
     }
+  }
+  @else {
+    @content;
+  }
 }
 
 // Brand component focus & hover style overrides
 @mixin brand-focus-hover() {
-    background: unset;
-    border-radius: unset;
-    margin-inline: unset;
-    outline: solid 0.3125rem var(--darkRed);
+  background: unset;
+  border-radius: unset;
+  margin-inline: unset;
+  outline: solid 0.3125rem var(--darkRed);
 }
 
 // Menu link focus & hover style overrides
 @mixin menu-link-focus-hover-narrow() {
-    background-color: var(--darkRed);
-    border-radius: unset;
-    color: var(--menuExpandedSelectedColour);
-    margin: unset;
-    outline-color: transparent;
-    padding-block: unset;
+  background-color: var(--darkRed);
+  border-radius: unset;
+  color: var(--menuExpandedSelectedColour);
+  margin: unset;
+  outline-color: transparent;
+  padding-block: unset;
 }
 
 @mixin menu-link-focus-hover-wide() {
-    background-color: inherit;
-    border-block-end: 0.625rem solid var(--darkRed);
-    color: currentcolor;
-    margin-inline-start: 0;
+  background-color: inherit;
+  border-block-end: 0.625rem solid var(--darkRed);
+  color: currentcolor;
+  margin-inline-start: 0;
 }
 
 // Audio-tactile card section-specific colour overrides
 @mixin card-section-colour-override($selector, $colour) {
-    #{$selector} {
-        &.legend__list {
-            border-color: $colour;
-        }
-
-        .section__toggle {
-            &:hover .section__title {
-                border-color: var(--fl-buttonFgColor, $colour);
-            }
-
-            &--expanded .section__title {
-                background: $colour;
-            }
-        }
-
-        .section__content {
-            border-color: $colour;
-        }
-
-        .section__icon {
-            background-color: var(--fl-buttonFgColor, $colour);
-        }
-
-        .section__title {
-            border-color: var(--fl-buttonBgColor, $colour);
-        }
-
-        .subsection__icon svg {
-            --icon-arrowColour: var(--fl-buttonFgColor, #{$colour});
-        }
-
-        .card__title {
-            background-color: var(--fl-buttonFgColor, $colour);
-        }
-
-        .card__details {
-            border-color: $colour;
-        }
-
-        .card__icon svg {
-            --icon-arrowColour: #{$colour};
-        }
+  #{$selector} {
+    &.legend__list {
+      border-color: $colour;
+    }
+
+    .section__toggle {
+      &:hover .section__title {
+        border-color: var(--fl-buttonFgColor, $colour);
+      }
+
+      &--expanded .section__title {
+        background: $colour;
+      }
+    }
+
+    .section__content {
+      border-color: $colour;
+    }
+
+    .section__icon {
+      background-color: var(--fl-buttonFgColor, $colour);
+    }
+
+    .section__title {
+      border-color: var(--fl-buttonBgColor, $colour);
+    }
+
+    .subsection__icon svg {
+      --icon-arrowColour: var(--fl-buttonFgColor, #{$colour});
+    }
+
+    .card__title {
+      background-color: var(--fl-buttonFgColor, $colour);
+    }
+
+    .card__details {
+      border-color: $colour;
+    }
+
+    .card__icon svg {
+      --icon-arrowColour: #{$colour};
     }
+  }
 }
diff --git a/src/assets/styles/abstracts/_variables.scss b/src/assets/styles/abstracts/_variables.scss
@@ -2,68 +2,68 @@
 // @see https://github.com/twbs/bootstrap/blob/master/scss/mixins/_breakpoints.scss
 
 $breakpoints: (
-    xs: 17.5rem,
-    sm: 40rem,
-    md: 48rem,
-    md-lg: 55rem,
-    lg: 75rem,
-    xl: 85rem
+  xs: 17.5rem,
+  sm: 40rem,
+  md: 48rem,
+  md-lg: 55rem,
+  lg: 75rem,
+  xl: 85rem
 );
 
 // Used within SVGs to respond to UIO Contrast Theme changes
 // TODO: Consider moving this to shame.scss, if such a file is created,
 //       or perhaps into _vendors.scss since this rules are UIO-specific
 footer,
 header {
-    --ildh-wordmark-colour: var(--fl-bgColor, #fff);
-    --ildh-wordmark-text-colour: var(--fl-fgColor, #000);
+  --ildh-wordmark-colour: var(--fl-bgColor, #fff);
+  --ildh-wordmark-text-colour: var(--fl-fgColor, #000);
 }
 
 :root {
-    /** Typography **/
-    --family-sans-serif: "WorkSans", sans-serif;
-    --family-serif: "Literata", serif;
-    --font-weight-normal: 400;
-    --font-weight-medium: 500;
-    --font-weight-semibold: 600;
-    --font-weight-bold: 700;
+  /** Typography **/
+  --family-sans-serif: "WorkSans", sans-serif;
+  --family-serif: "Literata", serif;
+  --font-weight-normal: 400;
+  --font-weight-medium: 500;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
 
-    /** Colors **/
-    --darkRed: var(--fl-fgColor, #8d2a2d); // this colour has several uses
-    --darkGrey: var(--fl-bgColor, #e5eaeb);
-    --darkTeal: var(--fl-fgColor, #134d5f);
-    --mediumTeal: #0b719e;
-    --teal: var(--fl-fgColor, #1e97bd);
-    --mainColour: var(--fl-fgColor, #000);
-    --linkColour: var(--fl-linkColor, #0645ad);
-    --headerOrgColour: var(--fl-bgColor, #000);
-    --headerOrgLinkColour: var(--fl-linkColor, #000);
-    --headerOrgBackgroundColour: var(--fl-bgColor, #fff);
-    --footerColour: var(--fl-fgColor, #fff);
-    --footerBGColour: var(--fl-bgColor, #153647);
-    --footerLinkColour: var(--fl-linkColor, var(--fl-fgColor, #cfca6f));
-    --rootContentColour: var(--fl-bgColor, #000);
-    --rootContentBackgroundColour: var(--fl-bgColor, #f3f7f9);
-    --topicContentBackgroundColour: var(--fl-bgColor, #f9faf6);
-    --linkFocusHoverBackgroundColour: var(--fl-bgColor, #f8e886);
-    --menuExpandedColour: var(--fl-fgColor, #000);
-    --menuExpandedSelectedColour: var(--fl-bgColor, #fff);
-    --sectionBGColour: var(--fl-bgColor, #fff);
-    --articleContentsBorderColour: var(--fl-bgColor, #bedee4);
-    --articleContentsIconColour: var(--fl-fgColor, #12699a);
-    --toolkitsHeadingColour: var(--fl-fgColor, #095a7d);
-    --sideContentLinkColour: var(--fl-linkColor, #2148a8);
-    --homeIntroColour: var(--fl-fgColor, #235064);
-    --homeIntroBGColour: var(--fl-bgColor, #fff);
-    --homeDetailsBGColour: var(--fl-bgColor, #f9faf5);
+  /** Colors **/
+  --darkRed: var(--fl-fgColor, #8d2a2d); // this colour has several uses
+  --darkGrey: var(--fl-bgColor, #e5eaeb);
+  --darkTeal: var(--fl-fgColor, #134d5f);
+  --mediumTeal: #0b719e;
+  --teal: var(--fl-fgColor, #1e97bd);
+  --mainColour: var(--fl-fgColor, #000);
+  --linkColour: var(--fl-linkColor, #0645ad);
+  --headerOrgColour: var(--fl-bgColor, #000);
+  --headerOrgLinkColour: var(--fl-linkColor, #000);
+  --headerOrgBackgroundColour: var(--fl-bgColor, #fff);
+  --footerColour: var(--fl-fgColor, #fff);
+  --footerBGColour: var(--fl-bgColor, #153647);
+  --footerLinkColour: var(--fl-linkColor, var(--fl-fgColor, #cfca6f));
+  --rootContentColour: var(--fl-bgColor, #000);
+  --rootContentBackgroundColour: var(--fl-bgColor, #f3f7f9);
+  --topicContentBackgroundColour: var(--fl-bgColor, #f9faf6);
+  --linkFocusHoverBackgroundColour: var(--fl-bgColor, #f8e886);
+  --menuExpandedColour: var(--fl-fgColor, #000);
+  --menuExpandedSelectedColour: var(--fl-bgColor, #fff);
+  --sectionBGColour: var(--fl-bgColor, #fff);
+  --articleContentsBorderColour: var(--fl-bgColor, #bedee4);
+  --articleContentsIconColour: var(--fl-fgColor, #12699a);
+  --toolkitsHeadingColour: var(--fl-fgColor, #095a7d);
+  --sideContentLinkColour: var(--fl-linkColor, #2148a8);
+  --homeIntroColour: var(--fl-fgColor, #235064);
+  --homeIntroBGColour: var(--fl-bgColor, #fff);
+  --homeDetailsBGColour: var(--fl-bgColor, #f9faf5);
 
-    /** Dimensions **/
-    --banner-height: 20px;
-    --banner-height-large: 42px;
-    --banner-height-full: 88px;
-    --banner-height-full-large: 171px;
-    --max-content-width: 69rem;
-    --xl-content-width: 95rem;
-    --narrow-content-width: 50rem;
-    --footer-max-width: 90rem;
+  /** Dimensions **/
+  --banner-height: 20px;
+  --banner-height-large: 42px;
+  --banner-height-full: 88px;
+  --banner-height-full-large: 171px;
+  --max-content-width: 69rem;
+  --xl-content-width: 95rem;
+  --narrow-content-width: 50rem;
+  --footer-max-width: 90rem;
 }