feat: add interactive homepage layout lab

This commit is contained in:
Friday authored and Nuno C. committed 2026-08-17 20:19:02 +01:00
1 parent af0e11171c
commit e62da9e2d1
4 files changed
+97

No files matched your search

+25
View File
@@ -51,6 +51,7 @@
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.5rem;
--ease-in: cubic-bezier(0.4, 0, 1, 1);
--ease-out: cubic-bezier(0, 0, 0.2, 1);
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
@@ -1219,6 +1220,9 @@
.mb-12 {
margin-bottom: calc(var(--spacing) * 12);
}
.mb-14 {
margin-bottom: calc(var(--spacing) * 14);
}
.mb-16 {
margin-bottom: calc(var(--spacing) * 16);
}
@@ -1762,6 +1766,9 @@
.rounded-2xl {
border-radius: var(--radius-2xl);
}
.rounded-3xl {
border-radius: var(--radius-3xl);
}
.rounded-\[50\%\] {
border-radius: 50%;
}
@@ -1994,6 +2001,12 @@
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 25%, transparent);
}
}
.bg-neutral\/40 {
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral), 1), 1) 40%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 40%, transparent);
}
}
.bg-neutral\/50 {
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral), 1), 1) 50%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -2948,6 +2961,9 @@
.hover\:text-primary-700:hover {
color: rgba(var(--color-primary-700), 1);
}
.hover\:text-white:hover {
color: #fff;
}
.hover\:no-underline:hover {
text-decoration-line: none;
}
@@ -3091,6 +3107,9 @@
.sm\:p-6 {
padding: calc(var(--spacing) * 6);
}
.sm\:p-8 {
padding: calc(var(--spacing) * 8);
}
.sm\:px-6 {
padding-inline: calc(var(--spacing) * 6);
}
@@ -3432,6 +3451,12 @@
.dark\:bg-neutral-900:is(.dark *) {
background-color: rgba(var(--color-neutral-900), 1);
}
.dark\:bg-neutral-900\/30:is(.dark *) {
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 30%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, rgba(var(--color-neutral-900), 1) 30%, transparent);
}
}
.dark\:bg-neutral-900\/40:is(.dark *) {
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 40%, transparent);
@supports (color: color-mix(in lab, red, red)) {