[EmptyState] Tweaks for narrow views (#2725)

* [Empty State] Reduce title size on small resolutions: * Also address buttons based on the mockups provided. * Closes #2520. * apply only on page --------- Co-authored-by: Jérémie Biron <[email protected]>
LuccaSA · Apr 12, 2024 · a1721df · a1721df
1 parent 926e47d
commit a1721df
Showing 1 changed file with 15 additions and 0 deletions.
diff --git a/packages/scss/src/components/emptyState/mods.scss b/packages/scss/src/components/emptyState/mods.scss
@@ -1,4 +1,5 @@
 @use '@lucca-front/scss/src/commons/utils/media';
+@use '@lucca-front/scss/src/components/title/exports' as title;
 
 @mixin page {
 	background-image: var(--components-emptyState-illustration-foreground-bottom-left),
@@ -18,6 +19,20 @@
 		background-color: var(--components-emptyState-background-color);
 		box-shadow: 0 0 8px 4px var(--components-emptyState-background-color);
 	}
+
+	.emptyState-content-heading {
+		@include media.max('XXS') {
+			@include title.h2;
+		}
+	}
+
+	.emptyState-actions {
+		.button {
+			@include media.max('XXS') {
+				flex-basis: 100%;
+			}
+		}
+	}
 }
 
 @mixin center {