feat(marketing): round 3 — hero remplacé par 3-step flow canonique + 99+ langues + Cégeps spotlight + CyberPerformance + FAQ enrichie
Hero (templates/marketing/landing.html) : - Reproduction fidèle de dictia.ca/solutions/dictai (source : Website-Sanity/components/sections/dictai-page-content.tsx lignes 260-518) - REMPLACE le mockup app DictIA par le 3-step flow inline canonique (Importez → Texte 2 min → Résumé + actions) - Wordmark large « DictIA » (style production) + H2 cyan « Transcription IA locale en 2 minutes — conforme Barreau, CPA Québec et ChAD » - Sub canonique référençant OVH Beauharnois, Cadre IA MCN, 5 ordres à directives IA formelles - Stats grid (4 col) : ~2 min · 5 ordres · 95 %+ · 0 $ (NBSP OQLF) - Eyebrow back-link « Toutes les solutions » - 5 animations Framer Motion → CSS pure + Alpine.js : 1. 3-step flow auto-cycle 1→2→3 (setInterval 1.8 s, désactivé reduced-motion) 2. Magnetic CTA primary (mousemove → translate max 8 px) 3. Mouse parallax orb 3D (mousemove window → CSS transition) 4. Shockwave on click (CSS pseudo-element scale 0→4 + opacity) 5. Word-staggered title reveal (Dict + IA via animation-delay) Sections enrichies / ajoutées : - Pipeline : sous-titre « Du fichier au résumé — en temps réel » + hint canonique - NEW « 99+ langues détectées » + carte « IA Mistral 7B (LOCAL) » 4 bullets - Pricing : sous-titres canoniques par forfait + note « Tous les prix en CAD, taxes en sus (TPS 5 % + TVQ 9,975 %) » - Conformité : 3 chips claims (~192 000 pros · 5 ordres · 0 donnée hors-Québec) + phrase secteurs réglementés - NEW Cégeps spotlight « Conformité au 19 juin 2026 » avec Cadre IA MCN détaillé (7 bullets, 9 chips organismes, badge pulse glow) - NEW Partenaire CyberPerformance (card horizontale + lien externe) - FAQ : enrichie de 7 → 10 questions canoniques sourcées de dictai-page-content.tsx (Teams Copilot, Otter.ai, Barreau, Clio Manage, etc.) - CTA final : « Prêt à protéger vos données ? » + bouton « Réserver ma démo gratuite » (préserve mailto pré-inscription) Tests : - Ajout tests/conftest.py (stub fcntl POSIX + env vars test) pour permettre exécution sur Windows - Mise à jour 8 assertions liées au nouveau hero, FAQ 10 Q, CTA renforcé, NBSP OQLF dans eyebrow - 61 passed / 3 pré-existant échecs baseline (/blog dans nav + footer + trust-bar phrasing) Contraintes respectées : zéro JS externe, aucun emoji (SVG inline aria-hidden), V3 radii (rounded/rounded-full), brand tokens, OQLF NBSP partout, WCAG (aria-labels, focus-visible, prefers-reduced-motion désactive toutes les animations hero). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Allison
@@ -361,8 +361,8 @@
|
||||
.sticky {
|
||||
position: sticky;
|
||||
}
|
||||
.-inset-8 {
|
||||
inset: calc(var(--spacing) * -8);
|
||||
.-inset-1 {
|
||||
inset: calc(var(--spacing) * -1);
|
||||
}
|
||||
.inset-0 {
|
||||
inset: calc(var(--spacing) * 0);
|
||||
@@ -370,6 +370,9 @@
|
||||
.inset-\[-8px\] {
|
||||
inset: -8px;
|
||||
}
|
||||
.inset-\[30\%\] {
|
||||
inset: 30%;
|
||||
}
|
||||
.inset-x-0 {
|
||||
inset-inline: calc(var(--spacing) * 0);
|
||||
}
|
||||
@@ -382,17 +385,14 @@
|
||||
.end {
|
||||
inset-inline-end: var(--spacing);
|
||||
}
|
||||
.-top-1 {
|
||||
top: calc(var(--spacing) * -1);
|
||||
}
|
||||
.-top-1\.5 {
|
||||
top: calc(var(--spacing) * -1.5);
|
||||
}
|
||||
.-top-3 {
|
||||
top: calc(var(--spacing) * -3);
|
||||
}
|
||||
.-top-10 {
|
||||
top: calc(var(--spacing) * -10);
|
||||
.-top-12 {
|
||||
top: calc(var(--spacing) * -12);
|
||||
}
|
||||
.top-0 {
|
||||
top: calc(var(--spacing) * 0);
|
||||
@@ -424,6 +424,9 @@
|
||||
.top-16 {
|
||||
top: calc(var(--spacing) * 16);
|
||||
}
|
||||
.top-\[12\%\] {
|
||||
top: 12%;
|
||||
}
|
||||
.top-\[42px\] {
|
||||
top: 42px;
|
||||
}
|
||||
@@ -436,8 +439,8 @@
|
||||
.-right-1\.5 {
|
||||
right: calc(var(--spacing) * -1.5);
|
||||
}
|
||||
.-right-6 {
|
||||
right: calc(var(--spacing) * -6);
|
||||
.-right-12 {
|
||||
right: calc(var(--spacing) * -12);
|
||||
}
|
||||
.right-0 {
|
||||
right: calc(var(--spacing) * 0);
|
||||
@@ -469,8 +472,8 @@
|
||||
.right-\[3\%\] {
|
||||
right: 3%;
|
||||
}
|
||||
.-bottom-10 {
|
||||
bottom: calc(var(--spacing) * -10);
|
||||
.right-\[6\%\] {
|
||||
right: 6%;
|
||||
}
|
||||
.bottom-0 {
|
||||
bottom: calc(var(--spacing) * 0);
|
||||
@@ -487,9 +490,6 @@
|
||||
.bottom-full {
|
||||
bottom: 100%;
|
||||
}
|
||||
.-left-10 {
|
||||
left: calc(var(--spacing) * -10);
|
||||
}
|
||||
.left-0 {
|
||||
left: calc(var(--spacing) * 0);
|
||||
}
|
||||
@@ -586,9 +586,6 @@
|
||||
.-mx-4 {
|
||||
margin-inline: calc(var(--spacing) * -4);
|
||||
}
|
||||
.mx-1 {
|
||||
margin-inline: calc(var(--spacing) * 1);
|
||||
}
|
||||
.mx-3 {
|
||||
margin-inline: calc(var(--spacing) * 3);
|
||||
}
|
||||
@@ -673,9 +670,6 @@
|
||||
.mr-4 {
|
||||
margin-right: calc(var(--spacing) * 4);
|
||||
}
|
||||
.-mb-\[0\.5rem\] {
|
||||
margin-bottom: calc(0.5rem * -1);
|
||||
}
|
||||
.-mb-px {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
@@ -880,9 +874,6 @@
|
||||
.h-\[450px\] {
|
||||
height: 450px;
|
||||
}
|
||||
.h-\[460px\] {
|
||||
height: 460px;
|
||||
}
|
||||
.h-\[500px\] {
|
||||
height: 500px;
|
||||
}
|
||||
@@ -946,6 +937,9 @@
|
||||
.min-h-\[8rem\] {
|
||||
min-height: 8rem;
|
||||
}
|
||||
.min-h-\[85vh\] {
|
||||
min-height: 85vh;
|
||||
}
|
||||
.min-h-\[110px\] {
|
||||
min-height: 110px;
|
||||
}
|
||||
@@ -1027,9 +1021,6 @@
|
||||
.w-56 {
|
||||
width: calc(var(--spacing) * 56);
|
||||
}
|
||||
.w-64 {
|
||||
width: calc(var(--spacing) * 64);
|
||||
}
|
||||
.w-72 {
|
||||
width: calc(var(--spacing) * 72);
|
||||
}
|
||||
@@ -1045,6 +1036,9 @@
|
||||
.w-\[68px\] {
|
||||
width: 68px;
|
||||
}
|
||||
.w-\[80px\] {
|
||||
width: 80px;
|
||||
}
|
||||
.w-\[88px\] {
|
||||
width: 88px;
|
||||
}
|
||||
@@ -1233,9 +1227,6 @@
|
||||
.transform {
|
||||
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
||||
}
|
||||
.animate-plus-breathe {
|
||||
animation: plus-breathe 2s ease-in-out infinite;
|
||||
}
|
||||
.animate-pulse {
|
||||
animation: var(--animate-pulse);
|
||||
}
|
||||
@@ -1304,15 +1295,15 @@
|
||||
.grid-cols-4 {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
.grid-cols-6 {
|
||||
grid-template-columns: repeat(6, minmax(0, 1fr));
|
||||
}
|
||||
.grid-cols-7 {
|
||||
grid-template-columns: repeat(7, minmax(0, 1fr));
|
||||
}
|
||||
.grid-cols-\[2fr_2fr_3fr\] {
|
||||
grid-template-columns: 2fr 2fr 3fr;
|
||||
}
|
||||
.grid-cols-\[180px_1fr_170px\] {
|
||||
grid-template-columns: 180px 1fr 170px;
|
||||
}
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
@@ -1379,9 +1370,6 @@
|
||||
.gap-8 {
|
||||
gap: calc(var(--spacing) * 8);
|
||||
}
|
||||
.gap-12 {
|
||||
gap: calc(var(--spacing) * 12);
|
||||
}
|
||||
.gap-\[1\.5px\] {
|
||||
gap: 1.5px;
|
||||
}
|
||||
@@ -1413,6 +1401,13 @@
|
||||
margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
|
||||
}
|
||||
}
|
||||
.space-y-2\.5 {
|
||||
:where(& > :not(:last-child)) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
|
||||
margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
|
||||
}
|
||||
}
|
||||
.space-y-3 {
|
||||
:where(& > :not(:last-child)) {
|
||||
--tw-space-y-reverse: 0;
|
||||
@@ -1631,6 +1626,9 @@
|
||||
--tw-border-style: dashed;
|
||||
border-style: dashed;
|
||||
}
|
||||
.\!border-transparent {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
.border-\[var\(--bg-accent\)\] {
|
||||
border-color: var(--bg-accent);
|
||||
}
|
||||
@@ -1712,6 +1710,9 @@
|
||||
.border-brand-b2\/40 {
|
||||
border-color: color-mix(in oklab, #00bdd8 40%, transparent);
|
||||
}
|
||||
.border-brand-b3\/15 {
|
||||
border-color: color-mix(in oklab, #00c896 15%, transparent);
|
||||
}
|
||||
.border-brand-b3\/60 {
|
||||
border-color: color-mix(in oklab, #00c896 60%, transparent);
|
||||
}
|
||||
@@ -1823,6 +1824,12 @@
|
||||
border-color: color-mix(in oklab, var(--color-white) 6%, transparent);
|
||||
}
|
||||
}
|
||||
.border-white\/\[0\.07\] {
|
||||
border-color: color-mix(in srgb, #fff 7.000000000000001%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
border-color: color-mix(in oklab, var(--color-white) 7.000000000000001%, transparent);
|
||||
}
|
||||
}
|
||||
.border-white\/\[0\.08\] {
|
||||
border-color: color-mix(in srgb, #fff 8%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -2015,6 +2022,9 @@
|
||||
.bg-brand-b1\/\[0\.06\] {
|
||||
background-color: color-mix(in oklab, #0062ff 6%, transparent);
|
||||
}
|
||||
.bg-brand-b3 {
|
||||
background-color: #00c896;
|
||||
}
|
||||
.bg-brand-b3\/10 {
|
||||
background-color: color-mix(in oklab, #00c896 10%, transparent);
|
||||
}
|
||||
@@ -2054,12 +2064,6 @@
|
||||
.bg-brand-navy2 {
|
||||
background-color: #0b1525;
|
||||
}
|
||||
.bg-emerald-500\/20 {
|
||||
background-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 20%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, var(--color-emerald-500) 20%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-emerald-600 {
|
||||
background-color: var(--color-emerald-600);
|
||||
}
|
||||
@@ -2255,12 +2259,6 @@
|
||||
background-color: color-mix(in oklab, var(--color-white) 6%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-white\/\[0\.08\] {
|
||||
background-color: color-mix(in srgb, #fff 8%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, var(--color-white) 8%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-yellow-50 {
|
||||
background-color: var(--color-yellow-50);
|
||||
}
|
||||
@@ -2315,6 +2313,10 @@
|
||||
--tw-gradient-from: color-mix(in oklab, #0062ff 6%, transparent);
|
||||
--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-brand-b3 {
|
||||
--tw-gradient-from: #00c896;
|
||||
--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-orange-500 {
|
||||
--tw-gradient-from: var(--color-orange-500);
|
||||
--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));
|
||||
@@ -2354,6 +2356,10 @@
|
||||
--tw-gradient-to: var(--color-amber-600);
|
||||
--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-brand-b1 {
|
||||
--tw-gradient-to: #0062ff;
|
||||
--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-brand-b3\/10 {
|
||||
--tw-gradient-to: color-mix(in oklab, #00c896 10%, transparent);
|
||||
--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));
|
||||
@@ -2533,6 +2539,9 @@
|
||||
.pt-4 {
|
||||
padding-top: calc(var(--spacing) * 4);
|
||||
}
|
||||
.pt-5 {
|
||||
padding-top: calc(var(--spacing) * 5);
|
||||
}
|
||||
.pt-6 {
|
||||
padding-top: calc(var(--spacing) * 6);
|
||||
}
|
||||
@@ -2572,9 +2581,6 @@
|
||||
.pb-0 {
|
||||
padding-bottom: calc(var(--spacing) * 0);
|
||||
}
|
||||
.pb-1 {
|
||||
padding-bottom: calc(var(--spacing) * 1);
|
||||
}
|
||||
.pb-2 {
|
||||
padding-bottom: calc(var(--spacing) * 2);
|
||||
}
|
||||
@@ -2638,6 +2644,9 @@
|
||||
.font-mono {
|
||||
font-family: JetBrains Mono Variable, JetBrains Mono, monospace;
|
||||
}
|
||||
.font-sans {
|
||||
font-family: Inter Variable, Inter, system-ui, sans-serif;
|
||||
}
|
||||
.text-2xl {
|
||||
font-size: var(--text-2xl);
|
||||
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||
@@ -2684,6 +2693,9 @@
|
||||
.text-\[9px\] {
|
||||
font-size: 9px;
|
||||
}
|
||||
.text-\[10\.5px\] {
|
||||
font-size: 10.5px;
|
||||
}
|
||||
.text-\[10px\] {
|
||||
font-size: 10px;
|
||||
}
|
||||
@@ -2708,9 +2720,6 @@
|
||||
.text-\[clamp\(1\.75rem\,2\.5vw\,2\.25rem\)\] {
|
||||
font-size: clamp(1.75rem, 2.5vw, 2.25rem);
|
||||
}
|
||||
.text-\[clamp\(2\.5rem\,4vw\,4rem\)\] {
|
||||
font-size: clamp(2.5rem, 4vw, 4rem);
|
||||
}
|
||||
.text-\[clamp\(2\.25rem\,4vw\,3\.5rem\)\] {
|
||||
font-size: clamp(2.25rem, 4vw, 3.5rem);
|
||||
}
|
||||
@@ -2727,6 +2736,10 @@
|
||||
--tw-leading: calc(var(--spacing) * 5);
|
||||
line-height: calc(var(--spacing) * 5);
|
||||
}
|
||||
.leading-\[0\.92\] {
|
||||
--tw-leading: 0.92;
|
||||
line-height: 0.92;
|
||||
}
|
||||
.leading-\[1\.05\] {
|
||||
--tw-leading: 1.05;
|
||||
line-height: 1.05;
|
||||
@@ -2771,10 +2784,6 @@
|
||||
--tw-tracking: 0.2em;
|
||||
letter-spacing: 0.2em;
|
||||
}
|
||||
.tracking-\[0\.12em\] {
|
||||
--tw-tracking: 0.12em;
|
||||
letter-spacing: 0.12em;
|
||||
}
|
||||
.tracking-\[0\.14em\] {
|
||||
--tw-tracking: 0.14em;
|
||||
letter-spacing: 0.14em;
|
||||
@@ -2827,6 +2836,9 @@
|
||||
.whitespace-pre-wrap {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.\!text-white {
|
||||
color: var(--color-white) !important;
|
||||
}
|
||||
.text-\[var\(--bg-accent\)\] {
|
||||
color: var(--bg-accent);
|
||||
}
|
||||
@@ -2989,9 +3001,6 @@
|
||||
.text-cyan-300 {
|
||||
color: var(--color-cyan-300);
|
||||
}
|
||||
.text-emerald-300 {
|
||||
color: var(--color-emerald-300);
|
||||
}
|
||||
.text-emerald-500 {
|
||||
color: var(--color-emerald-500);
|
||||
}
|
||||
@@ -3052,9 +3061,6 @@
|
||||
.text-red-100 {
|
||||
color: var(--color-red-100);
|
||||
}
|
||||
.text-red-300 {
|
||||
color: var(--color-red-300);
|
||||
}
|
||||
.text-red-400 {
|
||||
color: var(--color-red-400);
|
||||
}
|
||||
@@ -3151,6 +3157,12 @@
|
||||
color: color-mix(in oklab, var(--color-white) 60%, transparent);
|
||||
}
|
||||
}
|
||||
.text-white\/65 {
|
||||
color: color-mix(in srgb, #fff 65%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, var(--color-white) 65%, transparent);
|
||||
}
|
||||
}
|
||||
.text-white\/70 {
|
||||
color: color-mix(in srgb, #fff 70%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
@@ -3163,10 +3175,10 @@
|
||||
color: color-mix(in oklab, var(--color-white) 80%, transparent);
|
||||
}
|
||||
}
|
||||
.text-white\/90 {
|
||||
color: color-mix(in srgb, #fff 90%, transparent);
|
||||
.text-white\/85 {
|
||||
color: color-mix(in srgb, #fff 85%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, var(--color-white) 90%, transparent);
|
||||
color: color-mix(in oklab, var(--color-white) 85%, transparent);
|
||||
}
|
||||
}
|
||||
.text-yellow-400 {
|
||||
@@ -3225,20 +3237,6 @@
|
||||
color: var(--text-muted);
|
||||
}
|
||||
}
|
||||
.placeholder-white\/40 {
|
||||
&::-moz-placeholder {
|
||||
color: color-mix(in srgb, #fff 40%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, var(--color-white) 40%, transparent);
|
||||
}
|
||||
}
|
||||
&::placeholder {
|
||||
color: color-mix(in srgb, #fff 40%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
color: color-mix(in oklab, var(--color-white) 40%, transparent);
|
||||
}
|
||||
}
|
||||
}
|
||||
.accent-brand-b1 {
|
||||
accent-color: #0062ff;
|
||||
}
|
||||
@@ -3326,12 +3324,6 @@
|
||||
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + 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-black\/40 {
|
||||
--tw-shadow-color: color-mix(in srgb, #000 40%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 40%, transparent) var(--tw-shadow-alpha), transparent);
|
||||
}
|
||||
}
|
||||
.ring-\[var\(--border-accent\)\] {
|
||||
--tw-ring-color: var(--border-accent);
|
||||
}
|
||||
@@ -3359,10 +3351,6 @@
|
||||
--tw-blur: blur(8px);
|
||||
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,);
|
||||
}
|
||||
.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,);
|
||||
}
|
||||
.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,);
|
||||
}
|
||||
@@ -3494,6 +3482,13 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:text-brand-b1 {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
color: #0062ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.group-hover\:opacity-60 {
|
||||
&:is(:where(.group):hover *) {
|
||||
@media (hover: hover) {
|
||||
@@ -3711,6 +3706,16 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:border-white\/30 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
border-color: color-mix(in srgb, #fff 30%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:border-yellow-500\/30 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -4022,16 +4027,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:bg-white\/\[0\.04\] {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
background-color: color-mix(in srgb, #fff 4%, transparent);
|
||||
@supports (color: color-mix(in lab, red, red)) {
|
||||
background-color: color-mix(in oklab, var(--color-white) 4%, transparent);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:bg-white\/\[0\.05\] {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -4058,6 +4053,14 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:from-brand-b1 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
--tw-gradient-from: #0062ff;
|
||||
--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));
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:from-orange-600 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -4090,6 +4093,14 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:to-brand-b3 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
--tw-gradient-to: #00c896;
|
||||
--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));
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:to-purple-600 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -4516,6 +4527,11 @@
|
||||
outline-color: var(--color-red-700);
|
||||
}
|
||||
}
|
||||
.focus-visible\:outline-white {
|
||||
&:focus-visible {
|
||||
outline-color: var(--color-white);
|
||||
}
|
||||
}
|
||||
.active\:scale-95 {
|
||||
&:active {
|
||||
--tw-scale-x: 95%;
|
||||
@@ -4669,6 +4685,11 @@
|
||||
width: calc(var(--spacing) * 40);
|
||||
}
|
||||
}
|
||||
.sm\:w-auto {
|
||||
@media (width >= 40rem) {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
.sm\:max-w-\[80px\] {
|
||||
@media (width >= 40rem) {
|
||||
max-width: 80px;
|
||||
@@ -4689,11 +4710,26 @@
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
.sm\:grid-cols-4 {
|
||||
@media (width >= 40rem) {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
.sm\:grid-cols-8 {
|
||||
@media (width >= 40rem) {
|
||||
grid-template-columns: repeat(8, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
.sm\:flex-row {
|
||||
@media (width >= 40rem) {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
.sm\:flex-nowrap {
|
||||
@media (width >= 40rem) {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
}
|
||||
.sm\:items-center {
|
||||
@media (width >= 40rem) {
|
||||
align-items: center;
|
||||
@@ -5118,6 +5154,12 @@
|
||||
line-height: var(--tw-leading, var(--text-sm--line-height));
|
||||
}
|
||||
}
|
||||
.md\:text-xl {
|
||||
@media (width >= 48rem) {
|
||||
font-size: var(--text-xl);
|
||||
line-height: var(--tw-leading, var(--text-xl--line-height));
|
||||
}
|
||||
}
|
||||
.md\:text-\[10px\] {
|
||||
@media (width >= 48rem) {
|
||||
font-size: 10px;
|
||||
@@ -5224,31 +5266,16 @@
|
||||
grid-template-columns: 1fr 240px;
|
||||
}
|
||||
}
|
||||
.lg\:grid-cols-\[1fr_minmax\(0\,560px\)\] {
|
||||
@media (width >= 64rem) {
|
||||
grid-template-columns: 1fr minmax(0,560px);
|
||||
}
|
||||
}
|
||||
.lg\:flex-row {
|
||||
@media (width >= 64rem) {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
.lg\:justify-start {
|
||||
@media (width >= 64rem) {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
.lg\:gap-10 {
|
||||
@media (width >= 64rem) {
|
||||
gap: calc(var(--spacing) * 10);
|
||||
}
|
||||
}
|
||||
.lg\:gap-16 {
|
||||
@media (width >= 64rem) {
|
||||
gap: calc(var(--spacing) * 16);
|
||||
}
|
||||
}
|
||||
.lg\:border-r {
|
||||
@media (width >= 64rem) {
|
||||
border-right-style: var(--tw-border-style);
|
||||
@@ -5280,9 +5307,10 @@
|
||||
padding-bottom: calc(var(--spacing) * 8);
|
||||
}
|
||||
}
|
||||
.lg\:text-left {
|
||||
.lg\:text-3xl {
|
||||
@media (width >= 64rem) {
|
||||
text-align: left;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: var(--tw-leading, var(--text-3xl--line-height));
|
||||
}
|
||||
}
|
||||
.xl\:grid-cols-4 {
|
||||
@@ -6132,14 +6160,6 @@
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
@keyframes plus-breathe {
|
||||
0%, 100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
@layer properties {
|
||||
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
||||
*, ::before, ::after, ::backdrop {
|
||||
|
||||
Reference in New Issue
Block a user