@lucca-front/scss 20.3.0-rc.2 → 20.3.0-rc.4

package/src/components/tableOfContent/index.scss

@@ -1,46 +1,42 @@
 @use 'exports' as *;
 
 .tableOfContent {
-	@layer components {
-		@include vars;
-		@include component;
-	}
+	@include vars;
+	@include component;
 }
 
 .tableOfContent-list-item-action {
-	@layer states {
-		&:not(.disabled, .is-disabled, [disabled]) {
+	&:not(.disabled, .is-disabled, [disabled]) {
+		&:is(:hover) {
+			@include hover;
+		}
+
+		&:is(:focus) {
+			@include focus;
+		}
+
+		&:is(:active) {
+			@include active;
+		}
+
+		&.is-active {
+			@include isActive;
+
 			&:is(:hover) {
-				@include hover;
+				@include isActiveHover;
 			}
 
 			&:is(:focus) {
-				@include focus;
+				@include isActiveFocus;
 			}
 
 			&:is(:active) {
-				@include active;
-			}
-
-			&.is-active {
-				@include isActive;
-
-				&:is(:hover) {
-					@include isActiveHover;
-				}
-
-				&:is(:focus) {
-					@include isActiveFocus;
-				}
-
-				&:is(:active) {
-					@include isActiveActive;
-				}
+				@include isActiveActive;
 			}
 		}
+	}
 
-		&:is(.disabled, .is-disabled, [disabled]) {
-			@include disabled;
-		}
+	&:is(.disabled, .is-disabled, [disabled]) {
+		@include disabled;
 	}
 }

package/src/components/tableSortable/index.scss

@@ -1,40 +1,34 @@
 @use 'exports' as *;
 
 .tableSortable.button {
-	@layer components {
-		@include vars;
-		@include component;
-	}
+	@include vars;
+	@include component;
 }
 
 .table-head-row-cell,
 .dataTable-head-row-cell,
 .indexTable-head-row-cell {
-	@layer mods {
-		&.mod-alignRight {
-			.tableSortable {
-				@include sortAlignRight;
-			}
+	&.mod-alignRight {
+		.tableSortable {
+			@include sortAlignRight;
 		}
+	}
 
-		&.mod-alignCenter {
-			.tableSortable {
-				@include sortAlignCenter;
-			}
+	&.mod-alignCenter {
+		.tableSortable {
+			@include sortAlignCenter;
 		}
 	}
 
-	@layer states {
-		&[aria-sort='ascending'] {
-			.tableSortable{
-				@include sortAscending;
-			}
+	&[aria-sort='ascending'] {
+		.tableSortable{
+			@include sortAscending;
 		}
+	}
 
-		&[aria-sort='descending'] {
-			.tableSortable {
-				@include sortDescending;
-			}
+	&[aria-sort='descending'] {
+		.tableSortable {
+			@include sortDescending;
 		}
 	}
 }

package/src/components/tableSticked/index.scss

@@ -3,43 +3,39 @@
 @use 'exports' as *;
 
 .table {
-	@layer components {
-		@include vars;
-	}
+	@include vars;
 
-	@layer mods {
-		// For both mod-stickyColumn + responsive variant
-		&[class*='mod-stickyColumn'] {
-			@include stickyColumn;
-		}
+	// For both mod-stickyColumn + responsive variant
+	&[class*='mod-stickyColumn'] {
+		@include stickyColumn;
+	}
 
-		&.mod-stickyColumn {
-			@include stickyColumnOffset;
-		}
+	&.mod-stickyColumn {
+		@include stickyColumnOffset;
+	}
 
-		@each $breakpoint, $value in config.$breakpoints {
-			@include media.min($breakpoint) {
-				&.mod-stickyColumnAtMediaMin#{$breakpoint} {
-					@include stickyColumnOffset;
-				}
+	@each $breakpoint, $value in config.$breakpoints {
+		@include media.min($breakpoint) {
+			&.mod-stickyColumnAtMediaMin#{$breakpoint} {
+				@include stickyColumnOffset;
 			}
 		}
+	}
 
-		// For both stickyHeader + -withBanner variant
-		&[class*='mod-stickyHeader'] {
-			@include stickyHeaderCommon;
+	// For both stickyHeader + -withBanner variant
+	&[class*='mod-stickyHeader'] {
+		@include stickyHeaderCommon;
 
-			.mod-stickyHeader-shadow {
-				@include stickyHeaderShadow;
-			}
+		.mod-stickyHeader-shadow {
+			@include stickyHeaderShadow;
 		}
+	}
 
-		&.mod-stickyHeader {
-			@include stickyHeader;
-		}
+	&.mod-stickyHeader {
+		@include stickyHeader;
+	}
 
-		&.mod-stickyHeader-withBanner {
-			@include stickyHeaderBanner;
-		}
+	&.mod-stickyHeader-withBanner {
+		@include stickyHeaderBanner;
 	}
 }

package/src/components/tableSticked/mods.scss

@@ -104,9 +104,9 @@
 	}
 }
 
-// *****
-// Sticky header
-// ****
+/*****
+ Sticky header
+****/
 
 @mixin stickyHeader {
 	.table-head-row-cell {
@@ -144,9 +144,9 @@
 	}
 }
 
-// *****
-// Sticky header drop shadow
-// ****
+/*****
+ Sticky header drop shadow
+****/
 
 @mixin stickyHeaderShadow {
 	.indexTable-head-row-cell,

package/src/components/tableStickedDeprecated/index.scss

@@ -3,74 +3,68 @@
 @use 'exports' as *;
 
 .table {
-	@layer components {
-		@include vars;
-	}
+	@include vars;
 
-	@layer mods {
-		&.mod-stickyColumn {
-			@include stickyColumn;
-		}
+	&.mod-stickyColumn {
+		@include stickyColumn;
+	}
 
-		@each $breakpoint, $value in config.$breakpoints {
-			@include media.min($breakpoint) {
-				&.mod-stickyColumn\@mediaMin#{$breakpoint} {
-					@include stickyColumn;
-				}
+	@each $breakpoint, $value in config.$breakpoints {
+		@include media.min($breakpoint) {
+			&.mod-stickyColumn\@mediaMin#{$breakpoint} {
+				@include stickyColumn;
 			}
 		}
+	}
 
-		&.mod-stickyColumn-shadow {
-			@include shadow;
-		}
+	&.mod-stickyColumn-shadow {
+		@include shadow;
+	}
 
-		&[class*='mod-stickyColumn'] {
-			.table-head-row-cell,
-			.table-body-row-cell,
-			.table-foot-row-cell {
-				@for $i from 0 through 50 {
-					&.mod-stickyColumn-leftOffset#{$i} {
-						@include leftOffset($i);
-					}
+	&[class*='mod-stickyColumn'] {
+		.table-head-row-cell,
+		.table-body-row-cell,
+		.table-foot-row-cell {
+			@for $i from 0 through 50 {
+				&.mod-stickyColumn-leftOffset#{$i} {
+					@include leftOffset($i);
+				}
 
-					&.mod-stickyColumn-rightOffset#{$i} {
-						@include rightOffset($i);
-					}
+				&.mod-stickyColumn-rightOffset#{$i} {
+					@include rightOffset($i);
 				}
 			}
 		}
+	}
 
-		[class*='sticky'][class*='shadow-wrapper'] {
-			@include wrapper;
-		}
+	[class*='sticky'][class*='shadow-wrapper'] {
+		@include wrapper;
+	}
 
-		&[class*='mod-stickyHeader'] {
-			@include stickyHeaderCommon;
+	&[class*='mod-stickyHeader'] {
+		@include stickyHeaderCommon;
 
-			@each $breakpoint, $value in config.$breakpoints {
-				@include media.max($breakpoint) {
-					&.mod-stickyColumn\@mediaMin#{$breakpoint} {
-						@include stickyColumnBreakpoint;
-					}
+		@each $breakpoint, $value in config.$breakpoints {
+			@include media.max($breakpoint) {
+				&.mod-stickyColumn\@mediaMin#{$breakpoint} {
+					@include stickyColumnBreakpoint;
 				}
 			}
 		}
+	}
 
-		&.mod-stickyHeader {
-			@include stickyHeader;
-		}
+	&.mod-stickyHeader {
+		@include stickyHeader;
+	}
 
-		&.mod-stickyHeader-withBanner {
-			@include stickyHeaderBanner;
-		}
+	&.mod-stickyHeader-withBanner {
+		@include stickyHeaderBanner;
 	}
 }
 
 .table-body-row,
 .table-foot-row {
-	@layer mods {
-		&.mod-stickyHeader-shadow {
-			@include stickyHeaderShadow;
-		}
+	&.mod-stickyHeader-shadow {
+		@include stickyHeaderShadow;
 	}
 }

package/src/components/tag/index.scss

@@ -1,42 +1,36 @@
 @use 'exports' as *;
 
 .tag {
-	@layer components {
-		@include vars;
-		@include component;
-	}
+	@include vars;
+	@include component;
 
-	@layer mods {
-		&.mod-S {
-			@include S;
-		}
+	&.mod-S {
+		@include S;
+	}
 
-		&.mod-L {
-			@include L;
-		}
+	&.mod-L {
+		@include L;
+	}
 
-		// .mod-clickable is deprecated
-		&:is(a, button),
-		&.mod-clickable {
-			@include clickable;
-		}
+	// .mod-clickable is deprecated
+	&:is(a, button),
+	&.mod-clickable {
+		@include clickable;
+	}
 
-		&.mod-outlined {
-			@include outlined;
-		}
+	&.mod-outlined {
+		@include outlined;
+	}
 
-		&.mod-AI {
-			@include AI;
-		}
+	&.mod-disabled {
+		@include disabled;
 	}
 
-	@layer states {
-		&.mod-disabled {
-			@include disabled;
-		}
+	&:has(.tag-content:focus-visible) {
+		@include focusVisible;
+	}
 
-		&:has(.tag-content:focus-visible) {
-			@include focusVisible;
-		}
+	&.mod-AI {
+		@include AI;
 	}
 }

package/src/components/textField/index.scss

@@ -1,45 +1,37 @@
 @use 'exports' as *;
 
 .textField {
-	@layer components {
-		@include vars;
-		@include component;
-	}
+	@include vars;
+	@include component;
 
-	@layer mods {
-		&.mod-S {
-			@include S;
-		}
+	&.mod-S {
+		@include S;
+	}
 
-		&.mod-XS {
-			@include XS;
-		}
+	&.mod-XS {
+		@include XS;
+	}
 
-		&.mod-valueAlignRight {
-			@include valueAlignRight;
-		}
+	&.mod-valueAlignRight {
+		@include valueAlignRight;
 	}
 
-	@layer states {
-		&.is-invalid,
-		&:has(.textField-input-value[aria-invalid='true']) {
-			@include invalid;
-		}
+	&.is-invalid,
+	&:has(.textField-input-value[aria-invalid='true']) {
+		@include invalid;
+	}
 
-		&.is-disabled,
-		&:has(.textField-input-value:disabled) {
-			@include disabled;
-		}
+	&.is-disabled,
+	&:has(.textField-input-value:disabled) {
+		@include disabled;
 	}
 
-	@layer mods {
-		&.mod-autoResize {
-			@include autoResize;
-		}
+	&.mod-autoResize {
+		@include autoResize;
+	}
 
-		&.mod-filterPill {
-			@include filterPill;
-		}
+	&.mod-filterPill {
+		@include filterPill;
 	}
 
 	&.is-lineThrough {

package/src/components/textField/mods.scss

@@ -77,7 +77,7 @@
 		visibility: hidden;
 
 		&::after {
-			// stylelint-disable-next-line no-irregular-whitespace
+			/* stylelint-disable-next-line no-irregular-whitespace */
 			content: ' ' / '';
 		}
 	}

package/src/components/textFlow/index.scss

@@ -1,8 +1,6 @@
 @use 'exports' as *;
 
 .textFlow {
-	@layer components {
-		@include vars;
-		@include component;
-	}
+	@include vars;
+	@include component;
 }