refactor(icons): extracted icons mixin related files #526

mfranzke · mfranzke · commit f2eda31595a9 · 2023-08-01T10:08:50.000+02:00
diff --git a/source/_patterns/00-base/icons/_icon.scss b/source/_patterns/00-base/icons/_icon.scss
@@ -0,0 +1,4 @@
+// This file is meant to get included within internal or even imported externally in case of that somebody wants to use the icon mixin
+@import "icons.variables";
+@import "icons.helpers";
+@import "icons.placeholder";
diff --git a/source/_patterns/01-elements/buttons/_button.variables.scss b/source/_patterns/01-elements/buttons/_button.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 // We want to set the alpha value and that for need the long form hex code
 // stylelint-disable color-hex-length
diff --git a/source/_patterns/01-elements/buttons/button.scss b/source/_patterns/01-elements/buttons/button.scss
@@ -1,5 +1,6 @@
 @charset "utf-8";
 
+@import "../../00-base/icons/icon";
 @import "button.variables";
 
 .elm-button {
diff --git a/source/_patterns/01-elements/checkbox/_checkbox.variables.scss b/source/_patterns/01-elements/checkbox/_checkbox.variables.scss
@@ -1,5 +1,3 @@
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 @import "../../00-base/colors/colors.variables";
 
 $checkbox---backgroundColor: rgba(255, 255, 255, 0.1) !default;
diff --git a/source/_patterns/01-elements/checkbox/checkbox.scss b/source/_patterns/01-elements/checkbox/checkbox.scss
@@ -1,6 +1,7 @@
 @charset "utf-8";
 
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "checkbox.variables";
 
 .elm-checkbox {
diff --git a/source/_patterns/01-elements/link/_link.variables.scss b/source/_patterns/01-elements/link/_link.variables.scss
@@ -1,6 +1,4 @@
-@import "../../00-base/icons/icons.variables";
 @import "../../00-base/colors/colors.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $link--disabled-opacity: 0.4 !default;
 $link-reaMain--color: $db-color-cyan-600 !default;
diff --git a/source/_patterns/01-elements/link/link.scss b/source/_patterns/01-elements/link/link.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "link.variables";
 
 .elm-link {
diff --git a/source/_patterns/02-components/accordion/_accordion.variables.scss b/source/_patterns/02-components/accordion/_accordion.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $accordion---paddingLeft: 46 !default;
 $accordion---paddingRight: to-rem(
diff --git a/source/_patterns/02-components/accordion/accordion.scss b/source/_patterns/02-components/accordion/accordion.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "accordion.variables";
 
 .cmp-accordion {
diff --git a/source/_patterns/02-components/breadcrumb/_breadcrumb.variables.scss b/source/_patterns/02-components/breadcrumb/_breadcrumb.variables.scss
@@ -1,5 +1,3 @@
-@import "../../00-base/icons/icons.helpers";
-@import "../../00-base/icons/icons.variables";
 @import "../../00-base/colors/colors.variables";
 
 $breadcrumb-divider--icon: "chevron-right" !default;
diff --git a/source/_patterns/02-components/breadcrumb/breadcrumb.scss b/source/_patterns/02-components/breadcrumb/breadcrumb.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "breadcrumb.variables";
 
 .cmp-breadcrumb {
diff --git a/source/_patterns/02-components/dialog/_dialog.variables.scss b/source/_patterns/02-components/dialog/_dialog.variables.scss
@@ -1,5 +1,3 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $dialog-backdrop--backgroundColor: rgba(0, 0, 0, 0.9) !default;
diff --git a/source/_patterns/02-components/dialog/dialog.scss b/source/_patterns/02-components/dialog/dialog.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "dialog.variables";
 
 .cmp-dialog {
diff --git a/source/_patterns/02-components/dropdown/_dropdown.variables.scss b/source/_patterns/02-components/dropdown/_dropdown.variables.scss
@@ -1,3 +1 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
diff --git a/source/_patterns/02-components/dropdown/dropdown.scss b/source/_patterns/02-components/dropdown/dropdown.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "../overflow-menu/overflow-menu";
 @import "dropdown.variables";
 
diff --git a/source/_patterns/02-components/language-switcher/_language-switcher.variables.scss b/source/_patterns/02-components/language-switcher/_language-switcher.variables.scss
@@ -1,3 +1 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.helpers";
-@import "../../00-base/icons/icons.variables";
diff --git a/source/_patterns/02-components/language-switcher/language-switcher.scss b/source/_patterns/02-components/language-switcher/language-switcher.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "language-switcher.variables";
 
 .cmp-language-switcher {
diff --git a/source/_patterns/02-components/link-list/_link-list.variables.scss b/source/_patterns/02-components/link-list/_link-list.variables.scss
@@ -1,3 +1 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
diff --git a/source/_patterns/02-components/link-list/link-list.scss b/source/_patterns/02-components/link-list/link-list.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "link-list.variables";
 
 .cmp-link-list {
diff --git a/source/_patterns/02-components/mainnavigation/_mainnavigation.variables.scss b/source/_patterns/02-components/mainnavigation/_mainnavigation.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $header-big-link-paddingTop: 32 * 0.0625 !default;
 $header---backgroundColor: #fdfdfd !default; // TODO: This would need to get replaced by the correct (semantic) color
diff --git a/source/_patterns/02-components/mainnavigation/mainnavigation.scss b/source/_patterns/02-components/mainnavigation/mainnavigation.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 // TODO: Replace magic numbers e.g. with flexbox implementations and extract variables as well for multi-brand
 @import "mainnavigation.variables";
 
diff --git a/source/_patterns/02-components/overflow-menu/_overflow-menu.variables.scss b/source/_patterns/02-components/overflow-menu/_overflow-menu.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $overflowMenu---borderRadius: 8px !default;
 $overflowMenu---backgroundColor: #fff !default;
diff --git a/source/_patterns/02-components/overflow-menu/overflow-menu.scss b/source/_patterns/02-components/overflow-menu/overflow-menu.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "overflow-menu.variables";
 
 .cmp-overflow-menu {
diff --git a/source/_patterns/02-components/pagination/_pagination.variables.scss b/source/_patterns/02-components/pagination/_pagination.variables.scss
@@ -1,3 +1 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
diff --git a/source/_patterns/02-components/pagination/pagination.scss b/source/_patterns/02-components/pagination/pagination.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "pagination.variables";
 
 .cmp-pagination {
diff --git a/source/_patterns/02-components/sidenavi/_sidenavi.variables.scss b/source/_patterns/02-components/sidenavi/_sidenavi.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $sidenavi-link--color: $db-color-cool-gray-200 !default;
 $sidenavi-linkCurrent-hover-color: $db-color-cool-gray-600 !default;
diff --git a/source/_patterns/02-components/sidenavi/sidenavi.scss b/source/_patterns/02-components/sidenavi/sidenavi.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "sidenavi.variables";
 
 .cmp-sidenavi {
diff --git a/source/_patterns/02-components/sitesearch/_sitesearch.variables.scss b/source/_patterns/02-components/sitesearch/_sitesearch.variables.scss
@@ -1,6 +1,4 @@
 @import "../../../css/helpers/functions";
-@import "../../00-base/icons/icons.variables";
-@import "../../00-base/icons/icons.helpers";
 
 $sitesearch-form-full-maxWidth: to-rem(
 	$pxValue: 500
diff --git a/source/_patterns/02-components/sitesearch/sitesearch.scss b/source/_patterns/02-components/sitesearch/sitesearch.scss
@@ -1,4 +1,5 @@
 @import "../../../css/partials.meta";
+@import "../../00-base/icons/icon";
 @import "sitesearch.variables";
 
 .cmp-sitesearch {

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,3 @@`
`1`		`-@import "../../00-base/icons/icons.variables";`
`2`		`-@import "../../00-base/icons/icons.helpers";`
`3`	`1`	`@import "../../00-base/colors/colors.variables";`
`4`	`2`
`5`	`3`	`$checkbox---backgroundColor: rgba(255, 255, 255, 0.1) !default;`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`@import "../../../css/partials.meta";`
	`2`	`+@import "../../00-base/icons/icon";`
`2`	`3`	`@import "link.variables";`
`3`	`4`
`4`	`5`	`.elm-link {`