lang
This commit is contained in:
1 parent
ee054955b9
commit
c99065496b
28 files changed
+2045
-120
No files matched your search
Vendored
+1
-1
@@ -1 +1 @@
|
||||
body{margin:0;font-family:"IBM Plex Sans",sans-serif;background:#0c0a09;color:#f5f5f4}a{color:inherit}button{cursor:pointer}
|
||||
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--cta-glow:0 0 0 0 transparent}body{font-family:IBM Plex Sans,Avenir Next,Segoe UI,sans-serif;background:radial-gradient(circle at top left,hsla(39,82%,69%,.24),transparent 28%),radial-gradient(circle at top right,rgba(157,217,210,.16),traLine truncated
|
||||
Vendored
+1
-1
@@ -1 +1 @@
|
||||
document.documentElement.dataset.js="ready";
|
||||
var l=document.documentElement;l.dataset.js="ready";var a=document.querySelector("[data-menu-toggle]"),d=document.querySelector("[data-menu-panel]"),r=[...document.querySelectorAll("[data-mega-trigger]")],c=[...document.querySelectorAll("[data-mega-menu]")];if(a&&d){let t=()=>{d.classList.add("hidden"),a.setAttribute("aria-expanded","false")},i=()=>{d.classList.remove("hidden"),a.setAttribute("aria-expanded","true")};a.addEventListener("click",()=>{if(a.getAttribute("aria-expanded")==="true"){t();return}i()}),window.addEventListener("resize",()=>{if(window.innerWidth>=1024){d.classList.remove("hidden"),a.setAttribute("aria-expanded","true");return}t()})}if(r.length>0&&c.length>0){let t=()=>{r.forEach((e)=>{e.setAttribute("aria-expanded","false"),e.closest(".desktop-nav__entry")?.classList.remove("desktop-nav__entry--open")}),c.forEach((e)=>{e.classList.add("hidden")})},i=(e)=>{let n=e.dataset.megaTarget;if(!n)return;t(),e.setAttribute("aria-expanded","true"),e.closest(".desktop-nav__entry")?.classList.add("desktop-nav__entry--open"),document.getElementById(n)?.classList.remove("hidden")};r.forEach((e)=>{e.addEventListener("click",(n)=>{if(window.innerWidth<1024)return;let s=e.getAttribute("aria-expanded")==="true";if(e instanceof HTMLAnchorElement&&s)return;if(n.preventDefault(),s){t();return}i(e)})}),document.addEventListener("click",(e)=>{if(window.innerWidth<1024)return;let n=e.target;if(!(n instanceof Node))return;let s=r.some((o)=>o.contains(n)),m=c.some((o)=>o.contains(n));if(!s&&!m)t()}),document.addEventListener("keydown",(e)=>{if(e.key==="Escape")t()}),window.addEventListener("resize",()=>{if(window.innerWidth<1024)t()})}var u=document.querySelector("button[type='submit']");if(u)u.addEventListener("mouseenter",()=>{l.style.setProperty("--cta-glow","0 0 0 4px rgba(252, 211, 77, 0.12)")}),u.addEventListener("mouseleave",()=>{l.style.setProperty("--cta-glow","0 0 0 0 rgba(0,0,0,0)")});
|
||||
Vendored
+1
-1
@@ -1,4 +1,4 @@
|
||||
{
|
||||
"app.css": "/dist/app.css",
|
||||
"app.js": "/dist/app.js"
|
||||
}
|
||||
}
|
||||
+158
-3
@@ -8,15 +8,170 @@
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "IBM Plex Sans", sans-serif;
|
||||
font-family:
|
||||
"IBM Plex Sans",
|
||||
"Avenir Next",
|
||||
"Segoe UI",
|
||||
sans-serif;
|
||||
background:
|
||||
radial-gradient(circle at top left, rgba(241, 196, 110, 0.24), transparent 28%),
|
||||
radial-gradient(circle at top right, rgba(157, 217, 210, 0.16), transparent 34%),
|
||||
linear-gradient(180deg, #fbfaf6 0%, #f5efe3 55%, #f7f3ea 100%);
|
||||
@apply text-stone-900;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
font-family:
|
||||
"Cormorant Garamond",
|
||||
"IBM Plex Sans",
|
||||
serif;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
.site-container {
|
||||
@apply mx-auto w-full max-w-7xl px-4 sm:px-5 lg:px-8;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
@apply sticky top-0 z-40 backdrop-blur;
|
||||
}
|
||||
|
||||
.utility-bar {
|
||||
background: linear-gradient(90deg, rgba(20, 33, 61, 0.98), rgba(37, 58, 89, 0.94));
|
||||
@apply border-b border-white/10 text-stone-100;
|
||||
}
|
||||
|
||||
.header-locale {
|
||||
@apply flex w-full flex-wrap items-center justify-start gap-2 text-sm text-stone-100 sm:w-auto sm:justify-end;
|
||||
}
|
||||
|
||||
.locale-picker {
|
||||
@apply relative w-full sm:w-auto;
|
||||
}
|
||||
|
||||
.locale-picker__summary {
|
||||
@apply flex w-full cursor-pointer list-none items-center justify-between gap-2 rounded-full border border-white/0 px-3 py-1.5 text-stone-100 transition hover:border-white/20 hover:bg-white/10 hover:text-white sm:w-auto sm:justify-start;
|
||||
}
|
||||
|
||||
.locale-picker[open] .locale-picker__summary {
|
||||
@apply border-white/20 bg-white/10 text-white;
|
||||
}
|
||||
|
||||
.locale-picker__summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.locale-picker__value {
|
||||
@apply font-medium;
|
||||
}
|
||||
|
||||
.locale-picker__code,
|
||||
.locale-picker__item-meta,
|
||||
.locale-picker__chevron {
|
||||
@apply text-[0.74rem] uppercase tracking-[0.16em] text-stone-300/80;
|
||||
}
|
||||
|
||||
.locale-picker__panel {
|
||||
@apply left-0 right-0 z-50 mt-3 min-w-[13rem] rounded-3xl border border-white/70 bg-white/95 p-3 text-stone-900 shadow-[0_22px_48px_rgba(20,33,61,0.18)] backdrop-blur sm:absolute sm:left-auto sm:right-0;
|
||||
}
|
||||
|
||||
.locale-picker__title {
|
||||
@apply mb-2 px-2 text-[0.68rem] font-semibold uppercase tracking-[0.2em] text-stone-400;
|
||||
}
|
||||
|
||||
.locale-picker__item {
|
||||
@apply flex w-full items-center justify-between rounded-2xl px-3 py-2 text-sm text-stone-700 transition hover:bg-stone-100 hover:text-stone-900;
|
||||
}
|
||||
|
||||
.locale-picker__item--active {
|
||||
@apply bg-stone-100 font-medium text-stone-900;
|
||||
}
|
||||
|
||||
.main-nav {
|
||||
background: rgba(255, 251, 245, 0.82);
|
||||
@apply border-b border-white/60 shadow-[0_10px_30px_rgba(20,33,61,0.08)];
|
||||
}
|
||||
|
||||
.header-bar {
|
||||
@apply flex flex-wrap items-center gap-4 py-4 sm:gap-5 sm:py-5 lg:flex-nowrap;
|
||||
}
|
||||
|
||||
.brand-mark {
|
||||
@apply inline-flex items-end gap-0.5 text-4xl font-black leading-none tracking-tight text-black transition-transform duration-300 hover:-translate-y-0.5 sm:text-5xl;
|
||||
}
|
||||
|
||||
.brand-mark__accent {
|
||||
@apply text-amber-500;
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
@apply inline-flex h-11 items-center justify-center rounded-full border border-stone-300/70 bg-white/80 px-5 text-xs font-semibold uppercase tracking-[0.28em] text-stone-900 transition hover:border-amber-500 hover:text-amber-600;
|
||||
}
|
||||
|
||||
.menu-panel {
|
||||
@apply order-last w-full rounded-3xl border border-white/70 bg-white/95 p-4 shadow-[0_16px_34px_rgba(20,33,61,0.12)] backdrop-blur lg:order-none lg:rounded-none lg:border-0 lg:bg-transparent lg:p-0 lg:shadow-none;
|
||||
}
|
||||
|
||||
.desktop-nav {
|
||||
@apply flex items-center justify-center gap-8 xl:gap-12;
|
||||
}
|
||||
|
||||
.desktop-nav__link {
|
||||
@apply inline-flex items-center py-4 text-[1.04rem] font-medium text-stone-800 transition hover:text-amber-600;
|
||||
}
|
||||
|
||||
.desktop-nav__toggle {
|
||||
@apply inline-flex h-8 w-5 items-center justify-center text-sm text-stone-400 transition hover:text-amber-600;
|
||||
}
|
||||
|
||||
.desktop-nav__entry--open .desktop-nav__link,
|
||||
.desktop-nav__entry--open .desktop-nav__toggle {
|
||||
@apply text-amber-600;
|
||||
}
|
||||
|
||||
.mega-menu {
|
||||
background: linear-gradient(180deg, rgba(255, 252, 247, 0.98), rgba(252, 248, 240, 0.98));
|
||||
@apply absolute inset-x-0 top-full z-50 border-t border-white/70 shadow-[0_28px_60px_rgba(20,33,61,0.16)] backdrop-blur;
|
||||
}
|
||||
|
||||
.mega-menu__grid {
|
||||
@apply site-container grid grid-cols-2 gap-x-12 gap-y-10 py-10 lg:grid-cols-4 xl:grid-cols-5;
|
||||
}
|
||||
|
||||
.mega-menu__heading {
|
||||
@apply mb-4 inline-flex text-sm font-semibold uppercase tracking-[0.12em] text-stone-900 transition hover:text-amber-600;
|
||||
}
|
||||
|
||||
.mega-menu__link {
|
||||
@apply inline-flex text-[1.02rem] leading-7 text-stone-700 transition hover:translate-x-1 hover:text-amber-600;
|
||||
}
|
||||
|
||||
.mega-menu__all {
|
||||
@apply col-span-full flex items-start justify-end border-t border-stone-200 pt-5;
|
||||
}
|
||||
|
||||
.mega-menu__all-link {
|
||||
@apply inline-flex text-sm font-semibold uppercase tracking-[0.18em] text-amber-600 transition hover:text-amber-700;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
@apply ml-0 flex items-center gap-4 text-2xl text-stone-900 lg:ml-auto;
|
||||
}
|
||||
|
||||
.nav-icon {
|
||||
@apply flex h-11 w-11 items-center justify-center rounded-full bg-white/70 text-[1.35rem] shadow-[0_10px_24px_rgba(20,33,61,0.08)] transition hover:-translate-y-0.5 hover:text-amber-600;
|
||||
}
|
||||
|
||||
@media (max-width: 1023px) {
|
||||
.desktop-nav,
|
||||
.mega-menu {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
button[type='submit'] {
|
||||
box-shadow: var(--cta-glow);
|
||||
}
|
||||
|
||||
@@ -1,6 +1,102 @@
|
||||
const root = document.documentElement;
|
||||
root.dataset.js = "ready";
|
||||
|
||||
const menuToggle = document.querySelector("[data-menu-toggle]");
|
||||
const menuPanel = document.querySelector("[data-menu-panel]");
|
||||
const megaTriggers = [...document.querySelectorAll("[data-mega-trigger]")];
|
||||
const megaMenus = [...document.querySelectorAll("[data-mega-menu]")];
|
||||
|
||||
if (menuToggle && menuPanel) {
|
||||
const closeMenu = () => {
|
||||
menuPanel.classList.add("hidden");
|
||||
menuToggle.setAttribute("aria-expanded", "false");
|
||||
};
|
||||
|
||||
const openMenu = () => {
|
||||
menuPanel.classList.remove("hidden");
|
||||
menuToggle.setAttribute("aria-expanded", "true");
|
||||
};
|
||||
|
||||
menuToggle.addEventListener("click", () => {
|
||||
const expanded = menuToggle.getAttribute("aria-expanded") === "true";
|
||||
if (expanded) {
|
||||
closeMenu();
|
||||
return;
|
||||
}
|
||||
openMenu();
|
||||
});
|
||||
|
||||
window.addEventListener("resize", () => {
|
||||
if (window.innerWidth >= 1024) {
|
||||
menuPanel.classList.remove("hidden");
|
||||
menuToggle.setAttribute("aria-expanded", "true");
|
||||
return;
|
||||
}
|
||||
closeMenu();
|
||||
});
|
||||
}
|
||||
|
||||
if (megaTriggers.length > 0 && megaMenus.length > 0) {
|
||||
const closeMegaMenus = () => {
|
||||
megaTriggers.forEach((trigger) => {
|
||||
trigger.setAttribute("aria-expanded", "false");
|
||||
trigger.closest(".desktop-nav__entry")?.classList.remove("desktop-nav__entry--open");
|
||||
});
|
||||
megaMenus.forEach((menu) => {
|
||||
menu.classList.add("hidden");
|
||||
});
|
||||
};
|
||||
|
||||
const openMegaMenu = (trigger) => {
|
||||
const target = trigger.dataset.megaTarget;
|
||||
if (!target) return;
|
||||
closeMegaMenus();
|
||||
trigger.setAttribute("aria-expanded", "true");
|
||||
trigger.closest(".desktop-nav__entry")?.classList.add("desktop-nav__entry--open");
|
||||
document.getElementById(target)?.classList.remove("hidden");
|
||||
};
|
||||
|
||||
megaTriggers.forEach((trigger) => {
|
||||
trigger.addEventListener("click", (event) => {
|
||||
if (window.innerWidth < 1024) return;
|
||||
const expanded = trigger.getAttribute("aria-expanded") === "true";
|
||||
const isLinkTrigger = trigger instanceof HTMLAnchorElement;
|
||||
if (isLinkTrigger && expanded) {
|
||||
return;
|
||||
}
|
||||
event.preventDefault();
|
||||
if (expanded) {
|
||||
closeMegaMenus();
|
||||
return;
|
||||
}
|
||||
openMegaMenu(trigger);
|
||||
});
|
||||
});
|
||||
|
||||
document.addEventListener("click", (event) => {
|
||||
if (window.innerWidth < 1024) return;
|
||||
const target = event.target;
|
||||
if (!(target instanceof Node)) return;
|
||||
const insideTrigger = megaTriggers.some((trigger) => trigger.contains(target));
|
||||
const insideMenu = megaMenus.some((menu) => menu.contains(target));
|
||||
if (!insideTrigger && !insideMenu) {
|
||||
closeMegaMenus();
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener("keydown", (event) => {
|
||||
if (event.key === "Escape") {
|
||||
closeMegaMenus();
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener("resize", () => {
|
||||
if (window.innerWidth < 1024) {
|
||||
closeMegaMenus();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const cartButton = document.querySelector("button[type='submit']");
|
||||
if (cartButton) {
|
||||
cartButton.addEventListener("mouseenter", () => {
|
||||
|
||||
Reference in new issue
Block a user