@lucca-front/scss 16.4.1 → 16.4.3

package/src/components/form/index.scss

@@ -1,109 +1,118 @@
-@use '@lucca-front/scss/src/commons/config';
-@use '@lucca-front/scss/src/components/formLabel/exports' as formLabel;
-@use '@lucca-front/scss/src/components/inlineMessage/exports' as inlineMessage;
-@use '@lucca-front/scss/src/components/textField/exports' as textField;
-
-@use 'exports' as *;
-
-.form-field {
-	&.mod-S {
-		@include S;
-	}
-
-	&.mod-XS {
-		@include XS;
-	}
-
-	&.mod-checkable,
-	&:has(.checkboxField),
-	&:has(.switchField) {
-		@include checkable;
-	}
-
-	&:has(.textField-input-value[aria-invalid='true']) {
-		@include invalid;
-	}
-
-	&:has(.checkboxField-input:disabled) {
-		.formLabel {
-			@include formLabel.disabled;
-		}
-
-		.inlineMessage {
-			@include inlineMessage.disabled;
-		}
-	}
-}
-
-// deprecated
-
-.form {
-	@include vars;
-}
-
-.form-group {
-	@include vars;
-	@include component;
-}
-
-.form-group-line-col {
-	&[class*='mod-overlay'] {
-		@include overlay;
-	}
-
-	&.mod-overlay-top {
-		@include overlayTop;
-	}
-
-	@each $breakpoint, $value in config.$breakpoints {
-		@for $i from 1 through 12 {
-			&.mod-#{$i}\@mediaMin#{$breakpoint} {
-				@include breakpoint($breakpoint, $i);
-			}
-		}
-	}
-}
-
-.form-group-label,
-.radiosfield-label,
-.checkboxesfield-label,
-.textfield-label {
-	&:is(.is-required, .required) {
-		@include required;
-	}
-}
-
-.checkboxesfield.mod-framed,
-.radiosfield.mod-framed,
-.form.mod-framed .fieldsetWrapper {
-	@include framed;
-}
-
-.checkboxesfield.mod-framed,
-.radiosfield.mod-framed {
-	margin-top: 0;
-	padding: var(--components-field-framed-side-padding) var(--components-field-framed-side-padding)
-		var(--components-field-framed-bottom-padding);
-}
-
-.form-group-label {
-	&.is-required {
-		&:not(:empty) {
-			&::after {
-				@extend %isRequired;
-			}
-		}
-	}
-}
-
-.radiosfield-label,
-.checkboxesfield-label,
-.textfield-label {
-	&.is-required {
-		&:not(:empty) {
-			&::after {
-				@extend %isRequired;
-			}
-		}
-	}
-}
+@use '@lucca-front/scss/src/commons/config';
+@use '@lucca-front/scss/src/components/formLabel/exports' as formLabel;
+@use '@lucca-front/scss/src/components/inlineMessage/exports' as inlineMessage;
+@use '@lucca-front/scss/src/components/textField/exports' as textField;
+
+@use 'exports' as *;
+
+.form-field {
+	&.mod-S {
+		@include S;
+	}
+
+	&.mod-XS {
+		@include XS;
+	}
+
+	&.mod-withArrow {
+		@include withArrow;
+
+
+		&.mod-S {
+			@include withArrowS;
+		}
+	}
+
+	&.mod-checkable,
+	&:has(.checkboxField),
+	&:has(.switchField) {
+		@include checkable;
+	}
+
+	&:has(.textField-input-value[aria-invalid='true']) {
+		@include invalid;
+	}
+
+	&:has(.checkboxField-input:disabled) {
+		.formLabel {
+			@include formLabel.disabled;
+		}
+
+		.inlineMessage {
+			@include inlineMessage.disabled;
+		}
+	}
+}
+
+// deprecated
+
+.form {
+	@include vars;
+}
+
+.form-group {
+	@include vars;
+	@include component;
+}
+
+.form-group-line-col {
+	&[class*='mod-overlay'] {
+		@include overlay;
+	}
+
+	&.mod-overlay-top {
+		@include overlayTop;
+	}
+
+	@each $breakpoint, $value in config.$breakpoints {
+		@for $i from 1 through 12 {
+			&.mod-#{$i}\@mediaMin#{$breakpoint} {
+				@include breakpoint($breakpoint, $i);
+			}
+		}
+	}
+}
+
+.form-group-label,
+.radiosfield-label,
+.checkboxesfield-label,
+.textfield-label {
+	&:is(.is-required, .required) {
+		@include required;
+	}
+}
+
+.checkboxesfield.mod-framed,
+.radiosfield.mod-framed,
+.form.mod-framed .fieldsetWrapper {
+	@include framed;
+}
+
+.checkboxesfield.mod-framed,
+.radiosfield.mod-framed {
+	margin-top: 0;
+	padding: var(--components-field-framed-side-padding) var(--components-field-framed-side-padding)
+		var(--components-field-framed-bottom-padding);
+}
+
+.form-group-label {
+	&.is-required {
+		&:not(:empty) {
+			&::after {
+				@extend %isRequired;
+			}
+		}
+	}
+}
+
+.radiosfield-label,
+.checkboxesfield-label,
+.textfield-label {
+	&.is-required {
+		&:not(:empty) {
+			&::after {
+				@extend %isRequired;
+			}
+		}
+	}
+}