@retinalabsllc/zairusjs 0.1.2 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +0 -3
- package/dist/index.d.ts +0 -3
- package/dist/index.js +31 -21
- package/dist/index.mjs +31 -21
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -220,7 +220,7 @@ var Footer = ({
|
|
|
220
220
|
copyrightText,
|
|
221
221
|
topSection
|
|
222
222
|
}) => {
|
|
223
|
-
return /* @__PURE__ */ import_react5.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react5.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "max-w-sm flex flex-col items-start justify-between" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed
|
|
223
|
+
return /* @__PURE__ */ import_react5.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react5.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "max-w-sm flex flex-col items-start justify-between" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed" }, description))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-wrap justify-start gap-x-16 gap-y-12 w-full lg:w-auto text-left" }, columns.map((col, idx) => /* @__PURE__ */ import_react5.default.createElement("div", { key: idx, className: "min-w-30" }, /* @__PURE__ */ import_react5.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 whitespace-nowrap" }, col.title), /* @__PURE__ */ import_react5.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react5.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react5.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ import_react5.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "pt-8 mt-4 border-t border-neutral-200 flex flex-col-reverse md:flex-row justify-between items-start md:items-center gap-6 relative z-20" }, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ import_react5.default.createElement(
|
|
224
224
|
"a",
|
|
225
225
|
{
|
|
226
226
|
key: idx,
|
|
@@ -264,7 +264,7 @@ var HeroSection = ({
|
|
|
264
264
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
265
265
|
}
|
|
266
266
|
}
|
|
267
|
-
), /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-3.5 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "flex h-2 w-2 rounded-full bg-[#3ae9a8]" }), /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-[11px] tracking-wider text-white" }, badgeText)), /* @__PURE__ */ import_react7.default.createElement("h1", { className: "text-4xl sm:text-5xl md:text-6xl text-white tracking-tight leading-[1.3] max-w-3xl mb-6" }, titlePrefix, /* @__PURE__ */ import_react7.default.createElement("span", { className: "relative inline-block mx-1.5 px-3 py-1 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none whitespace-nowrap" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute
|
|
267
|
+
), /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-3.5 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "flex h-2 w-2 rounded-full bg-[#3ae9a8]" }), /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-[11px] tracking-wider text-white" }, badgeText)), /* @__PURE__ */ import_react7.default.createElement("h1", { className: "text-4xl sm:text-5xl md:text-6xl text-white tracking-tight leading-[1.3] max-w-3xl mb-6" }, titlePrefix, /* @__PURE__ */ import_react7.default.createElement("span", { className: "relative inline-block mx-1.5 px-3 py-1 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none whitespace-nowrap" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute bottom-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), highlightText, /* @__PURE__ */ import_react7.default.createElement("span", { className: "absolute -bottom-5 -right-5 flex items-center z-20 pointer-events-none select-none filter drop-shadow-[0_2px_4px_rgba(0,0,0,0.25)]" }, /* @__PURE__ */ import_react7.default.createElement("svg", { width: "16", height: "20", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ import_react7.default.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ import_react7.default.createElement("span", { className: "ml-1 bg-[#21a473] text-[10px] text-white font-mono font-medium px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel)))), /* @__PURE__ */ import_react7.default.createElement("p", { className: "text-sm sm:text-base md:text-lg text-[#bbf7df]/90 max-w-xl mx-auto mb-8 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ import_react7.default.createElement("div", { className: "mb-4" }, /* @__PURE__ */ import_react7.default.createElement(ThreeDButton, { href: ctaHref }, ctaText)), showImage && /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "absolute top-1.5 left-1/2 -translate-x-1/2 w-2.5 h-2.5 bg-[#0a0a0b] rounded-full flex items-center justify-center z-30" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
268
268
|
import_image2.default,
|
|
269
269
|
{
|
|
270
270
|
src: imageSrc,
|
|
@@ -281,35 +281,45 @@ var HeroSection = ({
|
|
|
281
281
|
var import_react8 = __toESM(require("react"));
|
|
282
282
|
var import_react9 = require("@hugeicons/react");
|
|
283
283
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
284
|
-
return /* @__PURE__ */ import_react8.default.createElement("div",
|
|
285
|
-
const
|
|
284
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react8.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4 uppercase" }, tagline), /* @__PURE__ */ import_react8.default.createElement("h2", { className: "text-3xl md:text-4xl tracking-tight text-black leading-[1.1]" }, headline))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
285
|
+
const isWhite = i === 0;
|
|
286
|
+
const isBlack = i === 1;
|
|
287
|
+
const isNeutral = i === 2;
|
|
288
|
+
const getBgStyle = () => {
|
|
289
|
+
if (isWhite) return "bg-white";
|
|
290
|
+
if (isBlack) return "bg-black";
|
|
291
|
+
if (isNeutral) return "bg-neutral-200";
|
|
292
|
+
return "bg-neutral-100";
|
|
293
|
+
};
|
|
294
|
+
const getShadowStyle = () => {
|
|
295
|
+
if (isBlack) return `
|
|
296
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.2),
|
|
297
|
+
inset 0 -3px 0 0 rgba(0, 0, 0, 0.3),
|
|
298
|
+
0 4px 0 0 #0c0c0c,
|
|
299
|
+
0 12px 24px rgba(0, 0, 0, 0.1)
|
|
300
|
+
`;
|
|
301
|
+
return "none";
|
|
302
|
+
};
|
|
303
|
+
const textColor = isBlack ? "text-white" : "text-black";
|
|
304
|
+
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
305
|
+
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
286
306
|
return /* @__PURE__ */ import_react8.default.createElement(
|
|
287
307
|
"div",
|
|
288
308
|
{
|
|
289
309
|
key: i,
|
|
290
|
-
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-
|
|
291
|
-
style: {
|
|
292
|
-
boxShadow: isHighlight ? `
|
|
293
|
-
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
294
|
-
inset 0 -3px 0 0 rgba(0, 0, 0, 0.6),
|
|
295
|
-
0 4px 0 0 #0c0c0c,
|
|
296
|
-
0 12px 24px rgba(0, 0, 0, 0.15)
|
|
297
|
-
` : "none"
|
|
298
|
-
}
|
|
310
|
+
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
311
|
+
style: { boxShadow: getShadowStyle() }
|
|
299
312
|
},
|
|
300
313
|
/* @__PURE__ */ import_react8.default.createElement(
|
|
301
314
|
"div",
|
|
302
315
|
{
|
|
303
316
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
304
|
-
style: {
|
|
305
|
-
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
306
|
-
backgroundRepeat: "repeat"
|
|
307
|
-
}
|
|
317
|
+
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
308
318
|
}
|
|
309
319
|
),
|
|
310
|
-
|
|
311
|
-
/* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${
|
|
312
|
-
/* @__PURE__ */ import_react8.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react8.default.createElement("span", { className: `text-[9px] tracking-widest ${
|
|
320
|
+
isBlack && /* @__PURE__ */ import_react8.default.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
321
|
+
/* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ import_react8.default.createElement(import_react9.HugeiconsIcon, { icon: f.icon, size: 180 }))),
|
|
322
|
+
/* @__PURE__ */ import_react8.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react8.default.createElement("span", { className: `text-[9px] uppercase tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react8.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ import_react8.default.createElement(import_react9.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react8.default.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react8.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
313
323
|
);
|
|
314
324
|
})))));
|
|
315
325
|
};
|
|
@@ -918,7 +928,7 @@ var PortfolioHero = ({
|
|
|
918
928
|
secondaryCtaHref
|
|
919
929
|
}) => {
|
|
920
930
|
const heroContentRef = useScrollAnimation();
|
|
921
|
-
return /* @__PURE__ */ import_react29.default.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full
|
|
931
|
+
return /* @__PURE__ */ import_react29.default.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full" }, /* @__PURE__ */ import_react29.default.createElement(
|
|
922
932
|
"div",
|
|
923
933
|
{
|
|
924
934
|
ref: heroContentRef,
|
package/dist/index.mjs
CHANGED
|
@@ -165,7 +165,7 @@ var Footer = ({
|
|
|
165
165
|
copyrightText,
|
|
166
166
|
topSection
|
|
167
167
|
}) => {
|
|
168
|
-
return /* @__PURE__ */ React4.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React4.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-16 mb-12 text-left" }, /* @__PURE__ */ React4.createElement("div", { className: "max-w-sm flex flex-col items-start justify-between" }, /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed
|
|
168
|
+
return /* @__PURE__ */ React4.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React4.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React4.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-16 mb-12 text-left" }, /* @__PURE__ */ React4.createElement("div", { className: "max-w-sm flex flex-col items-start justify-between" }, /* @__PURE__ */ React4.createElement("div", null, /* @__PURE__ */ React4.createElement("p", { className: "text-[14px] text-neutral-600 leading-relaxed" }, description))), /* @__PURE__ */ React4.createElement("div", { className: "flex flex-wrap justify-start gap-x-16 gap-y-12 w-full lg:w-auto text-left" }, columns.map((col, idx) => /* @__PURE__ */ React4.createElement("div", { key: idx, className: "min-w-30" }, /* @__PURE__ */ React4.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 whitespace-nowrap" }, col.title), /* @__PURE__ */ React4.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React4.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React4.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ React4.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))))), /* @__PURE__ */ React4.createElement("div", { className: "pt-8 mt-4 border-t border-neutral-200 flex flex-col-reverse md:flex-row justify-between items-start md:items-center gap-6 relative z-20" }, /* @__PURE__ */ React4.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ React4.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ React4.createElement(
|
|
169
169
|
"a",
|
|
170
170
|
{
|
|
171
171
|
key: idx,
|
|
@@ -209,7 +209,7 @@ var HeroSection = ({
|
|
|
209
209
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
210
210
|
}
|
|
211
211
|
}
|
|
212
|
-
), /* @__PURE__ */ React5.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ React5.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-3.5 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ React5.createElement("span", { className: "flex h-2 w-2 rounded-full bg-[#3ae9a8]" }), /* @__PURE__ */ React5.createElement("span", { className: "text-[11px] tracking-wider text-white" }, badgeText)), /* @__PURE__ */ React5.createElement("h1", { className: "text-4xl sm:text-5xl md:text-6xl text-white tracking-tight leading-[1.3] max-w-3xl mb-6" }, titlePrefix, /* @__PURE__ */ React5.createElement("span", { className: "relative inline-block mx-1.5 px-3 py-1 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none whitespace-nowrap" }, /* @__PURE__ */ React5.createElement("span", { className: "absolute
|
|
212
|
+
), /* @__PURE__ */ React5.createElement("div", { className: "relative max-w-5xl mx-auto px-4 sm:px-6 w-full flex flex-col items-center text-center z-10" }, /* @__PURE__ */ React5.createElement("div", { className: "inline-flex items-center gap-1.5 mb-6 px-3.5 py-1.5 rounded-full bg-white/10 backdrop-blur-md shadow-xs" }, /* @__PURE__ */ React5.createElement("span", { className: "flex h-2 w-2 rounded-full bg-[#3ae9a8]" }), /* @__PURE__ */ React5.createElement("span", { className: "text-[11px] tracking-wider text-white" }, badgeText)), /* @__PURE__ */ React5.createElement("h1", { className: "text-4xl sm:text-5xl md:text-6xl text-white tracking-tight leading-[1.3] max-w-3xl mb-6" }, titlePrefix, /* @__PURE__ */ React5.createElement("span", { className: "relative inline-block mx-1.5 px-3 py-1 bg-[#21a473]/25 border border-[#3ae9a8] rounded-sm text-white select-none whitespace-nowrap" }, /* @__PURE__ */ React5.createElement("span", { className: "absolute top-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute top-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute bottom-[-3.5px] left-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), /* @__PURE__ */ React5.createElement("span", { className: "absolute bottom-[-3.5px] right-[-3.5px] w-2 h-2 bg-white border border-[#21a473] rounded-[1px] z-10" }), highlightText, /* @__PURE__ */ React5.createElement("span", { className: "absolute -bottom-5 -right-5 flex items-center z-20 pointer-events-none select-none filter drop-shadow-[0_2px_4px_rgba(0,0,0,0.25)]" }, /* @__PURE__ */ React5.createElement("svg", { width: "16", height: "20", viewBox: "0 0 16 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "transform -rotate-12" }, /* @__PURE__ */ React5.createElement("path", { d: "M1 1V17.8L5.8 13.1H12.8L1 1Z", fill: "#21a473", stroke: "white", strokeWidth: "1.8", strokeLinejoin: "round" })), /* @__PURE__ */ React5.createElement("span", { className: "ml-1 bg-[#21a473] text-[10px] text-white font-mono font-medium px-2 py-0.5 rounded-full border border-white tracking-wide" }, cursorLabel)))), /* @__PURE__ */ React5.createElement("p", { className: "text-sm sm:text-base md:text-lg text-[#bbf7df]/90 max-w-xl mx-auto mb-8 font-light leading-relaxed" }, subtitle), /* @__PURE__ */ React5.createElement("div", { className: "mb-4" }, /* @__PURE__ */ React5.createElement(ThreeDButton, { href: ctaHref }, ctaText)), showImage && /* @__PURE__ */ React5.createElement("div", { className: "w-full max-w-4xl mx-auto px-2 sm:px-6" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full flex flex-col items-center" }, /* @__PURE__ */ React5.createElement("div", { className: "relative w-full rounded-t-xl overflow-hidden border-[5px] border-[#1c1c1e] bg-[#1c1c1e] shadow-2xl aspect-video" }, /* @__PURE__ */ React5.createElement("div", { className: "absolute top-1.5 left-1/2 -translate-x-1/2 w-2.5 h-2.5 bg-[#0a0a0b] rounded-full flex items-center justify-center z-30" }, /* @__PURE__ */ React5.createElement("div", { className: "w-1 h-1 bg-[#1a2d42] rounded-full" })), /* @__PURE__ */ React5.createElement("div", { className: "relative w-full h-full rounded-sm overflow-hidden" }, /* @__PURE__ */ React5.createElement(
|
|
213
213
|
Image2,
|
|
214
214
|
{
|
|
215
215
|
src: imageSrc,
|
|
@@ -226,35 +226,45 @@ var HeroSection = ({
|
|
|
226
226
|
import React6 from "react";
|
|
227
227
|
import { HugeiconsIcon as HugeiconsIcon3 } from "@hugeicons/react";
|
|
228
228
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
229
|
-
return /* @__PURE__ */ React6.createElement("div",
|
|
230
|
-
const
|
|
229
|
+
return /* @__PURE__ */ React6.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React6.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React6.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React6.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4 uppercase" }, tagline), /* @__PURE__ */ React6.createElement("h2", { className: "text-3xl md:text-4xl tracking-tight text-black leading-[1.1]" }, headline))), /* @__PURE__ */ React6.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
230
|
+
const isWhite = i === 0;
|
|
231
|
+
const isBlack = i === 1;
|
|
232
|
+
const isNeutral = i === 2;
|
|
233
|
+
const getBgStyle = () => {
|
|
234
|
+
if (isWhite) return "bg-white";
|
|
235
|
+
if (isBlack) return "bg-black";
|
|
236
|
+
if (isNeutral) return "bg-neutral-200";
|
|
237
|
+
return "bg-neutral-100";
|
|
238
|
+
};
|
|
239
|
+
const getShadowStyle = () => {
|
|
240
|
+
if (isBlack) return `
|
|
241
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.2),
|
|
242
|
+
inset 0 -3px 0 0 rgba(0, 0, 0, 0.3),
|
|
243
|
+
0 4px 0 0 #0c0c0c,
|
|
244
|
+
0 12px 24px rgba(0, 0, 0, 0.1)
|
|
245
|
+
`;
|
|
246
|
+
return "none";
|
|
247
|
+
};
|
|
248
|
+
const textColor = isBlack ? "text-white" : "text-black";
|
|
249
|
+
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
250
|
+
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
231
251
|
return /* @__PURE__ */ React6.createElement(
|
|
232
252
|
"div",
|
|
233
253
|
{
|
|
234
254
|
key: i,
|
|
235
|
-
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-
|
|
236
|
-
style: {
|
|
237
|
-
boxShadow: isHighlight ? `
|
|
238
|
-
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.35),
|
|
239
|
-
inset 0 -3px 0 0 rgba(0, 0, 0, 0.6),
|
|
240
|
-
0 4px 0 0 #0c0c0c,
|
|
241
|
-
0 12px 24px rgba(0, 0, 0, 0.15)
|
|
242
|
-
` : "none"
|
|
243
|
-
}
|
|
255
|
+
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
256
|
+
style: { boxShadow: getShadowStyle() }
|
|
244
257
|
},
|
|
245
258
|
/* @__PURE__ */ React6.createElement(
|
|
246
259
|
"div",
|
|
247
260
|
{
|
|
248
261
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
249
|
-
style: {
|
|
250
|
-
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
|
|
251
|
-
backgroundRepeat: "repeat"
|
|
252
|
-
}
|
|
262
|
+
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
253
263
|
}
|
|
254
264
|
),
|
|
255
|
-
|
|
256
|
-
/* @__PURE__ */ React6.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React6.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${
|
|
257
|
-
/* @__PURE__ */ React6.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React6.createElement("span", { className: `text-[9px] tracking-widest ${
|
|
265
|
+
isBlack && /* @__PURE__ */ React6.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
266
|
+
/* @__PURE__ */ React6.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React6.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: f.icon, size: 180 }))),
|
|
267
|
+
/* @__PURE__ */ React6.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React6.createElement("span", { className: `text-[9px] uppercase tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ React6.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ React6.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React6.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ React6.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
258
268
|
);
|
|
259
269
|
})))));
|
|
260
270
|
};
|
|
@@ -863,7 +873,7 @@ var PortfolioHero = ({
|
|
|
863
873
|
secondaryCtaHref
|
|
864
874
|
}) => {
|
|
865
875
|
const heroContentRef = useScrollAnimation();
|
|
866
|
-
return /* @__PURE__ */ React20.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full
|
|
876
|
+
return /* @__PURE__ */ React20.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full" }, /* @__PURE__ */ React20.createElement(
|
|
867
877
|
"div",
|
|
868
878
|
{
|
|
869
879
|
ref: heroContentRef,
|