refactor(scss): ♻️ rename reset mixins

Amsterdam · Nov 1, 2024 · ae1acf2 · ae1acf2
1 parent 7fa06e6
commit ae1acf2
Show file tree

Hide file tree

Showing 21 changed files with 43 additions and 43 deletions.
diff --git a/packages/css/src/components/blockquote/blockquote.scss b/packages/css/src/components/blockquote/blockquote.scss
@@ -6,7 +6,7 @@
 @import "../../common/hyphenation";
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-blockquote {
   box-sizing: border-box;
   margin-block: 0;
   margin-inline: 0;
@@ -23,7 +23,7 @@
 
   @include hyphenation;
   @include text-rendering;
-  @include reset;
+  @include reset-blockquote;
 
   &::before {
     content: open-quote;

diff --git a/packages/css/src/components/breadcrumb/breadcrumb.scss b/packages/css/src/components/breadcrumb/breadcrumb.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-list {
   box-sizing: border-box;
   margin-block: 0;
   padding-inline: 0;
@@ -23,7 +23,7 @@
   break-inside: avoid;
 
   @include text-rendering;
-  @include reset;
+  @include reset-list;
 }
 
 .ams-breadcrumb__item {

diff --git a/packages/css/src/components/date-input/date-input.scss b/packages/css/src/components/date-input/date-input.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-input {
   -webkit-appearance: none; // Reset appearance for Safari < 15.4
   appearance: none; // Reset native appearance, this causes issues on iOS and Android devices
   border: 0;
@@ -36,7 +36,7 @@
   touch-action: manipulation;
 
   @include text-rendering;
-  @include reset;
+  @include reset-input;
 
   &:hover {
     box-shadow: var(--ams-date-input-hover-box-shadow);

diff --git a/packages/css/src/components/description-list/description-list.scss b/packages/css/src/components/description-list/description-list.scss
@@ -6,7 +6,7 @@
 @import "../../common/breakpoint";
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-ol {
   box-sizing: border-box;
   margin-block: 0;
 }
@@ -20,7 +20,7 @@
   line-height: var(--ams-description-list-line-height);
   row-gap: var(--ams-description-list-row-gap);
 
-  @include reset;
+  @include reset-ol;
   @include text-rendering;
 }
 

diff --git a/packages/css/src/components/error-message/error-message.scss b/packages/css/src/components/error-message/error-message.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-paragraph {
   box-sizing: border-box;
   margin-block: 0;
 }
@@ -18,5 +18,5 @@
   line-height: var(--ams-error-message-line-height);
 
   @include text-rendering;
-  @include reset;
+  @include reset-paragraph;
 }
diff --git a/packages/css/src/components/field-set/field-set.scss b/packages/css/src/components/field-set/field-set.scss
@@ -6,7 +6,7 @@
 @import "../../common/hyphenation";
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-fieldset {
   border: 0;
   margin-inline: 0;
   padding-block: 0;
@@ -16,7 +16,7 @@
 .ams-field-set {
   break-inside: avoid;
 
-  @include reset;
+  @include reset-fieldset;
 }
 
 .ams-field-set--invalid {

diff --git a/packages/css/src/components/heading/heading.scss b/packages/css/src/components/heading/heading.scss
@@ -6,7 +6,7 @@
 @import "../../common/hyphenation";
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-heading {
   box-sizing: border-box;
   margin-block: 0;
 }
@@ -20,7 +20,7 @@
 
   @include hyphenation;
   @include text-rendering;
-  @include reset;
+  @include reset-heading;
 }
 
 .ams-heading--level-1 {

diff --git a/packages/css/src/components/icon-button/icon-button.scss b/packages/css/src/components/icon-button/icon-button.scss
@@ -3,7 +3,7 @@
  * Copyright Gemeente Amsterdam
  */
 
-@mixin reset {
+@mixin reset-button {
   border: 0;
   margin-block: 0; // [1]
   margin-inline: 0; // [1]
@@ -20,7 +20,7 @@
   outline-offset: var(--ams-icon-button-outline-offset);
   touch-action: manipulation;
 
-  @include reset;
+  @include reset-button;
 
   &:hover {
     background-color: var(--ams-icon-button-hover-background-color);

diff --git a/packages/css/src/components/ordered-list/ordered-list.scss b/packages/css/src/components/ordered-list/ordered-list.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-ol {
   box-sizing: border-box;
   list-style-type: none;
   margin-block: 0;
@@ -17,7 +17,7 @@
   gap: var(--ams-ordered-list-gap);
 
   @include text-rendering;
-  @include reset;
+  @include reset-ol;
 }
 
 .ams-ordered-list:not(.ams-ordered-list--no-markers) {

diff --git a/packages/css/src/components/page-heading/page-heading.scss b/packages/css/src/components/page-heading/page-heading.scss
@@ -6,7 +6,7 @@
 @import "../../common/hyphenation";
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-h1 {
   box-sizing: border-box;
   margin-block: 0;
 }
@@ -22,7 +22,7 @@
 
   @include hyphenation;
   @include text-rendering;
-  @include reset;
+  @include reset-h1;
 }
 
 .ams-page-heading--inverse-color {

diff --git a/packages/css/src/components/paragraph/paragraph.scss b/packages/css/src/components/paragraph/paragraph.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-paragraph {
   box-sizing: border-box;
   margin-block: 0;
 }
@@ -18,7 +18,7 @@
   line-height: var(--ams-paragraph-line-height);
 
   @include text-rendering;
-  @include reset;
+  @include reset-paragraph;
 }
 
 .ams-paragraph--small {

diff --git a/packages/css/src/components/password-input/password-input.scss b/packages/css/src/components/password-input/password-input.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-input {
   -webkit-appearance: none; // Reset appearance for Safari < 15.4
   appearance: none; // Reset native appearance, this causes issues on iOS and Android devices
   border: 0;
@@ -29,7 +29,7 @@
   touch-action: manipulation;
 
   @include text-rendering;
-  @include reset;
+  @include reset-input;
 
   &:hover {
     box-shadow: var(--ams-password-input-hover-box-shadow);

diff --git a/packages/css/src/components/screen/screen.scss b/packages/css/src/components/screen/screen.scss
@@ -3,7 +3,7 @@
  * Copyright Gemeente Amsterdam
  */
 
-@mixin reset {
+@mixin reset-div {
   box-sizing: border-box;
 }
 
@@ -12,7 +12,7 @@
   margin-inline: auto;
   position: relative;
 
-  @include reset;
+  @include reset-div;
 }
 
 .ams-screen--full-height {

diff --git a/packages/css/src/components/select/select.scss b/packages/css/src/components/select/select.scss
@@ -3,7 +3,7 @@
  * Copyright Gemeente Amsterdam
  */
 
-@mixin reset {
+@mixin reset-select {
   appearance: none; // Reset native appearance to hide default chevron
   border: 0;
   border-radius: 0; // Reset rounded borders for Safari on MacOS
@@ -23,7 +23,7 @@
   padding-inline: var(--ams-select-padding-inline);
   touch-action: manipulation;
 
-  @include reset;
+  @include reset-select;
 
   &:not([multiple]) {
     background-image: var(--ams-select-background-image);

diff --git a/packages/css/src/components/switch/switch.scss b/packages/css/src/components/switch/switch.scss
@@ -6,7 +6,7 @@
 @import "../../common/input-label-focus";
 @import "../../common/hide-input";
 
-@mixin reset {
+@mixin reset-label {
   box-sizing: border-box;
 }
 
@@ -29,7 +29,7 @@
   outline-offset: var(--ams-switch-outline-offset);
   transition: background-color 0.2s ease-in-out;
 
-  @include reset;
+  @include reset-label;
 }
 
 .ams-switch__label::before {

diff --git a/packages/css/src/components/table-of-contents/table-of-contents.scss b/packages/css/src/components/table-of-contents/table-of-contents.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-list {
   box-sizing: border-box;
   margin-block: 0;
   padding-inline: 0;
@@ -28,7 +28,7 @@
   list-style: none;
 
   @include text-rendering;
-  @include reset;
+  @include reset-list;
 
   .ams-table-of-contents__list {
     padding-block-start: var(--ams-table-of-contents-list-list-padding-block-start);

diff --git a/packages/css/src/components/text-area/text-area.scss b/packages/css/src/components/text-area/text-area.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-text-area {
   -webkit-appearance: none; // Reset appearance for Safari < 15.4
   appearance: none; // Reset native appearance, this causes issues on iOS and Android devices
   border: 0;
@@ -31,7 +31,7 @@
   touch-action: manipulation;
 
   @include text-rendering;
-  @include reset;
+  @include reset-text-area;
 
   &:hover {
     box-shadow: var(--ams-text-area-hover-box-shadow);

diff --git a/packages/css/src/components/text-input/text-input.scss b/packages/css/src/components/text-input/text-input.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-input {
   -webkit-appearance: none; // Reset appearance for Safari < 15.4
   appearance: none; // Reset native appearance, this causes issues on iOS and Android devices
   border: 0;
@@ -29,7 +29,7 @@
   touch-action: manipulation;
 
   @include text-rendering;
-  @include reset;
+  @include reset-input;
 
   &:hover {
     box-shadow: var(--ams-text-input-hover-box-shadow);

diff --git a/packages/css/src/components/time-input/time-input.scss b/packages/css/src/components/time-input/time-input.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-input {
   -webkit-appearance: none; // Reset appearance for Safari < 15.4
   appearance: none; // Reset native appearance, this causes issues on iOS and Android devices
   border: 0;
@@ -37,7 +37,7 @@
   touch-action: manipulation;
 
   @include text-rendering;
-  @include reset;
+  @include reset-input;
 
   &:hover {
     box-shadow: var(--ams-time-input-hover-box-shadow);

diff --git a/packages/css/src/components/top-task-link/top-task-link.scss b/packages/css/src/components/top-task-link/top-task-link.scss
@@ -15,7 +15,7 @@
   text-decoration: none;
 }
 
-@mixin reset {
+@mixin reset-label-or-description {
   box-sizing: border-box;
 }
 
@@ -31,7 +31,7 @@
 
   @include hyphenation;
   @include text-rendering;
-  @include reset;
+  @include reset-label-or-description;
 }
 
 .ams-top-task-link:hover .ams-top-task-link__label {
@@ -46,5 +46,5 @@
   font-weight: var(--ams-top-task-link-description-font-weight);
   line-height: var(--ams-top-task-link-description-line-height);
 
-  @include reset;
+  @include reset-label-or-description;
 }
diff --git a/packages/css/src/components/unordered-list/unordered-list.scss b/packages/css/src/components/unordered-list/unordered-list.scss
@@ -5,7 +5,7 @@
 
 @import "../../common/text-rendering";
 
-@mixin reset {
+@mixin reset-ul {
   box-sizing: border-box;
   list-style: none;
   margin-block: 0;
@@ -17,7 +17,7 @@
   gap: var(--ams-unordered-list-gap);
 
   @include text-rendering;
-  @include reset;
+  @include reset-ul;
 }
 
 .ams-unordered-list:not(.ams-unordered-list--no-markers) {