mirror of
https://github.com/nunocoracao/blowfish.git
synced 2026-11-06 02:59:49 +00:00
✨ v3 theme: glass UI, landing layout, a11y, perf, print styles
Floating glass header with ⌘K search, landing homepage layout with hero image and GitHub-stars CTA, background canvas with dissolving heroes, burufugu colour scheme, movie-quote 404, taxonomy pills, keyboard/ARIA accessibility across menus, search and tabs, idle- loaded third-party scripts, and dedicated print styles. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Nuno CoraçãoandClaude Fable 5 authored and Nuno C. committed
1 parent
5b0cd34d5b
commit
09f0573749
47 files changed
+1098
-375
No files matched your search
+264
-176
@@ -44,6 +44,7 @@
|
||||
--font-weight-bold: 700;
|
||||
--font-weight-extrabold: 800;
|
||||
--font-weight-black: 900;
|
||||
--tracking-tighter: -0.05em;
|
||||
--tracking-tight: -0.025em;
|
||||
--tracking-normal: 0em;
|
||||
--leading-snug: 1.375;
|
||||
@@ -60,7 +61,6 @@
|
||||
--blur-sm: 8px;
|
||||
--blur-xl: 24px;
|
||||
--blur-2xl: 40px;
|
||||
--blur-3xl: 64px;
|
||||
--aspect-video: 16 / 9;
|
||||
--default-transition-duration: 150ms;
|
||||
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
@@ -276,8 +276,8 @@
|
||||
.-start-6 {
|
||||
inset-inline-start: calc(var(--spacing) * -6);
|
||||
}
|
||||
.-start-\[2\.1rem\] {
|
||||
inset-inline-start: calc(2.1rem * -1);
|
||||
.-start-10 {
|
||||
inset-inline-start: calc(var(--spacing) * -10);
|
||||
}
|
||||
.start-\[calc\(max\(-50vw\,-800px\)\+50\%\)\] {
|
||||
inset-inline-start: calc(max(-50vw, -800px) + 50%);
|
||||
@@ -294,9 +294,6 @@
|
||||
.end-8 {
|
||||
inset-inline-end: calc(var(--spacing) * 8);
|
||||
}
|
||||
.-top-40 {
|
||||
top: calc(var(--spacing) * -40);
|
||||
}
|
||||
.top-0 {
|
||||
top: 0px;
|
||||
}
|
||||
@@ -336,17 +333,14 @@
|
||||
.left-1\/2 {
|
||||
left: calc(1 / 2 * 100%);
|
||||
}
|
||||
.left-\[calc\(50\%-11rem\)\] {
|
||||
left: calc(50% - 11rem);
|
||||
}
|
||||
.isolate {
|
||||
isolation: isolate;
|
||||
}
|
||||
.-z-10 {
|
||||
z-index: calc(10 * -1);
|
||||
}
|
||||
.z-0 {
|
||||
z-index: 0;
|
||||
.-z-20 {
|
||||
z-index: calc(20 * -1);
|
||||
}
|
||||
.z-2 {
|
||||
z-index: 2;
|
||||
@@ -423,9 +417,6 @@
|
||||
.m-auto {
|
||||
margin: auto;
|
||||
}
|
||||
.-mx-2 {
|
||||
margin-inline: calc(var(--spacing) * -2);
|
||||
}
|
||||
.mx-1 {
|
||||
margin-inline: var(--spacing);
|
||||
}
|
||||
@@ -468,9 +459,6 @@
|
||||
.ms-auto {
|
||||
margin-inline-start: auto;
|
||||
}
|
||||
.-me-48 {
|
||||
margin-inline-end: calc(var(--spacing) * -48);
|
||||
}
|
||||
.me-1 {
|
||||
margin-inline-end: var(--spacing);
|
||||
}
|
||||
@@ -1164,6 +1152,9 @@
|
||||
.mt-8 {
|
||||
margin-top: calc(var(--spacing) * 8);
|
||||
}
|
||||
.mt-9 {
|
||||
margin-top: calc(var(--spacing) * 9);
|
||||
}
|
||||
.mt-10 {
|
||||
margin-top: calc(var(--spacing) * 10);
|
||||
}
|
||||
@@ -1230,9 +1221,6 @@
|
||||
.mb-10 {
|
||||
margin-bottom: calc(var(--spacing) * 10);
|
||||
}
|
||||
.mb-12 {
|
||||
margin-bottom: calc(var(--spacing) * 12);
|
||||
}
|
||||
.mb-14 {
|
||||
margin-bottom: calc(var(--spacing) * 14);
|
||||
}
|
||||
@@ -1305,9 +1293,6 @@
|
||||
.aspect-\[4\/3\] {
|
||||
aspect-ratio: 4/3;
|
||||
}
|
||||
.aspect-\[1155\/678\] {
|
||||
aspect-ratio: 1155/678;
|
||||
}
|
||||
.aspect-auto {
|
||||
aspect-ratio: auto;
|
||||
}
|
||||
@@ -1369,9 +1354,6 @@
|
||||
.h-40 {
|
||||
height: calc(var(--spacing) * 40);
|
||||
}
|
||||
.h-48 {
|
||||
height: calc(var(--spacing) * 48);
|
||||
}
|
||||
.h-84 {
|
||||
height: calc(var(--spacing) * 84);
|
||||
}
|
||||
@@ -1384,6 +1366,9 @@
|
||||
.h-\[150px\] {
|
||||
height: 150px;
|
||||
}
|
||||
.h-\[640px\] {
|
||||
height: 640px;
|
||||
}
|
||||
.h-\[800px\] {
|
||||
height: 800px;
|
||||
}
|
||||
@@ -1408,8 +1393,8 @@
|
||||
.min-h-0 {
|
||||
min-height: 0px;
|
||||
}
|
||||
.min-h-\[104px\] {
|
||||
min-height: 104px;
|
||||
.min-h-32 {
|
||||
min-height: calc(var(--spacing) * 32);
|
||||
}
|
||||
.min-h-\[130px\] {
|
||||
min-height: 130px;
|
||||
@@ -1468,9 +1453,6 @@
|
||||
.w-\[30px\] {
|
||||
width: 30px;
|
||||
}
|
||||
.w-\[36rem\] {
|
||||
width: 36rem;
|
||||
}
|
||||
.w-\[min\(22rem\,calc\(100vw-1\.5rem\)\)\] {
|
||||
width: min(22rem, calc(100vw - 1.5rem));
|
||||
}
|
||||
@@ -1619,18 +1601,12 @@
|
||||
.-rotate-90 {
|
||||
rotate: calc(90deg * -1);
|
||||
}
|
||||
.rotate-\[30deg\] {
|
||||
rotate: 30deg;
|
||||
}
|
||||
.transform {
|
||||
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
||||
}
|
||||
.transform\! {
|
||||
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,) !important;
|
||||
}
|
||||
.transform-gpu {
|
||||
transform: translateZ(0) var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
||||
}
|
||||
.transform-none {
|
||||
transform: none;
|
||||
}
|
||||
@@ -1659,6 +1635,9 @@
|
||||
.appearance-none {
|
||||
appearance: none;
|
||||
}
|
||||
.grid-cols-2 {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
.grid-rows-\[0fr\] {
|
||||
grid-template-rows: 0fr;
|
||||
}
|
||||
@@ -1686,6 +1665,9 @@
|
||||
.gap-1 {
|
||||
gap: var(--spacing);
|
||||
}
|
||||
.gap-1\.5 {
|
||||
gap: calc(var(--spacing) * 1.5);
|
||||
}
|
||||
.gap-2 {
|
||||
gap: calc(var(--spacing) * 2);
|
||||
}
|
||||
@@ -1695,6 +1677,9 @@
|
||||
.gap-4 {
|
||||
gap: calc(var(--spacing) * 4);
|
||||
}
|
||||
.gap-10 {
|
||||
gap: calc(var(--spacing) * 10);
|
||||
}
|
||||
:where(.space-y-2 > :not(:last-child)) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
|
||||
@@ -1906,6 +1891,12 @@
|
||||
.border-neutral-300 {
|
||||
border-color: rgba(var(--color-neutral-300), 1);
|
||||
}
|
||||
.border-neutral-300\/80 {
|
||||
border-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-300), 1), 1) 80%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
border-color: color-mix(in oklab, rgba(var(--color-neutral-300), 1) 80%, transparent);
|
||||
}
|
||||
}
|
||||
.border-primary-200 {
|
||||
border-color: rgba(var(--color-primary-200), 1);
|
||||
}
|
||||
@@ -1993,6 +1984,12 @@
|
||||
.bg-neutral-100 {
|
||||
background-color: rgba(var(--color-neutral-100), 1);
|
||||
}
|
||||
.bg-neutral-100\/50 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-100), 1), 1) 50%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral-100), 1) 50%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-neutral-100\/75 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-100), 1), 1) 75%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -2017,18 +2014,24 @@
|
||||
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)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 50%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-neutral\/60 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral), 1), 1) 60%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 60%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-neutral\/75 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral), 1), 1) 75%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 75%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-neutral\/85 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral), 1), 1) 85%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -2041,12 +2044,6 @@
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral), 1) 95%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-primary-50\/70 {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-primary-50), 1), 1) 70%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-primary-50), 1) 70%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-primary-100 {
|
||||
background-color: rgba(var(--color-primary-100), 1);
|
||||
}
|
||||
@@ -2071,8 +2068,8 @@
|
||||
.bg-white {
|
||||
background-color: #fff;
|
||||
}
|
||||
.bg-white\/80 {
|
||||
background-color: color-mix(in oklab, #fff 80%, transparent);
|
||||
.bg-white\/60 {
|
||||
background-color: color-mix(in oklab, #fff 60%, transparent);
|
||||
}
|
||||
.bg-linear-60 {
|
||||
--tw-gradient-position: 60deg;
|
||||
@@ -2093,10 +2090,6 @@
|
||||
--tw-gradient-position: to top in oklab;
|
||||
background-image: linear-gradient(var(--tw-gradient-stops));
|
||||
}
|
||||
.bg-gradient-to-tr {
|
||||
--tw-gradient-position: to top right in oklab;
|
||||
background-image: linear-gradient(var(--tw-gradient-stops));
|
||||
}
|
||||
.bg-none {
|
||||
background-image: none;
|
||||
}
|
||||
@@ -2104,10 +2097,6 @@
|
||||
--tw-gradient-from: rgba(var(--color-neutral), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.from-primary-400 {
|
||||
--tw-gradient-from: rgba(var(--color-primary-400), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.from-primary-500 {
|
||||
--tw-gradient-from: rgba(var(--color-primary-500), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
@@ -2123,10 +2112,6 @@
|
||||
--tw-gradient-to: rgba(var(--color-neutral-100), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.to-secondary-500 {
|
||||
--tw-gradient-to: rgba(var(--color-secondary-500), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.to-secondary-600 {
|
||||
--tw-gradient-to: rgba(var(--color-secondary-600), 1);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
@@ -2210,6 +2195,9 @@
|
||||
.px-\[30px\] {
|
||||
padding-inline: 30px;
|
||||
}
|
||||
.py-0\.5 {
|
||||
padding-block: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
.py-1 {
|
||||
padding-block: var(--spacing);
|
||||
}
|
||||
@@ -2234,12 +2222,18 @@
|
||||
.py-10 {
|
||||
padding-block: calc(var(--spacing) * 10);
|
||||
}
|
||||
.py-12 {
|
||||
padding-block: calc(var(--spacing) * 12);
|
||||
}
|
||||
.py-16 {
|
||||
padding-block: calc(var(--spacing) * 16);
|
||||
}
|
||||
.py-20 {
|
||||
padding-block: calc(var(--spacing) * 20);
|
||||
}
|
||||
.py-24 {
|
||||
padding-block: calc(var(--spacing) * 24);
|
||||
}
|
||||
.py-\[0\.4rem\] {
|
||||
padding-block: 0.4rem;
|
||||
}
|
||||
@@ -2276,9 +2270,6 @@
|
||||
.pt-12 {
|
||||
padding-top: calc(var(--spacing) * 12);
|
||||
}
|
||||
.pt-16 {
|
||||
padding-top: calc(var(--spacing) * 16);
|
||||
}
|
||||
.pr-8 {
|
||||
padding-right: calc(var(--spacing) * 8);
|
||||
}
|
||||
@@ -2297,9 +2288,6 @@
|
||||
.pb-16 {
|
||||
padding-bottom: calc(var(--spacing) * 16);
|
||||
}
|
||||
.pb-32 {
|
||||
padding-bottom: calc(var(--spacing) * 32);
|
||||
}
|
||||
.pl-0 {
|
||||
padding-left: 0px;
|
||||
}
|
||||
@@ -2333,6 +2321,9 @@
|
||||
.align-top {
|
||||
vertical-align: top;
|
||||
}
|
||||
.font-sans {
|
||||
font-family: var(--font-sans);
|
||||
}
|
||||
.text-2xl {
|
||||
font-size: var(--text-2xl);
|
||||
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||
@@ -2372,6 +2363,9 @@
|
||||
.text-\[0\.6rem\] {
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
.text-\[16rem\] {
|
||||
font-size: 16rem;
|
||||
}
|
||||
.leading-3 {
|
||||
--tw-leading: calc(var(--spacing) * 3);
|
||||
line-height: calc(var(--spacing) * 3);
|
||||
@@ -2384,10 +2378,22 @@
|
||||
--tw-leading: calc(var(--spacing) * 7);
|
||||
line-height: calc(var(--spacing) * 7);
|
||||
}
|
||||
.leading-8 {
|
||||
--tw-leading: calc(var(--spacing) * 8);
|
||||
line-height: calc(var(--spacing) * 8);
|
||||
}
|
||||
.leading-\[1\.05\] {
|
||||
--tw-leading: 1.05;
|
||||
line-height: 1.05;
|
||||
}
|
||||
.leading-\[1\.6\] {
|
||||
--tw-leading: 1.6;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.leading-none {
|
||||
--tw-leading: 1;
|
||||
line-height: 1;
|
||||
}
|
||||
.leading-relaxed {
|
||||
--tw-leading: var(--leading-relaxed);
|
||||
line-height: var(--leading-relaxed);
|
||||
@@ -2420,10 +2426,18 @@
|
||||
--tw-font-weight: var(--font-weight-semibold);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
.tracking-\[0\.15em\] {
|
||||
--tw-tracking: 0.15em;
|
||||
letter-spacing: 0.15em;
|
||||
}
|
||||
.tracking-\[0\.18em\] {
|
||||
--tw-tracking: 0.18em;
|
||||
letter-spacing: 0.18em;
|
||||
}
|
||||
.tracking-\[0\.25em\] {
|
||||
--tw-tracking: 0.25em;
|
||||
letter-spacing: 0.25em;
|
||||
}
|
||||
.tracking-normal {
|
||||
--tw-tracking: var(--tracking-normal);
|
||||
letter-spacing: var(--tracking-normal);
|
||||
@@ -2432,6 +2446,10 @@
|
||||
--tw-tracking: var(--tracking-tight);
|
||||
letter-spacing: var(--tracking-tight);
|
||||
}
|
||||
.tracking-tighter {
|
||||
--tw-tracking: var(--tracking-tighter);
|
||||
letter-spacing: var(--tracking-tighter);
|
||||
}
|
||||
.text-balance {
|
||||
text-wrap: balance;
|
||||
}
|
||||
@@ -2484,6 +2502,12 @@
|
||||
.text-neutral-900 {
|
||||
color: rgba(var(--color-neutral-900), 1);
|
||||
}
|
||||
.text-neutral-900\/5 {
|
||||
color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 5%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, rgba(var(--color-neutral-900), 1) 5%, transparent);
|
||||
}
|
||||
}
|
||||
.text-primary-100 {
|
||||
color: rgba(var(--color-primary-100), 1);
|
||||
}
|
||||
@@ -2578,9 +2602,6 @@
|
||||
.opacity-0 {
|
||||
opacity: 0%;
|
||||
}
|
||||
.opacity-20 {
|
||||
opacity: 20%;
|
||||
}
|
||||
.opacity-30 {
|
||||
opacity: 30%;
|
||||
}
|
||||
@@ -2634,6 +2655,18 @@
|
||||
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
||||
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
||||
}
|
||||
.shadow-neutral-900\/5 {
|
||||
--tw-shadow-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 5%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, rgba(var(--color-neutral-900), 1) 5%, transparent) var(--tw-shadow-alpha), transparent);
|
||||
}
|
||||
}
|
||||
.shadow-neutral-900\/20 {
|
||||
--tw-shadow-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 20%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, rgba(var(--color-neutral-900), 1) 20%, transparent) var(--tw-shadow-alpha), transparent);
|
||||
}
|
||||
}
|
||||
.shadow-primary-500\/20 {
|
||||
--tw-shadow-color: color-mix(in srgb, rgba(rgba(var(--color-primary-500), 1), 1) 20%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -2658,10 +2691,6 @@
|
||||
--tw-blur: blur(8px) !important;
|
||||
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
|
||||
}
|
||||
.blur-3xl {
|
||||
--tw-blur: blur(var(--blur-3xl));
|
||||
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
||||
}
|
||||
.drop-shadow {
|
||||
--tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.1))) drop-shadow(0 1px 1px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.06)));
|
||||
--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow( 0 1px 1px rgb(0 0 0 / 0.06));
|
||||
@@ -2677,11 +2706,6 @@
|
||||
.filter\! {
|
||||
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
|
||||
}
|
||||
.backdrop-blur {
|
||||
--tw-backdrop-blur: blur(8px);
|
||||
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
}
|
||||
.backdrop-blur-2xl {
|
||||
--tw-backdrop-blur: blur(var(--blur-2xl));
|
||||
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
@@ -2769,9 +2793,9 @@
|
||||
--tw-duration: 300ms;
|
||||
transition-duration: 300ms;
|
||||
}
|
||||
.duration-500 {
|
||||
--tw-duration: 500ms;
|
||||
transition-duration: 500ms;
|
||||
.duration-700 {
|
||||
--tw-duration: 700ms;
|
||||
transition-duration: 700ms;
|
||||
}
|
||||
.duration-\[350ms\] {
|
||||
--tw-duration: 350ms;
|
||||
@@ -2785,6 +2809,10 @@
|
||||
--tw-ease: cubic-bezier(0,0,0.15,1), cubic-bezier(0,0,0.15,1);
|
||||
transition-timing-function: cubic-bezier(0,0,0.15,1), cubic-bezier(0,0,0.15,1);
|
||||
}
|
||||
.ease-\[cubic-bezier\(0\.22\,1\,0\.36\,1\)\] {
|
||||
--tw-ease: cubic-bezier(0.22,1,0.36,1);
|
||||
transition-timing-function: cubic-bezier(0.22,1,0.36,1);
|
||||
}
|
||||
.ease-\[cubic-bezier\(0\.25\,0\.1\,0\.25\,1\.0\)\] {
|
||||
--tw-ease: cubic-bezier(0.25,0.1,0.25,1.0);
|
||||
transition-timing-function: cubic-bezier(0.25,0.1,0.25,1.0);
|
||||
@@ -2831,11 +2859,8 @@
|
||||
--tw-scale-z: 105%;
|
||||
scale: var(--tw-scale-x) var(--tw-scale-y);
|
||||
}
|
||||
.group-hover\:scale-110:is(:where(.group):hover *) {
|
||||
--tw-scale-x: 110%;
|
||||
--tw-scale-y: 110%;
|
||||
--tw-scale-z: 110%;
|
||||
scale: var(--tw-scale-x) var(--tw-scale-y);
|
||||
.group-hover\:scale-\[1\.03\]:is(:where(.group):hover *) {
|
||||
scale: 1.03;
|
||||
}
|
||||
.group-hover\:text-primary-500:is(:where(.group):hover *) {
|
||||
color: rgba(var(--color-primary-500), 1);
|
||||
@@ -3102,33 +3127,21 @@
|
||||
}
|
||||
}
|
||||
@media (width >= 640px) {
|
||||
.sm\:-top-80 {
|
||||
top: calc(var(--spacing) * -80);
|
||||
}
|
||||
.sm\:top-5 {
|
||||
top: calc(var(--spacing) * 5);
|
||||
}
|
||||
.sm\:left-\[calc\(50\%-30rem\)\] {
|
||||
left: calc(50% - 30rem);
|
||||
}
|
||||
.sm\:me-7 {
|
||||
margin-inline-end: calc(var(--spacing) * 7);
|
||||
}
|
||||
.sm\:mt-16 {
|
||||
margin-top: calc(var(--spacing) * 16);
|
||||
}
|
||||
.sm\:mb-0 {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.sm\:w-1\/2 {
|
||||
width: calc(1 / 2 * 100%);
|
||||
}
|
||||
.sm\:w-\[72rem\] {
|
||||
width: 72rem;
|
||||
}
|
||||
.sm\:grid-cols-2 {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
.sm\:grid-cols-3 {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
.sm\:flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
@@ -3144,15 +3157,15 @@
|
||||
.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);
|
||||
}
|
||||
.sm\:px-14 {
|
||||
padding-inline: calc(var(--spacing) * 14);
|
||||
}
|
||||
.sm\:py-16 {
|
||||
padding-block: calc(var(--spacing) * 16);
|
||||
}
|
||||
.sm\:py-24 {
|
||||
padding-block: calc(var(--spacing) * 24);
|
||||
}
|
||||
@@ -3165,6 +3178,10 @@
|
||||
.sm\:text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.sm\:text-2xl {
|
||||
font-size: var(--text-2xl);
|
||||
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||
}
|
||||
.sm\:text-7xl {
|
||||
font-size: var(--text-7xl);
|
||||
line-height: var(--tw-leading, var(--text-7xl--line-height));
|
||||
@@ -3173,14 +3190,18 @@
|
||||
font-size: var(--text-lg);
|
||||
line-height: var(--tw-leading, var(--text-lg--line-height));
|
||||
}
|
||||
.sm\:text-\[26rem\] {
|
||||
font-size: 26rem;
|
||||
}
|
||||
.sm\:leading-9 {
|
||||
--tw-leading: calc(var(--spacing) * 9);
|
||||
line-height: calc(var(--spacing) * 9);
|
||||
}
|
||||
.sm\:last\:me-0:last-child {
|
||||
margin-inline-end: 0px;
|
||||
}
|
||||
}
|
||||
@media (width >= 853px) {
|
||||
.md\:-me-16 {
|
||||
margin-inline-end: calc(var(--spacing) * -16);
|
||||
}
|
||||
.md\:mt-0 {
|
||||
margin-top: 0px;
|
||||
}
|
||||
@@ -3199,15 +3220,15 @@
|
||||
.md\:h-\[200px\] {
|
||||
height: 200px;
|
||||
}
|
||||
.md\:w-1\/3 {
|
||||
width: calc(1 / 3 * 100%);
|
||||
}
|
||||
.md\:w-auto {
|
||||
width: auto;
|
||||
}
|
||||
.md\:grid-cols-3 {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
.md\:grid-cols-4 {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
.md\:flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
@@ -3222,12 +3243,6 @@
|
||||
}
|
||||
}
|
||||
@media (width >= 1024px) {
|
||||
.lg\:absolute {
|
||||
position: absolute;
|
||||
}
|
||||
.lg\:relative {
|
||||
position: relative;
|
||||
}
|
||||
.lg\:sticky {
|
||||
position: sticky;
|
||||
}
|
||||
@@ -3240,54 +3255,27 @@
|
||||
.lg\:order-last {
|
||||
order: 9999;
|
||||
}
|
||||
.lg\:m-0 {
|
||||
margin: 0px;
|
||||
}
|
||||
.lg\:mx-0 {
|
||||
margin-inline: 0px;
|
||||
}
|
||||
.lg\:mx-auto {
|
||||
margin-inline: auto;
|
||||
}
|
||||
.lg\:ms-auto {
|
||||
margin-inline-start: auto;
|
||||
}
|
||||
.lg\:mt-0 {
|
||||
margin-top: 0px;
|
||||
}
|
||||
.lg\:block {
|
||||
display: block;
|
||||
}
|
||||
.lg\:grid {
|
||||
display: grid;
|
||||
}
|
||||
.lg\:hidden {
|
||||
display: none;
|
||||
}
|
||||
.lg\:h-72 {
|
||||
height: calc(var(--spacing) * 72);
|
||||
}
|
||||
.lg\:h-full {
|
||||
height: 100%;
|
||||
}
|
||||
.lg\:w-1\/4 {
|
||||
width: calc(1 / 4 * 100%);
|
||||
}
|
||||
.lg\:w-auto {
|
||||
width: auto;
|
||||
}
|
||||
.lg\:max-w-2xs {
|
||||
max-width: var(--container-2xs);
|
||||
}
|
||||
.lg\:max-w-7xl {
|
||||
max-width: var(--container-7xl);
|
||||
}
|
||||
.lg\:max-w-none {
|
||||
max-width: none;
|
||||
}
|
||||
.lg\:grid-flow-col-dense {
|
||||
grid-auto-flow: column dense;
|
||||
}
|
||||
.lg\:grid-cols-2 {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
@@ -3300,24 +3288,18 @@
|
||||
.lg\:flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
.lg\:gap-24 {
|
||||
gap: calc(var(--spacing) * 24);
|
||||
.lg\:gap-16 {
|
||||
gap: calc(var(--spacing) * 16);
|
||||
}
|
||||
.lg\:p-\[12vh\] {
|
||||
padding: 12vh;
|
||||
}
|
||||
.lg\:px-0 {
|
||||
padding-inline: 0px;
|
||||
}
|
||||
.lg\:px-8 {
|
||||
padding-inline: calc(var(--spacing) * 8);
|
||||
}
|
||||
.lg\:px-32 {
|
||||
padding-inline: calc(var(--spacing) * 32);
|
||||
}
|
||||
.lg\:py-16 {
|
||||
padding-block: calc(var(--spacing) * 16);
|
||||
}
|
||||
.lg\:py-32 {
|
||||
padding-block: calc(var(--spacing) * 32);
|
||||
}
|
||||
@@ -3326,12 +3308,12 @@
|
||||
}
|
||||
}
|
||||
@media (width >= 1280px) {
|
||||
.xl\:w-1\/4 {
|
||||
width: calc(1 / 4 * 100%);
|
||||
}
|
||||
.xl\:grid-cols-4 {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
.xl\:grid-cols-5 {
|
||||
grid-template-columns: repeat(5, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
@media (width >= 1536px) {
|
||||
.\32 xl\:grid-cols-5 {
|
||||
@@ -3374,6 +3356,12 @@
|
||||
.dark\:border-neutral-600:is(.dark *) {
|
||||
border-color: rgba(var(--color-neutral-600), 1);
|
||||
}
|
||||
.dark\:border-neutral-600\/80:is(.dark *) {
|
||||
border-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-600), 1), 1) 80%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
border-color: color-mix(in oklab, rgba(var(--color-neutral-600), 1) 80%, transparent);
|
||||
}
|
||||
}
|
||||
.dark\:border-neutral-700:is(.dark *) {
|
||||
border-color: rgba(var(--color-neutral-700), 1);
|
||||
}
|
||||
@@ -3398,12 +3386,6 @@
|
||||
.dark\:border-primary-900:is(.dark *) {
|
||||
border-color: rgba(var(--color-primary-900), 1);
|
||||
}
|
||||
.dark\:border-primary-900\/70:is(.dark *) {
|
||||
border-color: color-mix(in srgb, rgba(rgba(var(--color-primary-900), 1), 1) 70%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
border-color: color-mix(in oklab, rgba(var(--color-primary-900), 1) 70%, transparent);
|
||||
}
|
||||
}
|
||||
.dark\:border-secondary-600:is(.dark *) {
|
||||
border-color: rgba(var(--color-secondary-600), 1);
|
||||
}
|
||||
@@ -3503,24 +3485,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\/50:is(.dark *) {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 50%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral-900), 1) 50%, transparent);
|
||||
}
|
||||
}
|
||||
.dark\:bg-neutral-900\/80:is(.dark *) {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 80%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, rgba(var(--color-neutral-900), 1) 80%, transparent);
|
||||
}
|
||||
}
|
||||
.dark\:bg-neutral-900\/99:is(.dark *) {
|
||||
background-color: color-mix(in srgb, rgba(rgba(var(--color-neutral-900), 1), 1) 99%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -3603,6 +3573,9 @@
|
||||
.dark\:text-white:is(.dark *) {
|
||||
color: #fff;
|
||||
}
|
||||
.dark\:text-white\/5:is(.dark *) {
|
||||
color: color-mix(in oklab, #fff 5%, transparent);
|
||||
}
|
||||
.dark\:opacity-60:is(.dark *) {
|
||||
opacity: 60%;
|
||||
}
|
||||
@@ -3653,6 +3626,9 @@
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.\[\&_\.p-4\]\:p-3 .p-4 {
|
||||
padding: calc(var(--spacing) * 3);
|
||||
}
|
||||
.\[\&_\.translation_\.menuhide_span\]\:text-sm\! .translation .menuhide span {
|
||||
font-size: var(--text-sm) !important;
|
||||
line-height: var(--tw-leading, var(--text-sm--line-height)) !important;
|
||||
@@ -3665,6 +3641,16 @@
|
||||
font-size: var(--text-base) !important;
|
||||
line-height: var(--tw-leading, var(--text-base--line-height)) !important;
|
||||
}
|
||||
.\[\&_h2\]\:text-base h2 {
|
||||
font-size: var(--text-base);
|
||||
line-height: var(--tw-leading, var(--text-base--line-height));
|
||||
}
|
||||
.\[\&_img\.logo\]\:max-h-10 img.logo {
|
||||
max-height: calc(var(--spacing) * 10);
|
||||
}
|
||||
.\[\&_img\.logo\]\:max-w-10 img.logo {
|
||||
max-width: calc(var(--spacing) * 10);
|
||||
}
|
||||
.\[\&_span\]\:text-2xl span {
|
||||
font-size: var(--text-2xl);
|
||||
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||
@@ -4540,6 +4526,39 @@ body a, body button {
|
||||
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
||||
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
||||
}
|
||||
@keyframes landing-rise {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(0.9rem);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.landing-rise {
|
||||
animation: landing-rise 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
|
||||
}
|
||||
.landing-rise-1 {
|
||||
animation-delay: 90ms;
|
||||
}
|
||||
.landing-rise-2 {
|
||||
animation-delay: 180ms;
|
||||
}
|
||||
.landing-rise-3 {
|
||||
animation-delay: 270ms;
|
||||
}
|
||||
.landing-rise-4 {
|
||||
animation-delay: 360ms;
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
html {
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
.landing-rise, .landing-rise-1, .landing-rise-2, .landing-rise-3, .landing-rise-4 {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
button, [role="button"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -4688,6 +4707,71 @@ pre {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
@page {
|
||||
margin: 2cm;
|
||||
}
|
||||
@media print {
|
||||
html {
|
||||
color-scheme: light only;
|
||||
}
|
||||
body {
|
||||
background: #fff !important;
|
||||
color: #111 !important;
|
||||
max-width: none !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
body > header, #background-canvas, .single_hero_background, #scroll-to-top, #bmc-wbtn {
|
||||
display: none !important;
|
||||
}
|
||||
* {
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
main, article, .prose, .prose *:not(pre):not(pre *) {
|
||||
color: #111 !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
pre, pre * {
|
||||
background: #f4f4f5 !important;
|
||||
color: #111 !important;
|
||||
white-space: pre-wrap !important;
|
||||
}
|
||||
a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.prose a[href^="http"]::after {
|
||||
content: " (" attr(href) ")";
|
||||
font-size: 0.85em;
|
||||
color: #555;
|
||||
word-break: break-all;
|
||||
}
|
||||
pre, blockquote, table, figure, img {
|
||||
break-inside: avoid;
|
||||
}
|
||||
h1, h2, h3, h4 {
|
||||
break-after: avoid;
|
||||
}
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
}
|
||||
.hero-canvas-fade {
|
||||
-webkit-mask-image: linear-gradient(to bottom, black 20%, transparent 92%);
|
||||
mask-image: linear-gradient(to bottom, black 20%, transparent 92%);
|
||||
}
|
||||
@media (min-width: 640px) and (max-width: 1023.98px) {
|
||||
.grid-balance > :last-child:nth-child(odd) {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1024px) {
|
||||
.grid-balance-3 > :last-child:nth-child(3n + 1) {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
.grid-balance-4 > :last-child:nth-child(4n + 1) {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
.thumbnail_card {
|
||||
aspect-ratio: var(--thumbnail-aspect-ratio, 1.5);
|
||||
height: auto;
|
||||
@@ -4822,11 +4906,15 @@ body:has(#mobile-menu-toggle:checked) {
|
||||
.menuhide {
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
white-space: nowrap;
|
||||
width: max-content;
|
||||
max-width: min(20rem, calc(100vw - 2rem));
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: visibility 0.3s, opacity 0.3s ease-in-out;
|
||||
}
|
||||
.nested-menu:nth-last-child(-n + 3) .menuhide {
|
||||
inset-inline-end: 0;
|
||||
}
|
||||
.nested-menu:hover .menuhide, .nested-menu:focus-within .menuhide {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
|
||||
Reference in new issue
Block a user