@loafmarkets/ui 0.1.366 → 0.1.368
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 +17 -3
- package/dist/index.d.ts +17 -3
- package/dist/index.js +728 -370
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +728 -370
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -54,7 +54,7 @@ var buttonVariants = classVarianceAuthority.cva(
|
|
|
54
54
|
primary: "bg-teal-500 text-slate-950 hover:bg-teal-400 focus-visible:ring-teal-200",
|
|
55
55
|
onboarding: "rounded-lg bg-[#F2D898] text-[#0A0C15] shadow-[0_20px_60px_rgba(242,216,152,0.35)] transition will-change-transform hover:-translate-y-0.5 hover:brightness-110 focus-visible:ring-[#F2D898]/50 focus-visible:ring-offset-[#0A0C15]",
|
|
56
56
|
onboardingOutline: "rounded-lg border border-[#F2D898] bg-transparent text-white hover:bg-white/5 focus-visible:ring-[#F2D898]/50 focus-visible:ring-offset-[#0A0C15]",
|
|
57
|
-
accent: "bg-[var(--color-accent,#e6c87e)] text-black hover:bg-[var(--color-accent-hover,#
|
|
57
|
+
accent: "bg-[var(--color-accent,#e6c87e)] text-black hover:bg-[var(--color-accent-hover,#F2D898)] focus-visible:ring-[var(--color-accent,#e6c87e)]",
|
|
58
58
|
accentOutline: "border border-[var(--color-accent,#e6c87e)] bg-transparent text-[var(--color-accent,#e6c87e)] hover:bg-[rgba(230,200,126,0.10)] focus-visible:ring-[var(--color-accent,#e6c87e)]",
|
|
59
59
|
media: "border border-white/10 bg-transparent text-white/90 hover:bg-white/5 hover:border-[var(--color-accent,#e6c87e)] hover:text-[var(--color-accent,#e6c87e)] focus-visible:ring-[var(--color-accent,#e6c87e)]",
|
|
60
60
|
outline: "border border-slate-800/20 bg-white text-slate-900 hover:border-slate-800/40 focus-visible:ring-slate-200",
|
|
@@ -808,7 +808,7 @@ function HousePositionSlider({
|
|
|
808
808
|
}
|
|
809
809
|
},
|
|
810
810
|
placeholder: "Price",
|
|
811
|
-
className: "w-full rounded-[8px] border border-white/10 bg-black/30 px-4 py-3 pr-14 text-[0.95rem] text-white outline-none focus:border-[#
|
|
811
|
+
className: "w-full rounded-[8px] border border-white/10 bg-black/30 px-4 py-3 pr-14 text-[0.95rem] text-white outline-none focus:border-[#E6C87E]"
|
|
812
812
|
}
|
|
813
813
|
),
|
|
814
814
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-4 top-1/2 -translate-y-1/2 text-[0.8rem] text-white/50", children: "USD" })
|
|
@@ -818,7 +818,7 @@ function HousePositionSlider({
|
|
|
818
818
|
"Available: $",
|
|
819
819
|
availableCash.toLocaleString()
|
|
820
820
|
] }),
|
|
821
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "text-[#
|
|
821
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "text-[#E6C87E] hover:underline", children: "Add Funds" })
|
|
822
822
|
] })
|
|
823
823
|
] })
|
|
824
824
|
] });
|
|
@@ -1021,7 +1021,7 @@ var styles = {
|
|
|
1021
1021
|
addFundsButton: {
|
|
1022
1022
|
background: "none",
|
|
1023
1023
|
border: "none",
|
|
1024
|
-
color: "#
|
|
1024
|
+
color: "#E6C87E",
|
|
1025
1025
|
fontSize: "0.75rem",
|
|
1026
1026
|
cursor: "pointer",
|
|
1027
1027
|
padding: 0
|
|
@@ -1837,7 +1837,8 @@ function DepthRow({
|
|
|
1837
1837
|
amountPrecision,
|
|
1838
1838
|
hasUserOrder,
|
|
1839
1839
|
onPriceClick,
|
|
1840
|
-
flashOnMount
|
|
1840
|
+
flashOnMount,
|
|
1841
|
+
fillHeight
|
|
1841
1842
|
}) {
|
|
1842
1843
|
const isAsk = side === "ask";
|
|
1843
1844
|
const rowRef = React5__namespace.useRef(null);
|
|
@@ -1847,7 +1848,7 @@ function DepthRow({
|
|
|
1847
1848
|
{
|
|
1848
1849
|
ref: rowRef,
|
|
1849
1850
|
className: "relative grid grid-cols-3 items-center gap-3 px-3 text-[0.8rem]",
|
|
1850
|
-
style: { height: `${DEPTH_ROW_HEIGHT_PX}px`, cursor: onPriceClick ? "pointer" : void 0 },
|
|
1851
|
+
style: fillHeight ? { flex: "1 1 0", minHeight: 0, cursor: onPriceClick ? "pointer" : void 0 } : { height: `${DEPTH_ROW_HEIGHT_PX}px`, cursor: onPriceClick ? "pointer" : void 0 },
|
|
1851
1852
|
onClick: onPriceClick ? () => onPriceClick(price) : void 0,
|
|
1852
1853
|
children: [
|
|
1853
1854
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -2234,7 +2235,8 @@ function DesktopOrderbookLayout({
|
|
|
2234
2235
|
amountPrecision,
|
|
2235
2236
|
hasUserOrder: userAskPrices.has(l.price),
|
|
2236
2237
|
onPriceClick,
|
|
2237
|
-
flashOnMount: newAskPrices.has(l.price)
|
|
2238
|
+
flashOnMount: newAskPrices.has(l.price),
|
|
2239
|
+
fillHeight
|
|
2238
2240
|
},
|
|
2239
2241
|
`ask-${l.price}`
|
|
2240
2242
|
))
|
|
@@ -2272,7 +2274,8 @@ function DesktopOrderbookLayout({
|
|
|
2272
2274
|
amountPrecision,
|
|
2273
2275
|
hasUserOrder: userBidPrices.has(l.price),
|
|
2274
2276
|
onPriceClick,
|
|
2275
|
-
flashOnMount: newBidPrices.has(l.price)
|
|
2277
|
+
flashOnMount: newBidPrices.has(l.price),
|
|
2278
|
+
fillHeight
|
|
2276
2279
|
},
|
|
2277
2280
|
`bid-${l.price}`
|
|
2278
2281
|
))
|
|
@@ -2629,6 +2632,9 @@ var PropertyTour = React5__namespace.forwardRef(
|
|
|
2629
2632
|
ref: videoRef,
|
|
2630
2633
|
className: "absolute inset-0 h-full w-full object-cover object-center",
|
|
2631
2634
|
controls,
|
|
2635
|
+
controlsList: "nodownload noplaybackrate",
|
|
2636
|
+
disablePictureInPicture: true,
|
|
2637
|
+
onContextMenu: (e) => e.preventDefault(),
|
|
2632
2638
|
loop,
|
|
2633
2639
|
autoPlay,
|
|
2634
2640
|
muted,
|
|
@@ -2684,7 +2690,7 @@ var categoryStyles = {
|
|
|
2684
2690
|
label: "Market News",
|
|
2685
2691
|
backgroundColor: "rgba(248, 209, 47, 0.15)",
|
|
2686
2692
|
borderColor: "rgba(248, 209, 47, 0.45)",
|
|
2687
|
-
color: "#
|
|
2693
|
+
color: "#F2D898"
|
|
2688
2694
|
}
|
|
2689
2695
|
};
|
|
2690
2696
|
var formatDate = (value) => {
|
|
@@ -2853,7 +2859,7 @@ function NewsArticleModal({ item, onClose }) {
|
|
|
2853
2859
|
gap: "0.4rem",
|
|
2854
2860
|
fontSize: "0.8rem",
|
|
2855
2861
|
fontWeight: 600,
|
|
2856
|
-
color: "var(--color-accent, #
|
|
2862
|
+
color: "var(--color-accent, #E6C87E)",
|
|
2857
2863
|
textDecoration: "none",
|
|
2858
2864
|
transition: "opacity 0.15s"
|
|
2859
2865
|
},
|
|
@@ -2955,7 +2961,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
|
|
|
2955
2961
|
subheading ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-white/60", children: subheading }) : null
|
|
2956
2962
|
] })
|
|
2957
2963
|
] }),
|
|
2958
|
-
isHomeVariant && viewAllHref ? /* @__PURE__ */ jsxRuntime.jsxs("a", { href: viewAllHref, style: { color: "var(--color-accent, #
|
|
2964
|
+
isHomeVariant && viewAllHref ? /* @__PURE__ */ jsxRuntime.jsxs("a", { href: viewAllHref, style: { color: "var(--color-accent, #E6C87E)", fontWeight: 500, fontSize: "0.75rem", textDecoration: "none", display: "flex", alignItems: "center", gap: "0.25rem", height: "24px" }, children: [
|
|
2959
2965
|
viewAllLabel,
|
|
2960
2966
|
/* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) })
|
|
2961
2967
|
] }) : !isHomeVariant && !isPurchaseVariant ? connectionStatus === "connecting" ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center font-semibold uppercase", style: { gap: "0.35rem", fontSize: "0.8rem", letterSpacing: "0.15em", color: "#f97316" }, children: [
|
|
@@ -2974,7 +2980,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
|
|
|
2974
2980
|
style: {
|
|
2975
2981
|
background: "transparent",
|
|
2976
2982
|
border: "none",
|
|
2977
|
-
borderBottom: homeTab === tab ? "2px solid var(--color-accent, #
|
|
2983
|
+
borderBottom: homeTab === tab ? "2px solid var(--color-accent, #E6C87E)" : "2px solid transparent",
|
|
2978
2984
|
padding: "0 0 0.5rem 0",
|
|
2979
2985
|
marginBottom: "-1px",
|
|
2980
2986
|
fontSize: "0.75rem",
|
|
@@ -3015,7 +3021,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
|
|
|
3015
3021
|
purchase.id
|
|
3016
3022
|
);
|
|
3017
3023
|
}) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: "3rem 0", gap: "0.75rem" }, children: [
|
|
3018
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "28px", height: "28px", border: "3px solid rgba(255,255,255,0.1)", borderTopColor: "var(--color-accent, #
|
|
3024
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "28px", height: "28px", border: "3px solid rgba(255,255,255,0.1)", borderTopColor: "var(--color-accent, #E6C87E)", borderRadius: "50%", animation: "propertyNewsSpin 1s linear infinite" } }),
|
|
3019
3025
|
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.4)" }, children: "Awaiting offering..." })
|
|
3020
3026
|
] }) : isHomeVariant ? hasItems ? homePaginatedItems.map((item, index) => {
|
|
3021
3027
|
const key = item.displayId ?? item.id ?? `${item.title}-${index}`;
|
|
@@ -3057,7 +3063,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
|
|
|
3057
3063
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: isMobile ? "0.35rem" : "0.5rem", alignItems: "center", flexWrap: "wrap" }, children: [
|
|
3058
3064
|
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#848e9c", fontSize: isMobile ? "0.55rem" : "0.7rem" }, children: formatDateShort(item.date) }),
|
|
3059
3065
|
item.source && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: isMobile ? "0.08rem 0.35rem" : "0.1rem 0.4rem", borderRadius: "3px", fontSize: isMobile ? "0.52rem" : "0.62rem", fontWeight: 500, backgroundColor: "rgba(255,255,255,0.07)", color: "#848e9c", whiteSpace: "nowrap" }, children: item.source }),
|
|
3060
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: isMobile ? "0.1rem 0.35rem" : "0.15rem 0.4rem", borderRadius: "2px", fontSize: isMobile ? "0.52rem" : "0.65rem", fontWeight: 500, backgroundColor: isProperty ? "rgba(14,203,129,0.1)" : "rgba(240,185,11,0.1)", color: isProperty ? "#0ecb81" : "#
|
|
3066
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: isMobile ? "0.1rem 0.35rem" : "0.15rem 0.4rem", borderRadius: "2px", fontSize: isMobile ? "0.52rem" : "0.65rem", fontWeight: 500, backgroundColor: isProperty ? "rgba(14,203,129,0.1)" : "rgba(240,185,11,0.1)", color: isProperty ? "#0ecb81" : "#E6C87E" }, children: isProperty ? "Property Update" : "Market News" }),
|
|
3061
3067
|
sentimentInfo && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: isMobile ? "0.52rem" : "0.65rem", fontWeight: 600, color: sentimentInfo.color }, children: [
|
|
3062
3068
|
sentimentInfo.arrow ? `${sentimentInfo.arrow} ` : "",
|
|
3063
3069
|
sentimentInfo.label
|
|
@@ -4021,7 +4027,7 @@ var YourOrders = React5__namespace.forwardRef(
|
|
|
4021
4027
|
) : null
|
|
4022
4028
|
] }) : null
|
|
4023
4029
|
] }),
|
|
4024
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.9rem", fontWeight: 500, color: "#
|
|
4030
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.9rem", fontWeight: 500, color: "#E6C87E" }, children: formatCurrency2(value) }),
|
|
4025
4031
|
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.9rem", color: "rgba(255,255,255,0.92)" }, children: holding }),
|
|
4026
4032
|
showPropertyPercentColumn ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.9rem", color: "rgba(255,255,255,0.8)" }, children: formatPercent(propertyPercent, 3) }) : null,
|
|
4027
4033
|
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.9rem", color: "rgba(255,255,255,0.9)" }, children: formatCurrency2(avgPrice) }),
|
|
@@ -4140,7 +4146,7 @@ var YourOrders = React5__namespace.forwardRef(
|
|
|
4140
4146
|
left: 0,
|
|
4141
4147
|
right: 0,
|
|
4142
4148
|
height: "2px",
|
|
4143
|
-
background: "#
|
|
4149
|
+
background: "#E6C87E"
|
|
4144
4150
|
}
|
|
4145
4151
|
}
|
|
4146
4152
|
) : null
|
|
@@ -5000,7 +5006,7 @@ var StatusBadge = styled9__default.default.div`
|
|
|
5000
5006
|
align-items: center;
|
|
5001
5007
|
gap: 0.5rem;
|
|
5002
5008
|
background-color: ${({ $isLive }) => $isLive ? "rgba(20, 20, 20, 0.85)" : "rgba(240, 185, 11, 0.9)"};
|
|
5003
|
-
color: ${({ $isLive }) => $isLive ? "#
|
|
5009
|
+
color: ${({ $isLive }) => $isLive ? "#E6C87E" : "#000"};
|
|
5004
5010
|
padding: 0.5rem 1rem;
|
|
5005
5011
|
border-radius: 6px;
|
|
5006
5012
|
font-weight: 600;
|
|
@@ -5013,7 +5019,7 @@ var PulsingDot = styled9__default.default.span`
|
|
|
5013
5019
|
display: inline-block;
|
|
5014
5020
|
width: 8px;
|
|
5015
5021
|
height: 8px;
|
|
5016
|
-
background-color: #
|
|
5022
|
+
background-color: #E6C87E;
|
|
5017
5023
|
border-radius: 50%;
|
|
5018
5024
|
animation: heroStatusPulse 1.5s infinite;
|
|
5019
5025
|
|
|
@@ -5070,6 +5076,7 @@ var Header = ({
|
|
|
5070
5076
|
onSettingsClick,
|
|
5071
5077
|
showTradeTab = true,
|
|
5072
5078
|
portfolioSummary,
|
|
5079
|
+
fundsPending = false,
|
|
5073
5080
|
transparentOnTop = false
|
|
5074
5081
|
}) => {
|
|
5075
5082
|
const [headerBgOpacity, setHeaderBgOpacity] = React5.useState(transparentOnTop ? 0 : 1);
|
|
@@ -5094,6 +5101,27 @@ var Header = ({
|
|
|
5094
5101
|
return next;
|
|
5095
5102
|
});
|
|
5096
5103
|
}, []);
|
|
5104
|
+
const SIMULATE_FUNDS = false;
|
|
5105
|
+
const [simFundsPending, setSimFundsPending] = React5.useState(true);
|
|
5106
|
+
React5.useEffect(() => {
|
|
5107
|
+
return;
|
|
5108
|
+
}, [simFundsPending]);
|
|
5109
|
+
const showFundsPending = (fundsPending || SIMULATE_FUNDS) && isAuthenticated && isPortfolioBarVisible;
|
|
5110
|
+
const [fundsCountdown, setFundsCountdown] = React5.useState(10);
|
|
5111
|
+
React5.useEffect(() => {
|
|
5112
|
+
if (!showFundsPending) return;
|
|
5113
|
+
setFundsCountdown(10);
|
|
5114
|
+
const id = setInterval(() => {
|
|
5115
|
+
setFundsCountdown((n) => {
|
|
5116
|
+
if (n <= 1) {
|
|
5117
|
+
clearInterval(id);
|
|
5118
|
+
return 0;
|
|
5119
|
+
}
|
|
5120
|
+
return n - 1;
|
|
5121
|
+
});
|
|
5122
|
+
}, 1e3);
|
|
5123
|
+
return () => clearInterval(id);
|
|
5124
|
+
}, [showFundsPending]);
|
|
5097
5125
|
React5.useEffect(() => {
|
|
5098
5126
|
const handler = () => {
|
|
5099
5127
|
if (LoginPopupComponent) {
|
|
@@ -5506,18 +5534,16 @@ var Header = ({
|
|
|
5506
5534
|
] })
|
|
5507
5535
|
] })
|
|
5508
5536
|
] }),
|
|
5509
|
-
isMobileMenuOpen && /* @__PURE__ */ jsxRuntime.jsx(
|
|
5510
|
-
MobileOnlyButton,
|
|
5511
|
-
{
|
|
5512
|
-
onClick: () => setIsMobileMenuOpen(false),
|
|
5513
|
-
$isOpen: true,
|
|
5514
|
-
style: { position: "fixed", right: "1rem", top: "4rem" },
|
|
5515
|
-
"aria-label": "Close menu",
|
|
5516
|
-
children: "\u2715"
|
|
5517
|
-
}
|
|
5518
|
-
),
|
|
5519
5537
|
isAuthenticated ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [
|
|
5520
|
-
|
|
5538
|
+
showFundsPending && /* @__PURE__ */ jsxRuntime.jsxs(FundsPendingInline, { className: "loaf-funds-pending", children: [
|
|
5539
|
+
/* @__PURE__ */ jsxRuntime.jsx(FundsPendingText, { children: "Your test funds will arrive soon\u2026" }),
|
|
5540
|
+
fundsCountdown > 0 && /* @__PURE__ */ jsxRuntime.jsxs(FundsPendingCountdown, { children: [
|
|
5541
|
+
"~",
|
|
5542
|
+
fundsCountdown,
|
|
5543
|
+
"s"
|
|
5544
|
+
] })
|
|
5545
|
+
] }),
|
|
5546
|
+
!showFundsPending && portfolioSummary && isPortfolioBarVisible && (() => {
|
|
5521
5547
|
const fmtInline = (n) => n.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
|
5522
5548
|
const isPLPos = portfolioSummary.pnl >= 0;
|
|
5523
5549
|
return /* @__PURE__ */ jsxRuntime.jsxs(PortfolioInline, { className: "loaf-portfolio-inline", children: [
|
|
@@ -5539,7 +5565,7 @@ var Header = ({
|
|
|
5539
5565
|
/* @__PURE__ */ jsxRuntime.jsx(PBOperator, { children: "=" }),
|
|
5540
5566
|
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5541
5567
|
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "Portfolio" }),
|
|
5542
|
-
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { style: { color: "#
|
|
5568
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { style: { color: "#E6C87E", fontWeight: 700 }, children: [
|
|
5543
5569
|
"$",
|
|
5544
5570
|
fmtInline(portfolioSummary.portfolioValue)
|
|
5545
5571
|
] })
|
|
@@ -5646,84 +5672,93 @@ var Header = ({
|
|
|
5646
5672
|
)
|
|
5647
5673
|
] })
|
|
5648
5674
|
] }),
|
|
5649
|
-
|
|
5675
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5650
5676
|
MobileOnlyButton,
|
|
5651
5677
|
{
|
|
5652
|
-
onClick: () => setIsMobileMenuOpen(
|
|
5653
|
-
$isOpen:
|
|
5678
|
+
onClick: () => setIsMobileMenuOpen((v) => !v),
|
|
5679
|
+
$isOpen: isMobileMenuOpen,
|
|
5654
5680
|
className: "mobile-menu-button",
|
|
5655
|
-
"aria-label": "Open menu",
|
|
5656
|
-
children: "\u2630"
|
|
5681
|
+
"aria-label": isMobileMenuOpen ? "Close menu" : "Open menu",
|
|
5682
|
+
children: isMobileMenuOpen ? "\u2715" : "\u2630"
|
|
5657
5683
|
}
|
|
5658
5684
|
)
|
|
5659
5685
|
] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [
|
|
5660
5686
|
/* @__PURE__ */ jsxRuntime.jsx(Button2, { className: "signup", onClick: handleSignIn, children: "Connect" }),
|
|
5661
|
-
|
|
5687
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5662
5688
|
MobileOnlyButton,
|
|
5663
5689
|
{
|
|
5664
|
-
onClick: () => setIsMobileMenuOpen(
|
|
5665
|
-
$isOpen:
|
|
5690
|
+
onClick: () => setIsMobileMenuOpen((v) => !v),
|
|
5691
|
+
$isOpen: isMobileMenuOpen,
|
|
5666
5692
|
className: "mobile-menu-button",
|
|
5667
|
-
"aria-label": "Open menu",
|
|
5668
|
-
children: "\u2630"
|
|
5693
|
+
"aria-label": isMobileMenuOpen ? "Close menu" : "Open menu",
|
|
5694
|
+
children: isMobileMenuOpen ? "\u2715" : "\u2630"
|
|
5669
5695
|
}
|
|
5670
5696
|
)
|
|
5671
5697
|
] })
|
|
5672
5698
|
] }),
|
|
5673
5699
|
/* @__PURE__ */ jsxRuntime.jsx(HeaderSpacer, {}),
|
|
5674
|
-
isAuthenticated &&
|
|
5675
|
-
|
|
5676
|
-
|
|
5677
|
-
|
|
5678
|
-
|
|
5679
|
-
|
|
5680
|
-
|
|
5681
|
-
|
|
5682
|
-
|
|
5683
|
-
|
|
5684
|
-
|
|
5685
|
-
|
|
5686
|
-
/* @__PURE__ */ jsxRuntime.
|
|
5687
|
-
|
|
5688
|
-
|
|
5689
|
-
|
|
5690
|
-
|
|
5691
|
-
|
|
5692
|
-
|
|
5693
|
-
|
|
5694
|
-
|
|
5695
|
-
|
|
5696
|
-
|
|
5697
|
-
|
|
5698
|
-
|
|
5699
|
-
|
|
5700
|
-
|
|
5701
|
-
|
|
5702
|
-
|
|
5703
|
-
|
|
5704
|
-
|
|
5705
|
-
|
|
5706
|
-
|
|
5707
|
-
|
|
5708
|
-
|
|
5709
|
-
|
|
5710
|
-
|
|
5711
|
-
|
|
5712
|
-
|
|
5713
|
-
|
|
5714
|
-
|
|
5715
|
-
|
|
5716
|
-
|
|
5717
|
-
|
|
5718
|
-
|
|
5700
|
+
isAuthenticated && isPortfolioBarVisible && (showFundsPending || portfolioSummary) && /* @__PURE__ */ jsxRuntime.jsx(PortfolioBarContainer, { className: "loaf-portfolio-bar loaf-portfolio-bar-dropdown", children: /* @__PURE__ */ jsxRuntime.jsxs(PortfolioBarPill, { ref: portfolioPillRef, className: "loaf-portfolio-pill", children: [
|
|
5701
|
+
portfolioArrowLeft !== null && /* @__PURE__ */ jsxRuntime.jsx(PortfolioBarArrow, { className: "loaf-portfolio-arrow", style: { left: `${portfolioArrowLeft}px` } }),
|
|
5702
|
+
showFundsPending ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, className: "loaf-funds-pending", children: [
|
|
5703
|
+
/* @__PURE__ */ jsxRuntime.jsx(FundsPendingText, { children: "Your test funds will arrive soon\u2026" }),
|
|
5704
|
+
fundsCountdown > 0 && /* @__PURE__ */ jsxRuntime.jsxs(FundsPendingCountdown, { children: [
|
|
5705
|
+
"~",
|
|
5706
|
+
fundsCountdown,
|
|
5707
|
+
"s"
|
|
5708
|
+
] })
|
|
5709
|
+
] }) : portfolioSummary ? (() => {
|
|
5710
|
+
const fmt = (n) => n.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
|
5711
|
+
const isPLPositive = portfolioSummary.pnl >= 0;
|
|
5712
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
5713
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5714
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "Holdings" }),
|
|
5715
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { children: [
|
|
5716
|
+
"$",
|
|
5717
|
+
fmt(portfolioSummary.holdings)
|
|
5718
|
+
] })
|
|
5719
|
+
] }),
|
|
5720
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBOperator, { children: "+" }),
|
|
5721
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5722
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "Cash" }),
|
|
5723
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { children: [
|
|
5724
|
+
"$",
|
|
5725
|
+
fmt(portfolioSummary.cash)
|
|
5726
|
+
] })
|
|
5727
|
+
] }),
|
|
5728
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBOperator, { children: "=" }),
|
|
5729
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5730
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "Portfolio" }),
|
|
5731
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { style: { color: "#E6C87E", fontWeight: 700 }, children: [
|
|
5732
|
+
"$",
|
|
5733
|
+
fmt(portfolioSummary.portfolioValue)
|
|
5734
|
+
] })
|
|
5735
|
+
] }),
|
|
5736
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBDot, {}),
|
|
5737
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5738
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "Locked Balance" }),
|
|
5739
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { style: { color: "#B0B0B8" }, children: [
|
|
5740
|
+
"$",
|
|
5741
|
+
fmt(portfolioSummary.frozen ?? 0)
|
|
5742
|
+
] })
|
|
5743
|
+
] }),
|
|
5744
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBDot, {}),
|
|
5745
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetric, { children: [
|
|
5746
|
+
/* @__PURE__ */ jsxRuntime.jsx(PBMetricLabel, { children: "P&L" }),
|
|
5747
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PBMetricValue, { $positive: isPLPositive, $negative: !isPLPositive, children: [
|
|
5719
5748
|
isPLPositive ? "+" : "",
|
|
5720
|
-
|
|
5721
|
-
|
|
5749
|
+
"$",
|
|
5750
|
+
fmt(Math.abs(portfolioSummary.pnl)),
|
|
5751
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.6rem", marginLeft: "2px", opacity: 0.7 }, children: [
|
|
5752
|
+
"(",
|
|
5753
|
+
isPLPositive ? "+" : "",
|
|
5754
|
+
portfolioSummary.pnlPercent.toFixed(2),
|
|
5755
|
+
"%)"
|
|
5756
|
+
] })
|
|
5722
5757
|
] })
|
|
5723
5758
|
] })
|
|
5724
|
-
] })
|
|
5725
|
-
|
|
5726
|
-
})
|
|
5759
|
+
] });
|
|
5760
|
+
})() : null
|
|
5761
|
+
] }) }),
|
|
5727
5762
|
LoginPopupComponent && showLoginPopup && /* @__PURE__ */ jsxRuntime.jsx(
|
|
5728
5763
|
LoginPopupComponent,
|
|
5729
5764
|
{
|
|
@@ -5754,11 +5789,11 @@ var Overlay = styled9__default.default.div`
|
|
|
5754
5789
|
height: 100%;
|
|
5755
5790
|
background-color: rgba(0, 0, 0, 0.7);
|
|
5756
5791
|
backdrop-filter: blur(3px);
|
|
5757
|
-
z-index:
|
|
5792
|
+
z-index: 970;
|
|
5758
5793
|
`;
|
|
5759
5794
|
var MobileOnlyButton = styled9__default.default.button.attrs({ type: "button" })`
|
|
5760
5795
|
display: none;
|
|
5761
|
-
background-color: ${(props) => props.$isOpen ? "rgba(
|
|
5796
|
+
background-color: ${(props) => props.$isOpen ? "rgba(230, 200, 126, 0.2)" : "#E6C87E"};
|
|
5762
5797
|
color: ${(props) => props.$isOpen ? "#ffffff" : "#0b0e11"};
|
|
5763
5798
|
font-size: 18px;
|
|
5764
5799
|
font-weight: bold;
|
|
@@ -5769,18 +5804,18 @@ var MobileOnlyButton = styled9__default.default.button.attrs({ type: "button" })
|
|
|
5769
5804
|
margin-left: 0.5rem;
|
|
5770
5805
|
z-index: 1100;
|
|
5771
5806
|
border-radius: 6px;
|
|
5772
|
-
border: ${(props) => props.$isOpen ? "1px solid #
|
|
5807
|
+
border: ${(props) => props.$isOpen ? "1px solid #E6C87E" : "none"};
|
|
5773
5808
|
line-height: 1;
|
|
5774
5809
|
padding: 0;
|
|
5775
5810
|
cursor: pointer;
|
|
5776
5811
|
box-shadow: ${(props) => props.$isOpen ? "0 2px 8px rgba(0, 0, 0, 0.3)" : "none"};
|
|
5777
5812
|
|
|
5778
5813
|
&:hover {
|
|
5779
|
-
background-color: ${(props) => props.$isOpen ? "rgba(
|
|
5814
|
+
background-color: ${(props) => props.$isOpen ? "rgba(230, 200, 126, 0.3)" : "#F2D898"};
|
|
5780
5815
|
}
|
|
5781
5816
|
|
|
5782
5817
|
&:active {
|
|
5783
|
-
background-color: ${(props) => props.$isOpen ? "rgba(
|
|
5818
|
+
background-color: ${(props) => props.$isOpen ? "rgba(230, 200, 126, 0.4)" : "#F2D898"};
|
|
5784
5819
|
}
|
|
5785
5820
|
|
|
5786
5821
|
@media (max-width: 1024px) {
|
|
@@ -5795,7 +5830,7 @@ var HeaderContainer = styled9__default.default.header`
|
|
|
5795
5830
|
still get the horizontal padding — only the top falls back to 0 */
|
|
5796
5831
|
padding: 0 2rem;
|
|
5797
5832
|
padding-top: max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px));
|
|
5798
|
-
background-color: rgba(
|
|
5833
|
+
background-color: rgba(17, 17, 19, ${({ $bgOpacity }) => $bgOpacity ?? 1});
|
|
5799
5834
|
border-bottom: 1px solid rgba(35, 42, 50, ${({ $bgOpacity }) => $bgOpacity ?? 1});
|
|
5800
5835
|
transition: background-color 0.15s ease, border-bottom-color 0.15s ease;
|
|
5801
5836
|
position: fixed;
|
|
@@ -5818,7 +5853,7 @@ var HeaderContainer = styled9__default.default.header`
|
|
|
5818
5853
|
min-height: 46px;
|
|
5819
5854
|
padding: 0 0.75rem;
|
|
5820
5855
|
border-radius: 12px;
|
|
5821
|
-
background-color: rgba(
|
|
5856
|
+
background-color: rgba(17, 17, 19, ${({ $bgOpacity }) => Math.max(($bgOpacity ?? 1) * 0.92, 0)});
|
|
5822
5857
|
backdrop-filter: blur(${({ $bgOpacity }) => Math.round(($bgOpacity ?? 1) * 12)}px);
|
|
5823
5858
|
border: 1px solid rgba(255, 255, 255, ${({ $bgOpacity }) => ($bgOpacity ?? 1) * 0.08});
|
|
5824
5859
|
border-bottom: 1px solid rgba(255, 255, 255, ${({ $bgOpacity }) => ($bgOpacity ?? 1) * 0.08});
|
|
@@ -5886,19 +5921,25 @@ var Nav = styled9__default.default.nav`
|
|
|
5886
5921
|
|
|
5887
5922
|
@media (max-width: 1024px) {
|
|
5888
5923
|
position: fixed;
|
|
5889
|
-
|
|
5890
|
-
|
|
5891
|
-
|
|
5892
|
-
|
|
5893
|
-
|
|
5894
|
-
|
|
5895
|
-
|
|
5924
|
+
/* Opens just below the nav — and below the Private Beta banner when it's showing.
|
|
5925
|
+
The shell publishes --loaf-menu-top (banner-aware); the fallback is the bare
|
|
5926
|
+
nav bottom for standalone apps with no shell/banner. */
|
|
5927
|
+
top: var(--loaf-menu-top, calc(56px + max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px))));
|
|
5928
|
+
right: 0;
|
|
5929
|
+
left: 0;
|
|
5930
|
+
width: 100%;
|
|
5931
|
+
max-width: 100%;
|
|
5932
|
+
height: calc(100dvh - var(--loaf-menu-top, calc(56px + max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px)))));
|
|
5896
5933
|
background: linear-gradient(180deg, #0f1419 0%, #0a0e13 100%);
|
|
5897
|
-
z-index:
|
|
5898
|
-
|
|
5899
|
-
|
|
5934
|
+
z-index: 980;
|
|
5935
|
+
/* Gentle fade + slide-down instead of an abrupt slide-in. */
|
|
5936
|
+
opacity: ${(props) => props.$isOpen ? "1" : "0"};
|
|
5937
|
+
transform: ${(props) => props.$isOpen ? "translateY(0)" : "translateY(-14px)"};
|
|
5938
|
+
visibility: ${(props) => props.$isOpen ? "visible" : "hidden"};
|
|
5939
|
+
pointer-events: ${(props) => props.$isOpen ? "auto" : "none"};
|
|
5940
|
+
transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease;
|
|
5941
|
+
box-shadow: ${(props) => props.$isOpen ? "0 12px 30px rgba(0, 0, 0, 0.5)" : "none"};
|
|
5900
5942
|
overflow-y: auto;
|
|
5901
|
-
border-left: 1px solid rgba(255, 255, 255, 0.05);
|
|
5902
5943
|
|
|
5903
5944
|
.desktop-nav {
|
|
5904
5945
|
display: none;
|
|
@@ -5907,10 +5948,18 @@ var Nav = styled9__default.default.nav`
|
|
|
5907
5948
|
.mobile-menu-content {
|
|
5908
5949
|
display: flex;
|
|
5909
5950
|
flex-direction: column;
|
|
5910
|
-
|
|
5911
|
-
|
|
5951
|
+
align-items: center;
|
|
5952
|
+
justify-content: center;
|
|
5953
|
+
min-height: 100%;
|
|
5954
|
+
padding: 2rem 1.5rem 2.5rem;
|
|
5955
|
+
gap: 0.4rem;
|
|
5912
5956
|
}
|
|
5913
5957
|
}
|
|
5958
|
+
|
|
5959
|
+
@media (max-width: 768px) {
|
|
5960
|
+
top: var(--loaf-menu-top, calc(0.5rem + 46px + max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px))));
|
|
5961
|
+
height: calc(100dvh - var(--loaf-menu-top, calc(0.5rem + 46px + max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px)))));
|
|
5962
|
+
}
|
|
5914
5963
|
`;
|
|
5915
5964
|
var NavLink = styled9__default.default.a`
|
|
5916
5965
|
margin: 0 12px;
|
|
@@ -5932,7 +5981,7 @@ var NavLink = styled9__default.default.a`
|
|
|
5932
5981
|
|
|
5933
5982
|
&:hover,
|
|
5934
5983
|
&.active {
|
|
5935
|
-
color: #
|
|
5984
|
+
color: #E6C87E;
|
|
5936
5985
|
}
|
|
5937
5986
|
|
|
5938
5987
|
&.active::after {
|
|
@@ -5942,7 +5991,7 @@ var NavLink = styled9__default.default.a`
|
|
|
5942
5991
|
left: 0;
|
|
5943
5992
|
width: 100%;
|
|
5944
5993
|
height: 3px;
|
|
5945
|
-
background-color: #
|
|
5994
|
+
background-color: #E6C87E;
|
|
5946
5995
|
}
|
|
5947
5996
|
|
|
5948
5997
|
@media (max-width: 768px) {
|
|
@@ -5981,8 +6030,8 @@ var Button2 = styled9__default.default.button.attrs({ type: "button" })`
|
|
|
5981
6030
|
|
|
5982
6031
|
&.login {
|
|
5983
6032
|
background-color: transparent;
|
|
5984
|
-
border: 1px solid #
|
|
5985
|
-
color: #
|
|
6033
|
+
border: 1px solid #E6C87E;
|
|
6034
|
+
color: #E6C87E;
|
|
5986
6035
|
|
|
5987
6036
|
&:hover {
|
|
5988
6037
|
background-color: rgba(240, 185, 11, 0.1);
|
|
@@ -5994,12 +6043,12 @@ var Button2 = styled9__default.default.button.attrs({ type: "button" })`
|
|
|
5994
6043
|
}
|
|
5995
6044
|
|
|
5996
6045
|
&.signup {
|
|
5997
|
-
background-color: #
|
|
6046
|
+
background-color: #E6C87E;
|
|
5998
6047
|
color: #0b0e11;
|
|
5999
6048
|
border: none;
|
|
6000
6049
|
|
|
6001
6050
|
&:hover {
|
|
6002
|
-
background-color: #
|
|
6051
|
+
background-color: #F2D898;
|
|
6003
6052
|
}
|
|
6004
6053
|
}
|
|
6005
6054
|
|
|
@@ -6090,7 +6139,7 @@ var MenuItem = styled9__default.default.div`
|
|
|
6090
6139
|
border-bottom: none;
|
|
6091
6140
|
|
|
6092
6141
|
&:hover {
|
|
6093
|
-
color: #
|
|
6142
|
+
color: #E6C87E;
|
|
6094
6143
|
background-color: rgba(240, 185, 11, 0.08);
|
|
6095
6144
|
}
|
|
6096
6145
|
|
|
@@ -6099,13 +6148,7 @@ var MenuItem = styled9__default.default.div`
|
|
|
6099
6148
|
}
|
|
6100
6149
|
`;
|
|
6101
6150
|
var MobileMenuHeader = styled9__default.default.div`
|
|
6102
|
-
display:
|
|
6103
|
-
justify-content: flex-end;
|
|
6104
|
-
align-items: center;
|
|
6105
|
-
padding: 16px 20px;
|
|
6106
|
-
margin-top: 60px;
|
|
6107
|
-
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
|
6108
|
-
background: rgba(0, 0, 0, 0.2);
|
|
6151
|
+
display: none;
|
|
6109
6152
|
`;
|
|
6110
6153
|
var MobileMenuClose = styled9__default.default.button.attrs({ type: "button" })`
|
|
6111
6154
|
background: none;
|
|
@@ -6121,19 +6164,20 @@ var MobileMenuClose = styled9__default.default.button.attrs({ type: "button" })`
|
|
|
6121
6164
|
var MobileNavItem = styled9__default.default.div`
|
|
6122
6165
|
display: flex;
|
|
6123
6166
|
align-items: center;
|
|
6124
|
-
|
|
6125
|
-
|
|
6126
|
-
|
|
6167
|
+
justify-content: center;
|
|
6168
|
+
padding: 13px 20px;
|
|
6169
|
+
width: 100%;
|
|
6170
|
+
max-width: 320px;
|
|
6171
|
+
color: rgba(255, 255, 255, 0.88);
|
|
6172
|
+
font-size: 18px;
|
|
6127
6173
|
cursor: pointer;
|
|
6128
|
-
|
|
6129
|
-
|
|
6130
|
-
transition: all 0.2s ease;
|
|
6174
|
+
font-weight: 500;
|
|
6175
|
+
transition: color 0.2s ease;
|
|
6131
6176
|
letter-spacing: 0.2px;
|
|
6177
|
+
text-align: center;
|
|
6132
6178
|
|
|
6133
6179
|
&:hover {
|
|
6134
|
-
|
|
6135
|
-
color: #ffffff;
|
|
6136
|
-
padding-left: 24px;
|
|
6180
|
+
color: #E6C87E;
|
|
6137
6181
|
}
|
|
6138
6182
|
`;
|
|
6139
6183
|
var pbShimmer = styled9.keyframes`
|
|
@@ -6149,14 +6193,14 @@ var PortfolioEyeButton = styled9__default.default.button`
|
|
|
6149
6193
|
display: flex;
|
|
6150
6194
|
align-items: center;
|
|
6151
6195
|
justify-content: center;
|
|
6152
|
-
color: ${(p) => p.$active ? "#
|
|
6196
|
+
color: ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.5)"};
|
|
6153
6197
|
transition: all 0.2s ease;
|
|
6154
6198
|
margin-left: 6px;
|
|
6155
6199
|
margin-right: 10px;
|
|
6156
6200
|
|
|
6157
6201
|
&:hover {
|
|
6158
6202
|
background: rgba(212, 175, 55, 0.2);
|
|
6159
|
-
color: #
|
|
6203
|
+
color: #E6C87E;
|
|
6160
6204
|
}
|
|
6161
6205
|
|
|
6162
6206
|
@media (max-width: 768px) {
|
|
@@ -6288,6 +6332,35 @@ var PortfolioInline = styled9__default.default.div`
|
|
|
6288
6332
|
display: none;
|
|
6289
6333
|
}
|
|
6290
6334
|
`;
|
|
6335
|
+
var fundsPendingPulse = styled9.keyframes`
|
|
6336
|
+
0% { opacity: 0.25; }
|
|
6337
|
+
50% { opacity: 1; }
|
|
6338
|
+
100% { opacity: 0.25; }
|
|
6339
|
+
`;
|
|
6340
|
+
var FundsPendingInline = styled9__default.default.div`
|
|
6341
|
+
display: flex;
|
|
6342
|
+
align-items: center;
|
|
6343
|
+
gap: 0.5rem;
|
|
6344
|
+
margin-right: 0.75rem;
|
|
6345
|
+
|
|
6346
|
+
@media (max-width: 1800px) {
|
|
6347
|
+
display: none;
|
|
6348
|
+
}
|
|
6349
|
+
`;
|
|
6350
|
+
var FundsPendingText = styled9__default.default.span`
|
|
6351
|
+
font-size: 0.8rem;
|
|
6352
|
+
font-weight: 600;
|
|
6353
|
+
letter-spacing: 0.2px;
|
|
6354
|
+
color: #E6C87E;
|
|
6355
|
+
white-space: nowrap;
|
|
6356
|
+
animation: ${fundsPendingPulse} 1.8s ease-in-out infinite;
|
|
6357
|
+
`;
|
|
6358
|
+
var FundsPendingCountdown = styled9__default.default.span`
|
|
6359
|
+
font-size: 0.7rem;
|
|
6360
|
+
font-weight: 600;
|
|
6361
|
+
color: rgba(255, 255, 255, 0.55);
|
|
6362
|
+
font-variant-numeric: tabular-nums;
|
|
6363
|
+
`;
|
|
6291
6364
|
var PBMetric = styled9__default.default.div`
|
|
6292
6365
|
display: flex;
|
|
6293
6366
|
flex-direction: column;
|
|
@@ -6614,20 +6687,6 @@ var LoginPopup = ({
|
|
|
6614
6687
|
setLoading(false);
|
|
6615
6688
|
}
|
|
6616
6689
|
};
|
|
6617
|
-
const handlePasskeyLogin = async () => {
|
|
6618
|
-
if (!onPasskeyLogin) return;
|
|
6619
|
-
setError("");
|
|
6620
|
-
setLoading(true);
|
|
6621
|
-
try {
|
|
6622
|
-
await onPasskeyLogin();
|
|
6623
|
-
onClose();
|
|
6624
|
-
} catch (err) {
|
|
6625
|
-
const message = err instanceof Error ? err.message : "Passkey sign-in failed";
|
|
6626
|
-
setError(message);
|
|
6627
|
-
} finally {
|
|
6628
|
-
setLoading(false);
|
|
6629
|
-
}
|
|
6630
|
-
};
|
|
6631
6690
|
const handleEmailClick = (signUp = false) => {
|
|
6632
6691
|
setIsSignUp(signUp);
|
|
6633
6692
|
setView("email");
|
|
@@ -6643,13 +6702,9 @@ var LoginPopup = ({
|
|
|
6643
6702
|
setError("Email addresses with '+' are not allowed. Please use your base email address.");
|
|
6644
6703
|
return;
|
|
6645
6704
|
}
|
|
6646
|
-
if (isSignUp && !handle.trim()) {
|
|
6647
|
-
setError("Please claim a handle to continue");
|
|
6648
|
-
return;
|
|
6649
|
-
}
|
|
6650
6705
|
setLoading(true);
|
|
6651
6706
|
setError("");
|
|
6652
|
-
const normalizedHandle = isSignUp ? handle.trim() : void 0;
|
|
6707
|
+
const normalizedHandle = isSignUp && handle.trim() ? handle.trim() : void 0;
|
|
6653
6708
|
try {
|
|
6654
6709
|
const demoResult = await onDemoLogin?.(email, normalizedHandle ?? null);
|
|
6655
6710
|
if (demoResult && demoResult.success) {
|
|
@@ -6877,13 +6932,13 @@ var LoginPopup = ({
|
|
|
6877
6932
|
return /* @__PURE__ */ jsxRuntime.jsx(Overlay2, { onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(PopupContainer, { onClick: (event) => event.stopPropagation(), children: [
|
|
6878
6933
|
/* @__PURE__ */ jsxRuntime.jsx(CloseButton, { onClick: onClose, "aria-label": "Close login popup", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) }),
|
|
6879
6934
|
/* @__PURE__ */ jsxRuntime.jsxs(Title, { children: [
|
|
6880
|
-
/* @__PURE__ */ jsxRuntime.
|
|
6881
|
-
|
|
6882
|
-
"
|
|
6883
|
-
|
|
6884
|
-
|
|
6935
|
+
/* @__PURE__ */ jsxRuntime.jsxs(LogoContainer3, { children: [
|
|
6936
|
+
/* @__PURE__ */ jsxRuntime.jsx(LogoImage, { src: logoSrc, alt: logoAlt }),
|
|
6937
|
+
/* @__PURE__ */ jsxRuntime.jsx(LogoBeta, { children: "Private Beta" })
|
|
6938
|
+
] }),
|
|
6939
|
+
/* @__PURE__ */ jsxRuntime.jsx(TitleText, { children: "Welcome to Loaf" })
|
|
6885
6940
|
] }),
|
|
6886
|
-
/* @__PURE__ */ jsxRuntime.jsx(Subtitle, { children: "Sign in to claim
|
|
6941
|
+
/* @__PURE__ */ jsxRuntime.jsx(Subtitle, { children: "Sign in to claim 100k in test USD." }),
|
|
6887
6942
|
/* @__PURE__ */ jsxRuntime.jsxs(ButtonsContainer, { children: [
|
|
6888
6943
|
/* @__PURE__ */ jsxRuntime.jsxs(LoginButton, { onClick: () => handleEmailClick(false), children: [
|
|
6889
6944
|
/* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z" }) }),
|
|
@@ -6893,11 +6948,12 @@ var LoginPopup = ({
|
|
|
6893
6948
|
/* @__PURE__ */ jsxRuntime.jsxs(LoginButton, { onClick: handleWalletLogin, children: [
|
|
6894
6949
|
/* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 18v1c0 1.1-.9 2-2 2H5c-1.11 0-2-.9-2-2V5c0-1.1.89-2 2-2h14c1.1 0 2 .9 2 2v1h-9c-1.11 0-2 .9-2 2v8c0 1.1.89 2 2 2h9zm-9-2h10V8H12v8zm4-2.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z" }) }),
|
|
6895
6950
|
"Sign in with Wallet"
|
|
6896
|
-
] }),
|
|
6897
|
-
onPasskeyLogin && /* @__PURE__ */ jsxRuntime.jsxs(LoginButton, { onClick: handlePasskeyLogin, disabled: loading, children: [
|
|
6898
|
-
/* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C9.79 2 8 3.79 8 6v4H6c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2h-2V6c0-2.21-1.79-4-4-4zm-2 4c0-1.1.9-2 2-2s2 .9 2 2v4h-4V6zm2 9a2 2 0 100 4 2 2 0 000-4z" }) }),
|
|
6899
|
-
"Sign in with Passkey"
|
|
6900
6951
|
] })
|
|
6952
|
+
] }),
|
|
6953
|
+
/* @__PURE__ */ jsxRuntime.jsxs(SignUpPrompt, { children: [
|
|
6954
|
+
"New to Loaf?",
|
|
6955
|
+
" ",
|
|
6956
|
+
/* @__PURE__ */ jsxRuntime.jsx(SignUpLink, { type: "button", onClick: () => handleEmailClick(true), children: "Sign up" })
|
|
6901
6957
|
] })
|
|
6902
6958
|
] }) });
|
|
6903
6959
|
}
|
|
@@ -6912,7 +6968,7 @@ var LoginPopup = ({
|
|
|
6912
6968
|
/* @__PURE__ */ jsxRuntime.jsx(LogoContainer3, { children: /* @__PURE__ */ jsxRuntime.jsx(LogoImage, { src: logoSrc, alt: logoAlt }) }),
|
|
6913
6969
|
isSignUp ? "Sign up with Email" : "Sign in with Email"
|
|
6914
6970
|
] }),
|
|
6915
|
-
/* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSendCode, children: /* @__PURE__ */ jsxRuntime.jsxs(EmailFormContainer, { children: [
|
|
6971
|
+
/* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSendCode, style: { marginTop: "1.5rem" }, children: /* @__PURE__ */ jsxRuntime.jsxs(EmailFormContainer, { children: [
|
|
6916
6972
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6917
6973
|
EmailInput,
|
|
6918
6974
|
{
|
|
@@ -6927,13 +6983,13 @@ var LoginPopup = ({
|
|
|
6927
6983
|
EmailInput,
|
|
6928
6984
|
{
|
|
6929
6985
|
type: "text",
|
|
6930
|
-
placeholder: "Claim your
|
|
6986
|
+
placeholder: "Claim your username (Optional)",
|
|
6931
6987
|
value: handle,
|
|
6932
6988
|
onChange: (event) => setHandle(event.target.value),
|
|
6933
6989
|
style: { marginTop: "0.5rem" }
|
|
6934
6990
|
}
|
|
6935
6991
|
),
|
|
6936
|
-
/* @__PURE__ */ jsxRuntime.jsx(SubmitButton, { type: "submit", disabled: loading || !email
|
|
6992
|
+
/* @__PURE__ */ jsxRuntime.jsx(SubmitButton, { type: "submit", disabled: loading || !email, children: loading ? "Sending..." : "Continue" }),
|
|
6937
6993
|
error && /* @__PURE__ */ jsxRuntime.jsx(StatusMessage, { $error: true, children: error })
|
|
6938
6994
|
] }) }),
|
|
6939
6995
|
/* @__PURE__ */ jsxRuntime.jsx(InfoText, { children: "We'll send you a verification code to sign in securely." }),
|
|
@@ -7021,7 +7077,7 @@ var LoginPopup = ({
|
|
|
7021
7077
|
style: {
|
|
7022
7078
|
background: "none",
|
|
7023
7079
|
border: "none",
|
|
7024
|
-
color: "#
|
|
7080
|
+
color: "#E6C87E",
|
|
7025
7081
|
cursor: "pointer",
|
|
7026
7082
|
textDecoration: "underline"
|
|
7027
7083
|
},
|
|
@@ -7051,7 +7107,7 @@ var LoginPopup = ({
|
|
|
7051
7107
|
] })
|
|
7052
7108
|
] }),
|
|
7053
7109
|
!showKycWidget && /* @__PURE__ */ jsxRuntime.jsxs(KycLandingContainer, { children: [
|
|
7054
|
-
/* @__PURE__ */ jsxRuntime.jsx(KycLockIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#
|
|
7110
|
+
/* @__PURE__ */ jsxRuntime.jsx(KycLockIcon, { children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#E6C87E", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
7055
7111
|
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }),
|
|
7056
7112
|
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
|
|
7057
7113
|
] }) }),
|
|
@@ -7218,7 +7274,7 @@ var LoginPopup = ({
|
|
|
7218
7274
|
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })
|
|
7219
7275
|
] }) }),
|
|
7220
7276
|
/* @__PURE__ */ jsxRuntime.jsx(OnboardingHeading, { children: "Enter code to access Private Beta trading" }),
|
|
7221
|
-
/* @__PURE__ */ jsxRuntime.jsx(OnboardingSubtext, { style: { marginBottom: "1.5rem" }, children: "Enter
|
|
7277
|
+
/* @__PURE__ */ jsxRuntime.jsx(OnboardingSubtext, { style: { marginBottom: "1.5rem" }, children: "Enter code to trade 100k in USDC, or skip to continue." }),
|
|
7222
7278
|
/* @__PURE__ */ jsxRuntime.jsxs(EmailFormContainer, { style: { width: "100%", marginBottom: 0 }, children: [
|
|
7223
7279
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7224
7280
|
EmailInput,
|
|
@@ -7526,7 +7582,7 @@ var KycStartButton = styled9__default.default.button`
|
|
|
7526
7582
|
border-radius: 8px;
|
|
7527
7583
|
border: none;
|
|
7528
7584
|
cursor: pointer;
|
|
7529
|
-
background: #
|
|
7585
|
+
background: #E6C87E;
|
|
7530
7586
|
color: #0a0a0a;
|
|
7531
7587
|
font-weight: 600;
|
|
7532
7588
|
font-size: 0.9rem;
|
|
@@ -7595,18 +7651,17 @@ var Title = styled9__default.default.h2`
|
|
|
7595
7651
|
gap: 1rem;
|
|
7596
7652
|
`;
|
|
7597
7653
|
var TitleText = styled9__default.default.span`
|
|
7598
|
-
display: flex;
|
|
7599
|
-
flex-direction: column;
|
|
7600
|
-
align-items: center;
|
|
7601
|
-
gap: 0.35rem;
|
|
7602
7654
|
text-align: center;
|
|
7603
7655
|
line-height: 1.2;
|
|
7604
7656
|
`;
|
|
7605
|
-
var
|
|
7606
|
-
|
|
7607
|
-
font-
|
|
7608
|
-
|
|
7657
|
+
var LogoBeta = styled9__default.default.span`
|
|
7658
|
+
color: var(--color-accent, #E6C87E);
|
|
7659
|
+
font-size: 0.6rem;
|
|
7660
|
+
font-weight: 600;
|
|
7661
|
+
letter-spacing: 0.14em;
|
|
7662
|
+
text-transform: uppercase;
|
|
7609
7663
|
white-space: nowrap;
|
|
7664
|
+
padding-bottom: 0.95rem;
|
|
7610
7665
|
`;
|
|
7611
7666
|
var Subtitle = styled9__default.default.p`
|
|
7612
7667
|
font-size: 0.9rem;
|
|
@@ -7617,7 +7672,9 @@ var Subtitle = styled9__default.default.p`
|
|
|
7617
7672
|
`;
|
|
7618
7673
|
var LogoContainer3 = styled9__default.default.div`
|
|
7619
7674
|
display: flex;
|
|
7675
|
+
align-items: flex-end;
|
|
7620
7676
|
justify-content: center;
|
|
7677
|
+
gap: 0.45rem;
|
|
7621
7678
|
margin-bottom: 0.5rem;
|
|
7622
7679
|
`;
|
|
7623
7680
|
var LogoImage = styled9__default.default.img`
|
|
@@ -7629,6 +7686,25 @@ var ButtonsContainer = styled9__default.default.div`
|
|
|
7629
7686
|
gap: 1rem;
|
|
7630
7687
|
margin-bottom: 1.5rem;
|
|
7631
7688
|
`;
|
|
7689
|
+
var SignUpPrompt = styled9__default.default.div`
|
|
7690
|
+
text-align: center;
|
|
7691
|
+
font-size: 0.875rem;
|
|
7692
|
+
color: var(--color-text-secondary, #848e9c);
|
|
7693
|
+
margin-bottom: 0.5rem;
|
|
7694
|
+
`;
|
|
7695
|
+
var SignUpLink = styled9__default.default.button`
|
|
7696
|
+
background: none;
|
|
7697
|
+
border: none;
|
|
7698
|
+
padding: 0;
|
|
7699
|
+
font: inherit;
|
|
7700
|
+
color: var(--color-accent, #E6C87E);
|
|
7701
|
+
text-decoration: underline;
|
|
7702
|
+
cursor: pointer;
|
|
7703
|
+
|
|
7704
|
+
&:hover {
|
|
7705
|
+
opacity: 0.85;
|
|
7706
|
+
}
|
|
7707
|
+
`;
|
|
7632
7708
|
var LoginButton = styled9__default.default.button`
|
|
7633
7709
|
display: flex;
|
|
7634
7710
|
align-items: center;
|
|
@@ -7646,13 +7722,13 @@ var LoginButton = styled9__default.default.button`
|
|
|
7646
7722
|
|
|
7647
7723
|
&:hover {
|
|
7648
7724
|
background-color: rgba(230, 198, 86, 0.1);
|
|
7649
|
-
border-color: var(--color-accent, #
|
|
7725
|
+
border-color: var(--color-accent, #E6C87E);
|
|
7650
7726
|
}
|
|
7651
7727
|
|
|
7652
7728
|
svg {
|
|
7653
7729
|
width: 20px;
|
|
7654
7730
|
height: 20px;
|
|
7655
|
-
color: var(--color-accent, #
|
|
7731
|
+
color: var(--color-accent, #E6C87E);
|
|
7656
7732
|
}
|
|
7657
7733
|
`;
|
|
7658
7734
|
var InfoText = styled9__default.default.p`
|
|
@@ -7679,7 +7755,7 @@ var EmailInput = styled9__default.default.input`
|
|
|
7679
7755
|
|
|
7680
7756
|
&:focus {
|
|
7681
7757
|
outline: none;
|
|
7682
|
-
border-color: var(--color-accent, #
|
|
7758
|
+
border-color: var(--color-accent, #E6C87E);
|
|
7683
7759
|
}
|
|
7684
7760
|
|
|
7685
7761
|
&::placeholder {
|
|
@@ -7700,19 +7776,19 @@ var OTPInput = styled9__default.default.input`
|
|
|
7700
7776
|
background-color: var(--color-background-light, #1a1a1a);
|
|
7701
7777
|
border: 1px solid rgba(230, 198, 86, 0.2);
|
|
7702
7778
|
border-radius: var(--border-radius, 8px);
|
|
7703
|
-
color: var(--color-accent, #
|
|
7779
|
+
color: var(--color-accent, #E6C87E);
|
|
7704
7780
|
transition: all 0.2s ease;
|
|
7705
7781
|
|
|
7706
7782
|
&:focus {
|
|
7707
7783
|
outline: none;
|
|
7708
|
-
border-color: var(--color-accent, #
|
|
7784
|
+
border-color: var(--color-accent, #E6C87E);
|
|
7709
7785
|
box-shadow: 0 0 0 2px rgba(230, 198, 86, 0.2);
|
|
7710
7786
|
}
|
|
7711
7787
|
`;
|
|
7712
7788
|
var SubmitButton = styled9__default.default.button`
|
|
7713
7789
|
width: 100%;
|
|
7714
7790
|
padding: 0.85rem;
|
|
7715
|
-
background-color: var(--color-accent, #
|
|
7791
|
+
background-color: var(--color-accent, #E6C87E);
|
|
7716
7792
|
border: none;
|
|
7717
7793
|
border-radius: var(--border-radius, 8px);
|
|
7718
7794
|
color: var(--color-background, #0a0a0a);
|
|
@@ -7722,7 +7798,7 @@ var SubmitButton = styled9__default.default.button`
|
|
|
7722
7798
|
transition: all 0.2s ease;
|
|
7723
7799
|
|
|
7724
7800
|
&:hover:not(:disabled) {
|
|
7725
|
-
background-color: var(--color-accent-hover, #
|
|
7801
|
+
background-color: var(--color-accent-hover, #F2D898);
|
|
7726
7802
|
transform: translateY(-1px);
|
|
7727
7803
|
}
|
|
7728
7804
|
|
|
@@ -7744,7 +7820,7 @@ var BackButton = styled9__default.default.button`
|
|
|
7744
7820
|
margin-bottom: 1rem;
|
|
7745
7821
|
|
|
7746
7822
|
&:hover {
|
|
7747
|
-
color: var(--color-accent, #
|
|
7823
|
+
color: var(--color-accent, #E6C87E);
|
|
7748
7824
|
}
|
|
7749
7825
|
`;
|
|
7750
7826
|
var StatusMessage = styled9__default.default.p`
|
|
@@ -8065,7 +8141,7 @@ var SpinnerRing = styled9__default.default.div`
|
|
|
8065
8141
|
width: 40px;
|
|
8066
8142
|
height: 40px;
|
|
8067
8143
|
border: 3px solid rgba(230, 198, 86, 0.2);
|
|
8068
|
-
border-top-color: var(--color-accent, #
|
|
8144
|
+
border-top-color: var(--color-accent, #E6C87E);
|
|
8069
8145
|
border-radius: 50%;
|
|
8070
8146
|
animation: spin 0.8s linear infinite;
|
|
8071
8147
|
|
|
@@ -8098,7 +8174,7 @@ var FactLabel = styled9__default.default.div`
|
|
|
8098
8174
|
letter-spacing: 0.12em;
|
|
8099
8175
|
text-transform: uppercase;
|
|
8100
8176
|
font-weight: 700;
|
|
8101
|
-
color: var(--color-accent, #
|
|
8177
|
+
color: var(--color-accent, #E6C87E);
|
|
8102
8178
|
margin-bottom: 0.4rem;
|
|
8103
8179
|
`;
|
|
8104
8180
|
var FactText = styled9__default.default.p`
|
|
@@ -8555,6 +8631,18 @@ var PriceChange = styled9__default.default.span`
|
|
|
8555
8631
|
gap: 0.35rem;
|
|
8556
8632
|
color: ${(props) => props.$isPositive == null ? "var(--color-text-secondary, rgba(255, 255, 255, 0.6))" : props.$isPositive ? "var(--color-positive, #0ecb81)" : "var(--color-negative, #f6465d)"};
|
|
8557
8633
|
`;
|
|
8634
|
+
function useMaxWidth(maxWidth) {
|
|
8635
|
+
const [match, setMatch] = React5.useState(() => typeof window !== "undefined" && window.matchMedia(`(max-width: ${maxWidth}px)`).matches);
|
|
8636
|
+
React5.useEffect(() => {
|
|
8637
|
+
if (typeof window === "undefined") return;
|
|
8638
|
+
const mq = window.matchMedia(`(max-width: ${maxWidth}px)`);
|
|
8639
|
+
const onChange = () => setMatch(mq.matches);
|
|
8640
|
+
onChange();
|
|
8641
|
+
mq.addEventListener("change", onChange);
|
|
8642
|
+
return () => mq.removeEventListener("change", onChange);
|
|
8643
|
+
}, [maxWidth]);
|
|
8644
|
+
return match;
|
|
8645
|
+
}
|
|
8558
8646
|
function GalleryMapSection({
|
|
8559
8647
|
images = [],
|
|
8560
8648
|
categories = [],
|
|
@@ -8574,6 +8662,8 @@ function GalleryMapSection({
|
|
|
8574
8662
|
const [showVideo, setShowVideo] = React5.useState(false);
|
|
8575
8663
|
const [autoPlaying, setAutoPlaying] = React5.useState(autoPlay);
|
|
8576
8664
|
const [showFullMap, setShowFullMap] = React5.useState(false);
|
|
8665
|
+
const [showFullVideo, setShowFullVideo] = React5.useState(false);
|
|
8666
|
+
const isMobile = useMaxWidth(768);
|
|
8577
8667
|
const resolvedMapUrl = mapUrl ?? (tokenName ? `/map/${tokenName}?embed=true&zoom=14&hideOthers=true` : "about:blank");
|
|
8578
8668
|
React5.useEffect(() => {
|
|
8579
8669
|
if (!autoPlaying || images.length <= 1) return;
|
|
@@ -8604,62 +8694,67 @@ function GalleryMapSection({
|
|
|
8604
8694
|
/* @__PURE__ */ jsxRuntime.jsx(bi.BiImages, {}),
|
|
8605
8695
|
" Property Gallery"
|
|
8606
8696
|
] }),
|
|
8607
|
-
/* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: () =>
|
|
8697
|
+
isMobile ? videoUrl && /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: () => setShowFullVideo(true), children: [
|
|
8698
|
+
/* @__PURE__ */ jsxRuntime.jsx(bi.BiVideo, { size: 15 }),
|
|
8699
|
+
"Video"
|
|
8700
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: () => onPhotoClick?.(carouselIndex), children: [
|
|
8608
8701
|
/* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", style: { width: 14, height: 14 }, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3" }) }),
|
|
8609
8702
|
"Full View"
|
|
8610
8703
|
] })
|
|
8611
8704
|
] }),
|
|
8612
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
8613
|
-
|
|
8614
|
-
|
|
8615
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8616
|
-
|
|
8617
|
-
/* @__PURE__ */ jsxRuntime.
|
|
8618
|
-
|
|
8705
|
+
isMobile ? /* @__PURE__ */ jsxRuntime.jsx(StackedGallery, { images, onPhotoClick }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
8706
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Carousel, { children: [
|
|
8707
|
+
showVideo && videoUrl && /* @__PURE__ */ jsxRuntime.jsx(VideoOverlay, { children: /* @__PURE__ */ jsxRuntime.jsx("video", { autoPlay: true, loop: true, playsInline: true, controls: true, style: { width: "100%", height: "100%", objectFit: "cover", borderRadius: 8 }, children: /* @__PURE__ */ jsxRuntime.jsx("source", { src: videoUrl, type: "video/mp4" }) }) }),
|
|
8708
|
+
/* @__PURE__ */ jsxRuntime.jsx(Track, { style: { transform: `translateX(-${carouselIndex * 100}%)` }, children: images.map((img, idx) => /* @__PURE__ */ jsxRuntime.jsxs(Slide, { onClick: () => onPhotoClick?.(idx), children: [
|
|
8709
|
+
/* @__PURE__ */ jsxRuntime.jsx("img", { src: img.src, alt: img.title }),
|
|
8710
|
+
/* @__PURE__ */ jsxRuntime.jsxs(SlideCaption, { children: [
|
|
8711
|
+
/* @__PURE__ */ jsxRuntime.jsx("h4", { children: img.title }),
|
|
8712
|
+
img.subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { children: img.subtitle })
|
|
8713
|
+
] })
|
|
8714
|
+
] }, idx)) }),
|
|
8715
|
+
!showVideo && images.length > 1 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
8716
|
+
/* @__PURE__ */ jsxRuntime.jsx(CarouselButton, { className: "prev", onClick: goPrev, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 18l-6-6 6-6" }) }) }),
|
|
8717
|
+
/* @__PURE__ */ jsxRuntime.jsx(CarouselButton, { className: "next", onClick: goNext, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18l6-6-6-6" }) }) })
|
|
8619
8718
|
] })
|
|
8620
|
-
] }
|
|
8621
|
-
|
|
8622
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8623
|
-
|
|
8624
|
-
|
|
8625
|
-
|
|
8626
|
-
|
|
8627
|
-
|
|
8628
|
-
|
|
8629
|
-
|
|
8630
|
-
|
|
8631
|
-
|
|
8632
|
-
|
|
8633
|
-
|
|
8634
|
-
|
|
8635
|
-
|
|
8636
|
-
|
|
8637
|
-
|
|
8638
|
-
|
|
8639
|
-
|
|
8640
|
-
|
|
8641
|
-
|
|
8642
|
-
|
|
8643
|
-
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "1" }),
|
|
8644
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "2", y1: "10", x2: "22", y2: "10" }),
|
|
8645
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "10", y1: "2", x2: "10", y2: "22" })
|
|
8719
|
+
] }),
|
|
8720
|
+
/* @__PURE__ */ jsxRuntime.jsxs(ThumbStrip, { children: [
|
|
8721
|
+
/* @__PURE__ */ jsxRuntime.jsx(ThumbScroll, { children: images.filter((img) => img.category !== "Floorplan").map((img) => {
|
|
8722
|
+
const actualIndex = images.indexOf(img);
|
|
8723
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Thumbnail2, { "data-active": !showVideo && carouselIndex === actualIndex, onClick: () => {
|
|
8724
|
+
stopAutoPlay();
|
|
8725
|
+
setShowVideo(false);
|
|
8726
|
+
setCarouselIndex(actualIndex);
|
|
8727
|
+
}, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: img.src, alt: img.title }) }, actualIndex);
|
|
8728
|
+
}) }),
|
|
8729
|
+
/* @__PURE__ */ jsxRuntime.jsx(ThumbDivider, {}),
|
|
8730
|
+
/* @__PURE__ */ jsxRuntime.jsxs(FixedButtons, { children: [
|
|
8731
|
+
floorplanIndex !== -1 && /* @__PURE__ */ jsxRuntime.jsxs(FixedBtn, { $active: isFloorplan, onClick: () => {
|
|
8732
|
+
stopAutoPlay();
|
|
8733
|
+
setShowVideo(false);
|
|
8734
|
+
setCarouselIndex(floorplanIndex);
|
|
8735
|
+
}, children: [
|
|
8736
|
+
/* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
8737
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "2", width: "20", height: "20", rx: "1" }),
|
|
8738
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "2", y1: "10", x2: "22", y2: "10" }),
|
|
8739
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "10", y1: "2", x2: "10", y2: "22" })
|
|
8740
|
+
] }),
|
|
8741
|
+
"Floor Plan"
|
|
8646
8742
|
] }),
|
|
8647
|
-
|
|
8648
|
-
|
|
8649
|
-
|
|
8650
|
-
|
|
8651
|
-
" Video"
|
|
8743
|
+
videoUrl && /* @__PURE__ */ jsxRuntime.jsxs(FixedBtn, { $active: showVideo, onClick: () => setShowVideo((p) => !p), children: [
|
|
8744
|
+
/* @__PURE__ */ jsxRuntime.jsx(bi.BiVideo, { size: 16 }),
|
|
8745
|
+
" Video"
|
|
8746
|
+
] })
|
|
8652
8747
|
] })
|
|
8653
|
-
] })
|
|
8654
|
-
|
|
8655
|
-
|
|
8656
|
-
|
|
8657
|
-
|
|
8658
|
-
|
|
8659
|
-
|
|
8660
|
-
|
|
8661
|
-
}
|
|
8662
|
-
|
|
8748
|
+
] }),
|
|
8749
|
+
filteredCategories.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(CategoryRow, { children: filteredCategories.map((cat, i) => {
|
|
8750
|
+
const isActive = carouselIndex >= cat.startIndex && (i === filteredCategories.length - 1 || carouselIndex < filteredCategories[i + 1].startIndex);
|
|
8751
|
+
return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", "data-active": isActive, onClick: () => {
|
|
8752
|
+
stopAutoPlay();
|
|
8753
|
+
setShowVideo(false);
|
|
8754
|
+
setCarouselIndex(cat.startIndex);
|
|
8755
|
+
}, children: cat.name }, cat.name);
|
|
8756
|
+
}) })
|
|
8757
|
+
] })
|
|
8663
8758
|
] }),
|
|
8664
8759
|
featuresSlot,
|
|
8665
8760
|
!hideMap && /* @__PURE__ */ jsxRuntime.jsxs(MapPanel, { children: [
|
|
@@ -8719,7 +8814,130 @@ function GalleryMapSection({
|
|
|
8719
8814
|
] }),
|
|
8720
8815
|
/* @__PURE__ */ jsxRuntime.jsx(SuburbDesc, { children: "One of Sydney's most prestigious harbourside suburbs, consistently ranked among Australia's highest-value residential markets. Strong capital growth driven by limited supply, heritage conservation overlays, and international buyer demand." })
|
|
8721
8816
|
] }),
|
|
8722
|
-
showFullMap && !hideMap && /* @__PURE__ */ jsxRuntime.jsx(FullMapPopup, { onClose: () => setShowFullMap(false), mapUrl: resolvedMapUrl })
|
|
8817
|
+
showFullMap && !hideMap && /* @__PURE__ */ jsxRuntime.jsx(FullMapPopup, { onClose: () => setShowFullMap(false), mapUrl: resolvedMapUrl }),
|
|
8818
|
+
showFullVideo && videoUrl && /* @__PURE__ */ jsxRuntime.jsxs(FullVideoOverlay, { onClick: () => setShowFullVideo(false), children: [
|
|
8819
|
+
/* @__PURE__ */ jsxRuntime.jsx(FullVideoClose, { onClick: () => setShowFullVideo(false), "aria-label": "Close video", children: "\u2715" }),
|
|
8820
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8821
|
+
"video",
|
|
8822
|
+
{
|
|
8823
|
+
src: videoUrl,
|
|
8824
|
+
autoPlay: true,
|
|
8825
|
+
controls: true,
|
|
8826
|
+
playsInline: true,
|
|
8827
|
+
controlsList: "nodownload",
|
|
8828
|
+
disablePictureInPicture: true,
|
|
8829
|
+
onClick: (e) => e.stopPropagation(),
|
|
8830
|
+
onContextMenu: (e) => e.preventDefault()
|
|
8831
|
+
}
|
|
8832
|
+
)
|
|
8833
|
+
] })
|
|
8834
|
+
] });
|
|
8835
|
+
}
|
|
8836
|
+
function StackedGallery({ images, onPhotoClick }) {
|
|
8837
|
+
const [expanded, setExpanded] = React5.useState(false);
|
|
8838
|
+
const [cardH, setCardH] = React5.useState(200);
|
|
8839
|
+
const wrapRef = React5.useRef(null);
|
|
8840
|
+
React5.useEffect(() => {
|
|
8841
|
+
const el = wrapRef.current;
|
|
8842
|
+
if (!el) return;
|
|
8843
|
+
const measure = () => {
|
|
8844
|
+
const w = el.clientWidth;
|
|
8845
|
+
if (w > 0) setCardH(Math.round(w * 9 / 16));
|
|
8846
|
+
};
|
|
8847
|
+
measure();
|
|
8848
|
+
const ro = new ResizeObserver(measure);
|
|
8849
|
+
ro.observe(el);
|
|
8850
|
+
return () => ro.disconnect();
|
|
8851
|
+
}, []);
|
|
8852
|
+
React5.useEffect(() => {
|
|
8853
|
+
const el = wrapRef.current;
|
|
8854
|
+
if (!el) return;
|
|
8855
|
+
const update = () => {
|
|
8856
|
+
const nav = document.getElementById("loaf-header");
|
|
8857
|
+
let topPx = nav ? nav.getBoundingClientRect().bottom : 56;
|
|
8858
|
+
const header = document.querySelector(".trade-top-sticky");
|
|
8859
|
+
if (header) {
|
|
8860
|
+
const b = header.getBoundingClientRect().bottom;
|
|
8861
|
+
if (b > 0 && b < window.innerHeight * 0.5) topPx = Math.max(topPx, b);
|
|
8862
|
+
}
|
|
8863
|
+
el.style.setProperty("--gallery-showless-top", `${Math.round(topPx) + 12}px`);
|
|
8864
|
+
};
|
|
8865
|
+
update();
|
|
8866
|
+
window.addEventListener("scroll", update, { passive: true });
|
|
8867
|
+
window.addEventListener("resize", update);
|
|
8868
|
+
return () => {
|
|
8869
|
+
window.removeEventListener("scroll", update);
|
|
8870
|
+
window.removeEventListener("resize", update);
|
|
8871
|
+
};
|
|
8872
|
+
}, []);
|
|
8873
|
+
const collapse = () => {
|
|
8874
|
+
setExpanded(false);
|
|
8875
|
+
requestAnimationFrame(() => {
|
|
8876
|
+
const wrap = wrapRef.current;
|
|
8877
|
+
const panel = wrap?.parentElement;
|
|
8878
|
+
if (!panel) return;
|
|
8879
|
+
const nav = document.getElementById("loaf-header");
|
|
8880
|
+
let offset = nav ? nav.getBoundingClientRect().bottom : 56;
|
|
8881
|
+
const header = document.querySelector(".trade-top-sticky");
|
|
8882
|
+
if (header) {
|
|
8883
|
+
const b = header.getBoundingClientRect().bottom;
|
|
8884
|
+
if (b > 0 && b < window.innerHeight * 0.5) offset = Math.max(offset, b);
|
|
8885
|
+
}
|
|
8886
|
+
const top = panel.getBoundingClientRect().top + window.scrollY - offset - 64;
|
|
8887
|
+
window.scrollTo({ top: Math.max(0, top), behavior: "auto" });
|
|
8888
|
+
});
|
|
8889
|
+
};
|
|
8890
|
+
const n = images.length;
|
|
8891
|
+
const PEEK = 12;
|
|
8892
|
+
const INSET = 10;
|
|
8893
|
+
const GAP = 14;
|
|
8894
|
+
const MAX_BEHIND = 2;
|
|
8895
|
+
const collapsedHeight = cardH + MAX_BEHIND * PEEK;
|
|
8896
|
+
const expandedHeight = n * cardH + (n - 1) * GAP;
|
|
8897
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(StackWrap, { ref: wrapRef, children: [
|
|
8898
|
+
expanded && /* @__PURE__ */ jsxRuntime.jsxs(ShowLessBtn, { type: "button", onClick: collapse, children: [
|
|
8899
|
+
/* @__PURE__ */ jsxRuntime.jsx(bi.BiChevronUp, { size: 16 }),
|
|
8900
|
+
" Show less"
|
|
8901
|
+
] }),
|
|
8902
|
+
/* @__PURE__ */ jsxRuntime.jsx(StackViewport, { style: { height: (expanded ? expandedHeight : collapsedHeight) || void 0 }, children: images.map((img, i) => {
|
|
8903
|
+
const depth = Math.min(i, MAX_BEHIND);
|
|
8904
|
+
const top = expanded ? i * (cardH + GAP) : depth * PEEK;
|
|
8905
|
+
const side = expanded ? 0 : depth * INSET;
|
|
8906
|
+
const hidden = !expanded && i > MAX_BEHIND;
|
|
8907
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
8908
|
+
StackCard,
|
|
8909
|
+
{
|
|
8910
|
+
style: {
|
|
8911
|
+
top,
|
|
8912
|
+
left: side,
|
|
8913
|
+
right: side,
|
|
8914
|
+
height: cardH,
|
|
8915
|
+
zIndex: expanded ? 1 : n - i,
|
|
8916
|
+
opacity: hidden ? 0 : 1,
|
|
8917
|
+
pointerEvents: hidden ? "none" : "auto"
|
|
8918
|
+
},
|
|
8919
|
+
onClick: () => {
|
|
8920
|
+
if (!expanded) setExpanded(true);
|
|
8921
|
+
else onPhotoClick?.(i);
|
|
8922
|
+
},
|
|
8923
|
+
children: [
|
|
8924
|
+
/* @__PURE__ */ jsxRuntime.jsx("img", { src: img.src, alt: img.title, draggable: false }),
|
|
8925
|
+
/* @__PURE__ */ jsxRuntime.jsxs(StackCaption, { children: [
|
|
8926
|
+
/* @__PURE__ */ jsxRuntime.jsx("h4", { children: img.title }),
|
|
8927
|
+
img.subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { children: img.subtitle })
|
|
8928
|
+
] }),
|
|
8929
|
+
!expanded && i === 0 && n > 1 && /* @__PURE__ */ jsxRuntime.jsxs(StackBadge, { children: [
|
|
8930
|
+
/* @__PURE__ */ jsxRuntime.jsx(bi.BiImages, { size: 13 }),
|
|
8931
|
+
" ",
|
|
8932
|
+
n,
|
|
8933
|
+
" photos ",
|
|
8934
|
+
/* @__PURE__ */ jsxRuntime.jsx(bi.BiChevronDown, { size: 14 })
|
|
8935
|
+
] })
|
|
8936
|
+
]
|
|
8937
|
+
},
|
|
8938
|
+
i
|
|
8939
|
+
);
|
|
8940
|
+
}) })
|
|
8723
8941
|
] });
|
|
8724
8942
|
}
|
|
8725
8943
|
function FullMapPopup({ onClose, mapUrl }) {
|
|
@@ -8783,6 +9001,9 @@ var Row = styled9__default.default.div`
|
|
|
8783
9001
|
overflow: hidden;
|
|
8784
9002
|
box-sizing: border-box;
|
|
8785
9003
|
width: 100%;
|
|
9004
|
+
/* Mobile uses the stacked gallery whose "Show less" is position:sticky — overflow:hidden
|
|
9005
|
+
on any ancestor breaks sticky, so open it up here (no carousel to clip on mobile). */
|
|
9006
|
+
@media (max-width: 768px) { overflow: visible; }
|
|
8786
9007
|
`;
|
|
8787
9008
|
var PanelBase = styled9__default.default.div`
|
|
8788
9009
|
background: #111111;
|
|
@@ -8801,7 +9022,7 @@ var PanelHeader = styled9__default.default.div`
|
|
|
8801
9022
|
border-bottom: 1px solid rgba(255,255,255,0.1);
|
|
8802
9023
|
h3 { margin: 0; font-size: 1rem; font-weight: 600; display: flex; align-items: center; gap: 0.5rem; }
|
|
8803
9024
|
button {
|
|
8804
|
-
background: transparent; border: 1px solid #
|
|
9025
|
+
background: transparent; border: 1px solid #E6C87E; color: #E6C87E;
|
|
8805
9026
|
padding: 0.35rem 0.75rem; border-radius: 4px; font-size: 0.75rem;
|
|
8806
9027
|
cursor: pointer; display: flex; align-items: center; gap: 0.35rem;
|
|
8807
9028
|
}
|
|
@@ -8809,6 +9030,90 @@ var PanelHeader = styled9__default.default.div`
|
|
|
8809
9030
|
`;
|
|
8810
9031
|
var GalleryPanel = styled9__default.default(PanelBase)`
|
|
8811
9032
|
min-width: 0; overflow: hidden;
|
|
9033
|
+
/* Allow the sticky "Show less" to pin against the viewport on mobile. */
|
|
9034
|
+
@media (max-width: 768px) { overflow: visible; }
|
|
9035
|
+
`;
|
|
9036
|
+
var StackWrap = styled9__default.default.div`
|
|
9037
|
+
position: relative;
|
|
9038
|
+
width: 100%;
|
|
9039
|
+
`;
|
|
9040
|
+
var StackViewport = styled9__default.default.div`
|
|
9041
|
+
position: relative;
|
|
9042
|
+
width: 100%;
|
|
9043
|
+
transition: height 0.45s cubic-bezier(0.22, 1, 0.36, 1);
|
|
9044
|
+
`;
|
|
9045
|
+
var StackCard = styled9__default.default.div`
|
|
9046
|
+
position: absolute;
|
|
9047
|
+
border-radius: 14px;
|
|
9048
|
+
overflow: hidden;
|
|
9049
|
+
cursor: pointer;
|
|
9050
|
+
background: #0c0c0c;
|
|
9051
|
+
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
|
|
9052
|
+
border: 1px solid rgba(255, 255, 255, 0.08);
|
|
9053
|
+
transition: top 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
9054
|
+
left 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
9055
|
+
right 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
9056
|
+
opacity 0.3s ease;
|
|
9057
|
+
img {
|
|
9058
|
+
width: 100%;
|
|
9059
|
+
height: 100%;
|
|
9060
|
+
object-fit: cover;
|
|
9061
|
+
display: block;
|
|
9062
|
+
user-select: none;
|
|
9063
|
+
-webkit-user-drag: none;
|
|
9064
|
+
}
|
|
9065
|
+
`;
|
|
9066
|
+
var StackCaption = styled9__default.default.div`
|
|
9067
|
+
position: absolute;
|
|
9068
|
+
bottom: 0;
|
|
9069
|
+
left: 0;
|
|
9070
|
+
right: 0;
|
|
9071
|
+
padding: 0.9rem 1rem;
|
|
9072
|
+
background: linear-gradient(to top, rgba(0, 0, 0, 0.82), transparent);
|
|
9073
|
+
pointer-events: none;
|
|
9074
|
+
h4 { margin: 0; font-size: 0.92rem; font-weight: 600; color: #fff; }
|
|
9075
|
+
p { margin: 0.2rem 0 0; font-size: 0.72rem; color: rgba(255, 255, 255, 0.72); }
|
|
9076
|
+
`;
|
|
9077
|
+
var StackBadge = styled9__default.default.div`
|
|
9078
|
+
position: absolute;
|
|
9079
|
+
top: 0.65rem;
|
|
9080
|
+
right: 0.65rem;
|
|
9081
|
+
display: flex;
|
|
9082
|
+
align-items: center;
|
|
9083
|
+
gap: 0.3rem;
|
|
9084
|
+
padding: 0.32rem 0.6rem;
|
|
9085
|
+
border-radius: 999px;
|
|
9086
|
+
background: rgba(0, 0, 0, 0.55);
|
|
9087
|
+
backdrop-filter: blur(6px);
|
|
9088
|
+
border: 1px solid rgba(255, 255, 255, 0.16);
|
|
9089
|
+
color: #fff;
|
|
9090
|
+
font-size: 0.72rem;
|
|
9091
|
+
font-weight: 600;
|
|
9092
|
+
`;
|
|
9093
|
+
var ShowLessBtn = styled9__default.default.button`
|
|
9094
|
+
/* Starts above the first image (right-aligned). As you scroll it pins just below the
|
|
9095
|
+
page's tab bar (--gallery-showless-top, measured live) and rides along; sticky
|
|
9096
|
+
auto-releases at the bottom of the gallery, so it stops at the last image's bottom-right. */
|
|
9097
|
+
position: sticky;
|
|
9098
|
+
top: var(--gallery-showless-top, 116px);
|
|
9099
|
+
z-index: 9;
|
|
9100
|
+
display: flex;
|
|
9101
|
+
width: fit-content;
|
|
9102
|
+
align-items: center;
|
|
9103
|
+
justify-content: center;
|
|
9104
|
+
gap: 0.3rem;
|
|
9105
|
+
margin: 0 0 0.75rem auto;
|
|
9106
|
+
padding: 0.45rem 1rem;
|
|
9107
|
+
border-radius: 999px;
|
|
9108
|
+
background: rgba(20, 20, 24, 0.92);
|
|
9109
|
+
backdrop-filter: blur(8px);
|
|
9110
|
+
border: 1px solid rgba(255, 255, 255, 0.18);
|
|
9111
|
+
color: #fff;
|
|
9112
|
+
font-size: 0.78rem;
|
|
9113
|
+
font-weight: 600;
|
|
9114
|
+
cursor: pointer;
|
|
9115
|
+
transition: background 0.15s ease, border-color 0.15s ease;
|
|
9116
|
+
&:hover { background: rgba(40, 40, 46, 0.95); border-color: #E6C87E; color: #E6C87E; }
|
|
8812
9117
|
`;
|
|
8813
9118
|
var Carousel = styled9__default.default.div`
|
|
8814
9119
|
position: relative; width: 100%; overflow: hidden; border-radius: 8px;
|
|
@@ -8855,7 +9160,7 @@ var Thumbnail2 = styled9__default.default.div`
|
|
|
8855
9160
|
min-width: 60px; height: 45px; border-radius: 4px; overflow: hidden;
|
|
8856
9161
|
cursor: pointer; border: 2px solid transparent; opacity: 0.6;
|
|
8857
9162
|
transition: all 0.2s ease; flex-shrink: 0;
|
|
8858
|
-
&[data-active='true'] { border-color: #
|
|
9163
|
+
&[data-active='true'] { border-color: #E6C87E; opacity: 1; }
|
|
8859
9164
|
img { width: 100%; height: 100%; object-fit: cover; }
|
|
8860
9165
|
`;
|
|
8861
9166
|
var ThumbDivider = styled9__default.default.div`
|
|
@@ -8869,9 +9174,9 @@ var FixedBtn = styled9__default.default.button`
|
|
|
8869
9174
|
height: 45px; padding: 0 0.75rem; border-radius: 4px;
|
|
8870
9175
|
display: flex; align-items: center; justify-content: center; gap: 0.4rem;
|
|
8871
9176
|
cursor: pointer; transition: all 0.2s ease;
|
|
8872
|
-
border: 1px solid ${(p) => p.$active ? "#
|
|
9177
|
+
border: 1px solid ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.25)"};
|
|
8873
9178
|
background: ${(p) => p.$active ? "rgba(212,175,55,0.15)" : "rgba(255,255,255,0.06)"};
|
|
8874
|
-
color: ${(p) => p.$active ? "#
|
|
9179
|
+
color: ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.7)"};
|
|
8875
9180
|
font-size: 0.75rem; font-weight: 500; letter-spacing: 0.02em; white-space: nowrap;
|
|
8876
9181
|
`;
|
|
8877
9182
|
var CategoryRow = styled9__default.default.div`
|
|
@@ -8884,7 +9189,7 @@ var CategoryRow = styled9__default.default.div`
|
|
|
8884
9189
|
font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease;
|
|
8885
9190
|
flex-shrink: 0; white-space: nowrap;
|
|
8886
9191
|
}
|
|
8887
|
-
button[data-active='true'] { background: rgba(212,175,55,0.2); border-color: #
|
|
9192
|
+
button[data-active='true'] { background: rgba(212,175,55,0.2); border-color: #E6C87E; color: #E6C87E; }
|
|
8888
9193
|
`;
|
|
8889
9194
|
var MapPanel = styled9__default.default(PanelBase)`
|
|
8890
9195
|
min-height: 350px; padding: 1.5rem;
|
|
@@ -8901,7 +9206,7 @@ var SuburbProfilePanel = styled9__default.default(PanelBase)`
|
|
|
8901
9206
|
`;
|
|
8902
9207
|
var SuburbProfileTitle = styled9__default.default.div`
|
|
8903
9208
|
font-size: 0.65rem;
|
|
8904
|
-
color: #
|
|
9209
|
+
color: #E6C87E;
|
|
8905
9210
|
text-transform: uppercase;
|
|
8906
9211
|
letter-spacing: 0.1em;
|
|
8907
9212
|
font-weight: 600;
|
|
@@ -8953,6 +9258,44 @@ var FullMapOverlay = styled9__default.default.div`
|
|
|
8953
9258
|
justify-content: center;
|
|
8954
9259
|
backdrop-filter: blur(4px);
|
|
8955
9260
|
`;
|
|
9261
|
+
var FullVideoOverlay = styled9__default.default.div`
|
|
9262
|
+
position: fixed;
|
|
9263
|
+
inset: 0;
|
|
9264
|
+
background: rgba(0, 0, 0, 0.92);
|
|
9265
|
+
z-index: 10000;
|
|
9266
|
+
display: flex;
|
|
9267
|
+
align-items: center;
|
|
9268
|
+
justify-content: center;
|
|
9269
|
+
padding: 1rem;
|
|
9270
|
+
video {
|
|
9271
|
+
max-width: 100%;
|
|
9272
|
+
max-height: 100%;
|
|
9273
|
+
width: auto;
|
|
9274
|
+
height: auto;
|
|
9275
|
+
border-radius: 10px;
|
|
9276
|
+
background: #000;
|
|
9277
|
+
}
|
|
9278
|
+
`;
|
|
9279
|
+
var FullVideoClose = styled9__default.default.button`
|
|
9280
|
+
position: absolute;
|
|
9281
|
+
top: max(1rem, env(safe-area-inset-top, 0px));
|
|
9282
|
+
right: 1rem;
|
|
9283
|
+
z-index: 1;
|
|
9284
|
+
width: 40px;
|
|
9285
|
+
height: 40px;
|
|
9286
|
+
border-radius: 50%;
|
|
9287
|
+
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
9288
|
+
background: rgba(0, 0, 0, 0.55);
|
|
9289
|
+
backdrop-filter: blur(6px);
|
|
9290
|
+
color: #fff;
|
|
9291
|
+
font-size: 1.1rem;
|
|
9292
|
+
line-height: 1;
|
|
9293
|
+
cursor: pointer;
|
|
9294
|
+
display: flex;
|
|
9295
|
+
align-items: center;
|
|
9296
|
+
justify-content: center;
|
|
9297
|
+
&:hover { background: rgba(40, 40, 46, 0.9); }
|
|
9298
|
+
`;
|
|
8956
9299
|
var FullMapPanel = styled9__default.default.div`
|
|
8957
9300
|
background: #111;
|
|
8958
9301
|
border: 1px solid rgba(255,255,255,0.08);
|
|
@@ -9532,6 +9875,9 @@ var GallerySpecLeft = styled9__default.default.div`
|
|
|
9532
9875
|
display: flex;
|
|
9533
9876
|
flex-direction: column;
|
|
9534
9877
|
gap: 0.75rem;
|
|
9878
|
+
/* Don't clip the stacked gallery's sticky "Show less" on mobile (overflow:hidden on an
|
|
9879
|
+
ancestor disables position:sticky). */
|
|
9880
|
+
@media (max-width: 768px) { overflow: visible; }
|
|
9535
9881
|
`;
|
|
9536
9882
|
var AssetBentoNarratives = styled9__default.default.div`
|
|
9537
9883
|
display: grid;
|
|
@@ -9624,7 +9970,7 @@ var TokenDetailsCard = styled9__default.default.div`
|
|
|
9624
9970
|
`;
|
|
9625
9971
|
var TokenDetailsTitle = styled9__default.default.div`
|
|
9626
9972
|
font-size: 0.65rem;
|
|
9627
|
-
color: #
|
|
9973
|
+
color: #E6C87E;
|
|
9628
9974
|
text-transform: uppercase;
|
|
9629
9975
|
letter-spacing: 0.12em;
|
|
9630
9976
|
font-weight: 600;
|
|
@@ -9671,7 +10017,7 @@ var CopyBtn = styled9__default.default.button`
|
|
|
9671
10017
|
var DocLinkBtn = styled9__default.default.button`
|
|
9672
10018
|
background: none;
|
|
9673
10019
|
border: none;
|
|
9674
|
-
color: #
|
|
10020
|
+
color: #E6C87E;
|
|
9675
10021
|
cursor: pointer;
|
|
9676
10022
|
padding: 0;
|
|
9677
10023
|
font-size: inherit;
|
|
@@ -9709,7 +10055,7 @@ var StatsRowSection = styled9__default.default.div`
|
|
|
9709
10055
|
`;
|
|
9710
10056
|
var StatsRowLabel = styled9__default.default.div`
|
|
9711
10057
|
font-size: 0.65rem;
|
|
9712
|
-
color: #
|
|
10058
|
+
color: #E6C87E;
|
|
9713
10059
|
text-transform: uppercase;
|
|
9714
10060
|
letter-spacing: 0.12em;
|
|
9715
10061
|
font-weight: 600;
|
|
@@ -9743,14 +10089,13 @@ var StatsHCellLabel = styled9__default.default.span`
|
|
|
9743
10089
|
var StatsHCellValue = styled9__default.default.span`
|
|
9744
10090
|
font-size: 0.92rem;
|
|
9745
10091
|
font-weight: 500;
|
|
9746
|
-
color: ${(p) => p.$gold ? "#
|
|
10092
|
+
color: ${(p) => p.$gold ? "#E6C87E" : "#fff"};
|
|
9747
10093
|
font-variant-numeric: tabular-nums;
|
|
9748
10094
|
`;
|
|
9749
10095
|
var StatsTabbedCard = styled9__default.default.div`
|
|
9750
10096
|
background: #111111;
|
|
9751
10097
|
border: 1px solid rgba(255,255,255,0.1);
|
|
9752
10098
|
border-radius: 12px;
|
|
9753
|
-
max-width: 400px;
|
|
9754
10099
|
`;
|
|
9755
10100
|
var StatsTabBar = styled9__default.default.div`
|
|
9756
10101
|
display: flex;
|
|
@@ -9767,10 +10112,10 @@ var StatsTab = styled9__default.default.button`
|
|
|
9767
10112
|
letter-spacing: 0.1em;
|
|
9768
10113
|
cursor: pointer;
|
|
9769
10114
|
transition: color 0.15s, border-color 0.15s;
|
|
9770
|
-
color: ${(p) => p.$active ? "#
|
|
9771
|
-
border-bottom: 2px solid ${(p) => p.$active ? "#
|
|
10115
|
+
color: ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.35)"};
|
|
10116
|
+
border-bottom: 2px solid ${(p) => p.$active ? "#E6C87E" : "transparent"};
|
|
9772
10117
|
margin-bottom: -1px;
|
|
9773
|
-
&:hover { color: ${(p) => p.$active ? "#
|
|
10118
|
+
&:hover { color: ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.6)"}; }
|
|
9774
10119
|
`;
|
|
9775
10120
|
var StatsTabContent = styled9__default.default.div`
|
|
9776
10121
|
padding: 0.5rem 1.25rem 1.25rem;
|
|
@@ -9783,7 +10128,7 @@ var StatsColumn = styled9__default.default.div`
|
|
|
9783
10128
|
`;
|
|
9784
10129
|
var StatsColumnHeader = styled9__default.default.div`
|
|
9785
10130
|
font-size: 0.65rem;
|
|
9786
|
-
color: #
|
|
10131
|
+
color: #E6C87E;
|
|
9787
10132
|
text-transform: uppercase;
|
|
9788
10133
|
letter-spacing: 0.12em;
|
|
9789
10134
|
font-weight: 600;
|
|
@@ -9814,7 +10159,7 @@ var StatLabel = styled9__default.default.span`
|
|
|
9814
10159
|
var StatValue = styled9__default.default.span`
|
|
9815
10160
|
font-size: 0.88rem;
|
|
9816
10161
|
font-weight: 500;
|
|
9817
|
-
color: ${(p) => p.$gold ? "#
|
|
10162
|
+
color: ${(p) => p.$gold ? "#E6C87E" : "#fff"};
|
|
9818
10163
|
font-variant-numeric: tabular-nums;
|
|
9819
10164
|
`;
|
|
9820
10165
|
var NarrativeCard = styled9__default.default.div`
|
|
@@ -9837,7 +10182,7 @@ var NarrativeIcon = styled9__default.default.div`
|
|
|
9837
10182
|
display: flex;
|
|
9838
10183
|
align-items: center;
|
|
9839
10184
|
justify-content: center;
|
|
9840
|
-
color: #
|
|
10185
|
+
color: #E6C87E;
|
|
9841
10186
|
flex-shrink: 0;
|
|
9842
10187
|
`;
|
|
9843
10188
|
var NarrativeTitle = styled9__default.default.div`
|
|
@@ -9879,7 +10224,7 @@ var TimelineDot = styled9__default.default.div`
|
|
|
9879
10224
|
width: 8px;
|
|
9880
10225
|
height: 8px;
|
|
9881
10226
|
border-radius: 50%;
|
|
9882
|
-
background: ${(p) => p.$active ? "#
|
|
10227
|
+
background: ${(p) => p.$active ? "#E6C87E" : "rgba(255,255,255,0.15)"};
|
|
9883
10228
|
border: ${(p) => p.$active ? "2px solid rgba(212,175,55,0.4)" : "none"};
|
|
9884
10229
|
justify-self: center;
|
|
9885
10230
|
`;
|
|
@@ -9902,7 +10247,7 @@ var TimelinePriceWrap = styled9__default.default.div`
|
|
|
9902
10247
|
var TimelinePrice = styled9__default.default.span`
|
|
9903
10248
|
font-size: 0.85rem;
|
|
9904
10249
|
font-weight: 600;
|
|
9905
|
-
color: ${(p) => p.$gold ? "#
|
|
10250
|
+
color: ${(p) => p.$gold ? "#E6C87E" : "#fff"};
|
|
9906
10251
|
font-variant-numeric: tabular-nums;
|
|
9907
10252
|
`;
|
|
9908
10253
|
var FeaturesPanel = styled9__default.default.div`
|
|
@@ -10003,7 +10348,7 @@ var SecurityValue = styled9__default.default.span`
|
|
|
10003
10348
|
`;
|
|
10004
10349
|
var SecurityDocLink = styled9__default.default.a`
|
|
10005
10350
|
font-size: 0.82rem;
|
|
10006
|
-
color: #
|
|
10351
|
+
color: #E6C87E;
|
|
10007
10352
|
font-weight: 600;
|
|
10008
10353
|
text-decoration: none;
|
|
10009
10354
|
cursor: pointer;
|
|
@@ -10017,7 +10362,7 @@ var DividendHistoryBtn = styled9__default.default.button`
|
|
|
10017
10362
|
padding: 0.5rem 0;
|
|
10018
10363
|
background: none;
|
|
10019
10364
|
border: none;
|
|
10020
|
-
color: #
|
|
10365
|
+
color: #E6C87E;
|
|
10021
10366
|
font-size: 0.78rem;
|
|
10022
10367
|
font-weight: 500;
|
|
10023
10368
|
cursor: pointer;
|
|
@@ -10133,7 +10478,7 @@ var STATUS_BG = {
|
|
|
10133
10478
|
var STATUS_COLOR = {
|
|
10134
10479
|
active: "#0ecb81",
|
|
10135
10480
|
rejected: "#f6465d",
|
|
10136
|
-
pending: "#
|
|
10481
|
+
pending: "#E6C87E",
|
|
10137
10482
|
historical: "#3861fb",
|
|
10138
10483
|
expired: "rgba(255,255,255,0.7)"
|
|
10139
10484
|
};
|
|
@@ -10154,7 +10499,7 @@ function PropertyOffers({ offers, totalShares }) {
|
|
|
10154
10499
|
"button",
|
|
10155
10500
|
{
|
|
10156
10501
|
onClick: () => alert("Coming soon..."),
|
|
10157
|
-
className: "rounded-md px-6 py-[0.65rem] font-semibold text-[0.9rem] cursor-pointer transition-all duration-200 bg-[var(--color-accent,#
|
|
10502
|
+
className: "rounded-md px-6 py-[0.65rem] font-semibold text-[0.9rem] cursor-pointer transition-all duration-200 bg-[var(--color-accent,#E6C87E)] border-none text-black hover:bg-[var(--color-accent-hover,#F2D898)] hover:-translate-y-px",
|
|
10158
10503
|
children: "Make Offer"
|
|
10159
10504
|
}
|
|
10160
10505
|
),
|
|
@@ -10162,7 +10507,7 @@ function PropertyOffers({ offers, totalShares }) {
|
|
|
10162
10507
|
"button",
|
|
10163
10508
|
{
|
|
10164
10509
|
onClick: () => alert("Coming soon..."),
|
|
10165
|
-
className: "rounded-md px-6 py-[0.65rem] font-semibold text-[0.9rem] cursor-pointer transition-all duration-200 bg-transparent border border-[var(--color-accent,#
|
|
10510
|
+
className: "rounded-md px-6 py-[0.65rem] font-semibold text-[0.9rem] cursor-pointer transition-all duration-200 bg-transparent border border-[var(--color-accent,#E6C87E)] text-[var(--color-accent,#E6C87E)] hover:bg-[rgba(240,185,11,0.12)] hover:-translate-y-px",
|
|
10166
10511
|
children: "Enquire"
|
|
10167
10512
|
}
|
|
10168
10513
|
)
|
|
@@ -10206,7 +10551,7 @@ function PropertyOffers({ offers, totalShares }) {
|
|
|
10206
10551
|
"button",
|
|
10207
10552
|
{
|
|
10208
10553
|
onClick: () => alert(`Voted for offer: ${offer.price} by ${offer.buyer}`),
|
|
10209
|
-
className: "bg-[var(--color-accent,#
|
|
10554
|
+
className: "bg-[var(--color-accent,#E6C87E)] text-black border-none rounded-md px-5 py-[0.45rem] font-semibold text-[0.78rem] uppercase cursor-pointer transition-all duration-200 hover:bg-[var(--color-accent-hover,#F2D898)] hover:-translate-y-px",
|
|
10210
10555
|
children: "Vote"
|
|
10211
10556
|
}
|
|
10212
10557
|
)
|
|
@@ -10629,9 +10974,9 @@ var FilterButtonsContainer = styled9__default.default.div`
|
|
|
10629
10974
|
}
|
|
10630
10975
|
`;
|
|
10631
10976
|
var FilterButton = styled9__default.default.button`
|
|
10632
|
-
background-color: ${(props) => props.$active ? "var(--color-accent, #
|
|
10977
|
+
background-color: ${(props) => props.$active ? "var(--color-accent, #E6C87E)" : "transparent"};
|
|
10633
10978
|
color: ${(props) => props.$active ? "#000" : "#fff"};
|
|
10634
|
-
border: 1px solid var(--color-accent, #
|
|
10979
|
+
border: 1px solid var(--color-accent, #E6C87E);
|
|
10635
10980
|
border-radius: 4px;
|
|
10636
10981
|
padding: 0.4rem 0.8rem;
|
|
10637
10982
|
font-size: 0.9rem;
|
|
@@ -10639,7 +10984,7 @@ var FilterButton = styled9__default.default.button`
|
|
|
10639
10984
|
transition: all 0.2s;
|
|
10640
10985
|
|
|
10641
10986
|
&:hover {
|
|
10642
|
-
background-color: ${(props) => props.$active ? "var(--color-accent, #
|
|
10987
|
+
background-color: ${(props) => props.$active ? "var(--color-accent, #E6C87E)" : "rgba(240, 185, 11, 0.1)"};
|
|
10643
10988
|
}
|
|
10644
10989
|
|
|
10645
10990
|
@media (max-width: 768px) {
|
|
@@ -10750,7 +11095,7 @@ var TypeBadge2 = styled9__default.default.span`
|
|
|
10750
11095
|
background-color: ${(props) => {
|
|
10751
11096
|
switch (props.$type) {
|
|
10752
11097
|
case "Listed":
|
|
10753
|
-
return "var(--color-accent, #
|
|
11098
|
+
return "var(--color-accent, #E6C87E)";
|
|
10754
11099
|
case "Sale":
|
|
10755
11100
|
return "rgba(14, 203, 129, 0.15)";
|
|
10756
11101
|
case "Leased":
|
|
@@ -10962,7 +11307,7 @@ var ComingSoonBadge = styled9__default.default.span`
|
|
|
10962
11307
|
margin-left: auto;
|
|
10963
11308
|
padding: 0.25rem 0.5rem;
|
|
10964
11309
|
background: rgba(212, 175, 55, 0.1);
|
|
10965
|
-
color: #
|
|
11310
|
+
color: #E6C87E;
|
|
10966
11311
|
border-radius: 0.25rem;
|
|
10967
11312
|
font-size: 0.7rem;
|
|
10968
11313
|
font-weight: 500;
|
|
@@ -11099,8 +11444,8 @@ var SpotsLeft = styled9__default.default.span`
|
|
|
11099
11444
|
var BookButton = styled9__default.default.button`
|
|
11100
11445
|
padding: 0.4rem 1rem;
|
|
11101
11446
|
background: transparent;
|
|
11102
|
-
border: 1px solid var(--color-accent, #
|
|
11103
|
-
color: var(--color-accent, #
|
|
11447
|
+
border: 1px solid var(--color-accent, #E6C87E);
|
|
11448
|
+
color: var(--color-accent, #E6C87E);
|
|
11104
11449
|
border-radius: 4px;
|
|
11105
11450
|
font-size: 0.8rem;
|
|
11106
11451
|
font-weight: 600;
|
|
@@ -11161,8 +11506,8 @@ var SignInSub = styled9__default.default.div`
|
|
|
11161
11506
|
var SignInButton = styled9__default.default.button`
|
|
11162
11507
|
padding: 0.5rem 1.25rem;
|
|
11163
11508
|
background: transparent;
|
|
11164
|
-
border: 1px solid var(--color-accent, #
|
|
11165
|
-
color: var(--color-accent, #
|
|
11509
|
+
border: 1px solid var(--color-accent, #E6C87E);
|
|
11510
|
+
color: var(--color-accent, #E6C87E);
|
|
11166
11511
|
border-radius: 4px;
|
|
11167
11512
|
font-size: 0.8rem;
|
|
11168
11513
|
font-weight: 600;
|
|
@@ -11285,8 +11630,20 @@ var IPOAssetSelector = styled9__default.default.div`
|
|
|
11285
11630
|
|
|
11286
11631
|
@media (max-width: 768px) {
|
|
11287
11632
|
flex-wrap: nowrap;
|
|
11288
|
-
|
|
11289
|
-
|
|
11633
|
+
gap: 0.5rem;
|
|
11634
|
+
/* Curved ribbon extending down from the nav: the box stretches up UNDER the
|
|
11635
|
+
nav (negative margin) while the content is pushed back down (top padding),
|
|
11636
|
+
so the dark background runs all the way to the nav with no visible top edge.
|
|
11637
|
+
The nav has a higher z-index and covers the overhang. Inset to the nav's width. */
|
|
11638
|
+
margin: -2.25rem 0.25rem 0;
|
|
11639
|
+
padding: 3rem 0.9rem 0.75rem;
|
|
11640
|
+
border: 1px solid rgba(255, 255, 255, 0.08);
|
|
11641
|
+
border-top: none;
|
|
11642
|
+
border-radius: 0 0 14px 14px;
|
|
11643
|
+
background: rgba(20, 24, 31, 0.97);
|
|
11644
|
+
backdrop-filter: blur(12px);
|
|
11645
|
+
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
|
|
11646
|
+
&:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35); border-color: rgba(255, 255, 255, 0.08); }
|
|
11290
11647
|
}
|
|
11291
11648
|
`;
|
|
11292
11649
|
var AssetThumbnail = styled9__default.default.img`
|
|
@@ -11298,9 +11655,9 @@ var AssetThumbnail = styled9__default.default.img`
|
|
|
11298
11655
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
11299
11656
|
|
|
11300
11657
|
@media (max-width: 768px) {
|
|
11301
|
-
width:
|
|
11302
|
-
height:
|
|
11303
|
-
border-radius:
|
|
11658
|
+
width: 42px;
|
|
11659
|
+
height: 42px;
|
|
11660
|
+
border-radius: 8px;
|
|
11304
11661
|
}
|
|
11305
11662
|
`;
|
|
11306
11663
|
var AssetSelectorDropdown = styled9__default.default.div`
|
|
@@ -11331,7 +11688,7 @@ var AssetName = styled9__default.default.div`
|
|
|
11331
11688
|
}
|
|
11332
11689
|
|
|
11333
11690
|
@media (max-width: 768px) {
|
|
11334
|
-
font-size:
|
|
11691
|
+
font-size: 1.2rem;
|
|
11335
11692
|
overflow: hidden;
|
|
11336
11693
|
text-overflow: ellipsis;
|
|
11337
11694
|
white-space: nowrap;
|
|
@@ -11402,7 +11759,7 @@ var MetricLabel = styled9__default.default.span`
|
|
|
11402
11759
|
var MetricValue = styled9__default.default.span`
|
|
11403
11760
|
font-size: ${(p) => p.$secondary ? "0.95rem" : "1.25rem"};
|
|
11404
11761
|
font-weight: ${(p) => p.$secondary ? "600" : "700"};
|
|
11405
|
-
color: ${(p) => p.$accent ? "#
|
|
11762
|
+
color: ${(p) => p.$accent ? "#E6C87E" : p.$secondary ? "rgba(255,255,255,0.7)" : "#fff"};
|
|
11406
11763
|
|
|
11407
11764
|
@media (max-width: 768px) {
|
|
11408
11765
|
font-size: ${(p) => p.$secondary ? "0.85rem" : "1.05rem"};
|
|
@@ -11647,8 +12004,8 @@ function OfferingProgressCard({
|
|
|
11647
12004
|
] }) : ipoStarted ? /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: "#0ecb81", children: [
|
|
11648
12005
|
/* @__PURE__ */ jsxRuntime.jsx(StatusDot3, { $color: "#0ecb81", $pulse: true }),
|
|
11649
12006
|
"LIVE"
|
|
11650
|
-
] }) : /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: statusColor || "#
|
|
11651
|
-
/* @__PURE__ */ jsxRuntime.jsx(StatusDot3, { $color: statusColor || "#
|
|
12007
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: statusColor || "#E6C87E", children: [
|
|
12008
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatusDot3, { $color: statusColor || "#E6C87E" }),
|
|
11652
12009
|
statusLabel || "Preparing"
|
|
11653
12010
|
] }) })
|
|
11654
12011
|
] }),
|
|
@@ -11767,8 +12124,8 @@ function OfferingProgressCard({
|
|
|
11767
12124
|
" ",
|
|
11768
12125
|
"AEST"
|
|
11769
12126
|
] })
|
|
11770
|
-
] }) : /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: statusColor || "#
|
|
11771
|
-
/* @__PURE__ */ jsxRuntime.jsx(StatusDot3, { $color: statusColor || "#
|
|
12127
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: statusColor || "#E6C87E", children: [
|
|
12128
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatusDot3, { $color: statusColor || "#E6C87E", $pulse: true }),
|
|
11772
12129
|
isPrivateClient ? "PRE-OFFERING" : statusLabel || "PREPARING"
|
|
11773
12130
|
] }) })
|
|
11774
12131
|
] }),
|
|
@@ -11933,7 +12290,7 @@ var MetricLabel2 = styled9__default.default.div`
|
|
|
11933
12290
|
var MetricValue2 = styled9__default.default.div`
|
|
11934
12291
|
font-size: 1.5rem;
|
|
11935
12292
|
font-weight: 700;
|
|
11936
|
-
color: ${(p) => p.$accent ? "#
|
|
12293
|
+
color: ${(p) => p.$accent ? "#E6C87E" : "#fff"};
|
|
11937
12294
|
`;
|
|
11938
12295
|
var CountdownCenter = styled9__default.default.div`
|
|
11939
12296
|
text-align: center;
|
|
@@ -11959,7 +12316,7 @@ var CountdownNumber = styled9__default.default.span`
|
|
|
11959
12316
|
font-size: 2rem;
|
|
11960
12317
|
font-weight: 700;
|
|
11961
12318
|
font-family: monospace;
|
|
11962
|
-
color: #
|
|
12319
|
+
color: #E6C87E;
|
|
11963
12320
|
@media (max-width: 768px) {
|
|
11964
12321
|
font-size: 1.5rem;
|
|
11965
12322
|
}
|
|
@@ -12000,7 +12357,7 @@ var LiveLabel = styled9__default.default.div`
|
|
|
12000
12357
|
var LivePercent = styled9__default.default.div`
|
|
12001
12358
|
font-size: 2rem;
|
|
12002
12359
|
font-weight: 600;
|
|
12003
|
-
color: #
|
|
12360
|
+
color: #E6C87E;
|
|
12004
12361
|
display: flex;
|
|
12005
12362
|
align-items: center;
|
|
12006
12363
|
.arrow {
|
|
@@ -12014,7 +12371,7 @@ var UnitsValue = styled9__default.default.div`
|
|
|
12014
12371
|
font-size: clamp(1.25rem, 4vw, 1.75rem);
|
|
12015
12372
|
font-weight: 700;
|
|
12016
12373
|
white-space: nowrap;
|
|
12017
|
-
span { color: #
|
|
12374
|
+
span { color: #E6C87E; }
|
|
12018
12375
|
small { color: rgba(255,255,255,0.3); font-weight: 700; margin-left: 0.35rem; font-size: inherit; }
|
|
12019
12376
|
`;
|
|
12020
12377
|
var ProgressBarOuter = styled9__default.default.div`
|
|
@@ -12027,7 +12384,7 @@ var ProgressBarOuter = styled9__default.default.div`
|
|
|
12027
12384
|
`;
|
|
12028
12385
|
var ProgressBarInner = styled9__default.default.div`
|
|
12029
12386
|
height: 100%;
|
|
12030
|
-
background: linear-gradient(90deg, #
|
|
12387
|
+
background: linear-gradient(90deg, #E6C87E, #E6C87E);
|
|
12031
12388
|
border-radius: 6px;
|
|
12032
12389
|
transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
|
|
12033
12390
|
will-change: width;
|
|
@@ -12043,7 +12400,7 @@ var ProgressSubscribers = styled9__default.default.div`
|
|
|
12043
12400
|
`;
|
|
12044
12401
|
var ProgressAmounts = styled9__default.default.div`
|
|
12045
12402
|
font-weight: 600;
|
|
12046
|
-
.raised { color: #
|
|
12403
|
+
.raised { color: #E6C87E; }
|
|
12047
12404
|
.target { color: rgba(255,255,255,0.3); }
|
|
12048
12405
|
`;
|
|
12049
12406
|
var CompactContainer = styled9__default.default.div`
|
|
@@ -12090,7 +12447,7 @@ var HomeSpinner = styled9__default.default.span`
|
|
|
12090
12447
|
width: 14px;
|
|
12091
12448
|
height: 14px;
|
|
12092
12449
|
border: 2px solid rgba(255, 255, 255, 0.1);
|
|
12093
|
-
border-top-color: var(--color-accent, #
|
|
12450
|
+
border-top-color: var(--color-accent, #E6C87E);
|
|
12094
12451
|
border-radius: 50%;
|
|
12095
12452
|
animation: homeSpin 1s linear infinite;
|
|
12096
12453
|
vertical-align: middle;
|
|
@@ -12289,7 +12646,7 @@ function OrderPanel({
|
|
|
12289
12646
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "pending-footnote", children: "Your order has been submitted and is being processed. This usually takes a few seconds." })
|
|
12290
12647
|
] }) : orderPlacedSuccess ? /* @__PURE__ */ jsxRuntime.jsxs(OrderSuccessCard, { children: [
|
|
12291
12648
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "success-header", children: [
|
|
12292
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "icon", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "#
|
|
12649
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "icon", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "#E6C87E", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) }),
|
|
12293
12650
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
12294
12651
|
/* @__PURE__ */ jsxRuntime.jsx("p", { children: "Order Complete" }),
|
|
12295
12652
|
/* @__PURE__ */ jsxRuntime.jsxs("small", { children: [
|
|
@@ -12671,7 +13028,7 @@ var QuickSelectRow = styled9__default.default.div`
|
|
|
12671
13028
|
button.active {
|
|
12672
13029
|
background: rgba(212,175,55,0.2);
|
|
12673
13030
|
border-color: rgba(212,175,55,0.5);
|
|
12674
|
-
color: #
|
|
13031
|
+
color: #E6C87E;
|
|
12675
13032
|
}
|
|
12676
13033
|
|
|
12677
13034
|
@media (max-width: 480px) {
|
|
@@ -12696,7 +13053,7 @@ var DepositButton2 = styled9__default.default.button`
|
|
|
12696
13053
|
border-radius: 4px;
|
|
12697
13054
|
padding: 0.25rem 0.5rem;
|
|
12698
13055
|
font-size: 0.65rem;
|
|
12699
|
-
color: #
|
|
13056
|
+
color: #E6C87E;
|
|
12700
13057
|
cursor: pointer;
|
|
12701
13058
|
font-weight: 500;
|
|
12702
13059
|
`;
|
|
@@ -12765,11 +13122,11 @@ var SubscribeButton = styled9__default.default.button`
|
|
|
12765
13122
|
color: #fff;
|
|
12766
13123
|
}
|
|
12767
13124
|
&:not([disabled])[data-green='false'] {
|
|
12768
|
-
background-color: #
|
|
13125
|
+
background-color: #E6C87E;
|
|
12769
13126
|
color: #0a0a0a;
|
|
12770
13127
|
}
|
|
12771
13128
|
&:not([disabled])[data-verify='true'] {
|
|
12772
|
-
background: linear-gradient(135deg, #
|
|
13129
|
+
background: linear-gradient(135deg, #E6C87E 0%, #E6C87E 100%);
|
|
12773
13130
|
color: #0a0a0a;
|
|
12774
13131
|
font-weight: 700;
|
|
12775
13132
|
box-shadow: 0 2px 8px rgba(212,175,55,0.25);
|
|
@@ -12814,7 +13171,7 @@ var BalanceValue = styled9__default.default.div`
|
|
|
12814
13171
|
`;
|
|
12815
13172
|
var BalanceAction = styled9__default.default.div`
|
|
12816
13173
|
font-size: 0.75rem;
|
|
12817
|
-
color: #
|
|
13174
|
+
color: #E6C87E;
|
|
12818
13175
|
cursor: pointer;
|
|
12819
13176
|
font-weight: 500;
|
|
12820
13177
|
margin-top: 0.5rem;
|
|
@@ -12855,7 +13212,7 @@ var OrderPendingCard = styled9__default.default.div`
|
|
|
12855
13212
|
height: 32px;
|
|
12856
13213
|
border-radius: 50%;
|
|
12857
13214
|
border: 2.5px solid rgba(212,175,55,0.15);
|
|
12858
|
-
border-top-color: #
|
|
13215
|
+
border-top-color: #E6C87E;
|
|
12859
13216
|
animation: spin 0.8s linear infinite;
|
|
12860
13217
|
flex-shrink: 0;
|
|
12861
13218
|
}
|
|
@@ -13007,7 +13364,7 @@ var OrderSuccessCard = styled9__default.default.div`
|
|
|
13007
13364
|
strong {
|
|
13008
13365
|
font-size: 1.05rem;
|
|
13009
13366
|
font-weight: 700;
|
|
13010
|
-
color: #
|
|
13367
|
+
color: #E6C87E;
|
|
13011
13368
|
font-family: monospace;
|
|
13012
13369
|
}
|
|
13013
13370
|
}
|
|
@@ -13026,7 +13383,7 @@ var OrderSuccessCard = styled9__default.default.div`
|
|
|
13026
13383
|
font-weight: 600;
|
|
13027
13384
|
font-size: 0.9rem;
|
|
13028
13385
|
cursor: pointer;
|
|
13029
|
-
background: linear-gradient(135deg, #
|
|
13386
|
+
background: linear-gradient(135deg, #E6C87E 0%, #E6C87E 100%);
|
|
13030
13387
|
color: #0a0a0a;
|
|
13031
13388
|
border: none;
|
|
13032
13389
|
box-shadow: 0 2px 8px rgba(212,175,55,0.25);
|
|
@@ -13336,7 +13693,7 @@ var Badge2 = styled9__default.default.span`
|
|
|
13336
13693
|
text-transform: uppercase;
|
|
13337
13694
|
letter-spacing: 0.5px;
|
|
13338
13695
|
background: linear-gradient(135deg, rgba(212,175,55,0.2) 0%, rgba(212,175,55,0.1) 100%);
|
|
13339
|
-
color: #
|
|
13696
|
+
color: #E6C87E;
|
|
13340
13697
|
border: 1px solid rgba(212,175,55,0.3);
|
|
13341
13698
|
`;
|
|
13342
13699
|
var ModalBody = styled9__default.default.div`
|
|
@@ -13363,7 +13720,7 @@ var ModalRow = styled9__default.default.div`
|
|
|
13363
13720
|
font-size: 0.95rem;
|
|
13364
13721
|
}
|
|
13365
13722
|
strong[data-highlight='true'] {
|
|
13366
|
-
color: #
|
|
13723
|
+
color: #E6C87E;
|
|
13367
13724
|
font-weight: 600;
|
|
13368
13725
|
}
|
|
13369
13726
|
`;
|
|
@@ -13485,7 +13842,7 @@ var PrimaryButton = styled9__default.default(BaseButton)`
|
|
|
13485
13842
|
|
|
13486
13843
|
// src/components/property-buy/constants.ts
|
|
13487
13844
|
var STATUS_COLOR2 = {
|
|
13488
|
-
PENDING: "#
|
|
13845
|
+
PENDING: "#E6C87E",
|
|
13489
13846
|
LIVE: "#0ecb81",
|
|
13490
13847
|
CLOSED: "#848e9c",
|
|
13491
13848
|
CANCELLED: "#f6465d"
|
|
@@ -13523,7 +13880,7 @@ var getOrderStatusMeta = (statusRaw) => {
|
|
|
13523
13880
|
if (status === "CANCELLED" || status === "CANCELED" || status === "REJECTED") {
|
|
13524
13881
|
return { color: "#f6465d", bg: "rgba(246,70,93,0.12)" };
|
|
13525
13882
|
}
|
|
13526
|
-
return { color: "#
|
|
13883
|
+
return { color: "#E6C87E", bg: "rgba(240,185,11,0.15)" };
|
|
13527
13884
|
};
|
|
13528
13885
|
function EditableField({ value, onCommit, format }) {
|
|
13529
13886
|
const [editing, setEditing] = React5.useState(false);
|
|
@@ -14102,7 +14459,7 @@ function PortfolioActivityPanel({
|
|
|
14102
14459
|
const isFailed = s === "SETTLEMENT_FAILED" || s === "REJECTED" || s === "CANCELLED" || s === "CANCELED";
|
|
14103
14460
|
const isSettling = !isSettled && !isFailed && !!trade.status;
|
|
14104
14461
|
const settlementLabel = isSettled ? "Settled" : isFailed ? "Settlement Failed" : isSettling ? prettyLabel(trade.status) : "\u2014";
|
|
14105
|
-
const settlementMeta = isSettled ? { color: "#0ecb81", bg: "rgba(14,203,129,0.1)" } : isFailed ? { color: "#f6465d", bg: "rgba(246,70,93,0.12)" } : isSettling ? { color: "#
|
|
14462
|
+
const settlementMeta = isSettled ? { color: "#0ecb81", bg: "rgba(14,203,129,0.1)" } : isFailed ? { color: "#f6465d", bg: "rgba(246,70,93,0.12)" } : isSettling ? { color: "#E6C87E", bg: "rgba(240,185,11,0.15)" } : null;
|
|
14106
14463
|
return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 1fr 1fr 36px", children: [
|
|
14107
14464
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: trade.tokenName }) }),
|
|
14108
14465
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(trade.side), children: sideLabel(trade.side) }) }),
|
|
@@ -14237,6 +14594,11 @@ var PanelTitle = styled9__default.default.h3`
|
|
|
14237
14594
|
font-weight: 600;
|
|
14238
14595
|
color: var(--color-text, #fff);
|
|
14239
14596
|
margin: 0 0 0.75rem;
|
|
14597
|
+
padding-left: 1rem;
|
|
14598
|
+
/* Redundant on mobile — the tab row already says what this is. Reclaim the space. */
|
|
14599
|
+
@media (max-width: 768px) {
|
|
14600
|
+
display: none;
|
|
14601
|
+
}
|
|
14240
14602
|
`;
|
|
14241
14603
|
var TabContainer = styled9__default.default.div`
|
|
14242
14604
|
display: flex;
|
|
@@ -14977,9 +15339,9 @@ function PropertyBuy({
|
|
|
14977
15339
|
const ipoStarted = ipoStatus === "LIVE" || isPrivateClient && ipoStatus === "PENDING";
|
|
14978
15340
|
const ipoEnded = ipoStatus === "CLOSED" || ipoStatus === "CANCELLED";
|
|
14979
15341
|
const statusLabel = ipoStatus === "PENDING" ? "Preparing" : ipoStatus;
|
|
14980
|
-
const statusColor = STATUS_COLOR2[ipoStatus] ?? "#
|
|
15342
|
+
const statusColor = STATUS_COLOR2[ipoStatus] ?? "#E6C87E";
|
|
14981
15343
|
const displayStatusLabel = isPrivateClient && ipoStatus !== "LIVE" ? "Private Client Access" : statusLabel;
|
|
14982
|
-
const displayStatusColor = isPrivateClient && ipoStatus !== "LIVE" ? "#
|
|
15344
|
+
const displayStatusColor = isPrivateClient && ipoStatus !== "LIVE" ? "#E6C87E" : statusColor;
|
|
14983
15345
|
const rawSpend = manualOrderAmount !== null ? manualOrderAmount : sliderValue === 100 ? Math.floor(availableBalance / (1 + feeRate)) : Math.round(sliderValue / 100 * availableBalance);
|
|
14984
15346
|
const tokenQuantity = Math.floor(rawSpend / tokenPrice);
|
|
14985
15347
|
const feeInUsd = tokenQuantity * tokenPrice * feeRate;
|
|
@@ -15122,6 +15484,7 @@ function PropertyBuy({
|
|
|
15122
15484
|
tradeHistory: portfolioActivity?.tradeHistory,
|
|
15123
15485
|
transfers: portfolioActivity?.transfers,
|
|
15124
15486
|
onCancelOrder: portfolioActivity?.onCancelOrder,
|
|
15487
|
+
onCancelAllOrders: portfolioActivity?.onCancelAllOrders,
|
|
15125
15488
|
onClosePosition: portfolioActivity?.onClosePosition,
|
|
15126
15489
|
cancellingOrderId: portfolioActivity?.cancellingOrderId,
|
|
15127
15490
|
defaultTab: "subscriptions",
|
|
@@ -15401,7 +15764,7 @@ var RecentOrderPanel = styled9__default.default.div`
|
|
|
15401
15764
|
height: 40px;
|
|
15402
15765
|
border-radius: 50%;
|
|
15403
15766
|
border: 2px solid rgba(212,175,55,0.3);
|
|
15404
|
-
border-top-color: #
|
|
15767
|
+
border-top-color: #E6C87E;
|
|
15405
15768
|
animation: roaSpin 1s linear infinite;
|
|
15406
15769
|
}
|
|
15407
15770
|
|
|
@@ -15558,7 +15921,7 @@ var PaymentMethodDetails = styled9__default.default.div`
|
|
|
15558
15921
|
}
|
|
15559
15922
|
`;
|
|
15560
15923
|
var ConfirmButton = styled9__default.default.button`
|
|
15561
|
-
background: ${(props) => props.disabled ? "rgba(255, 255, 255, 0.1)" : "linear-gradient(to right, #
|
|
15924
|
+
background: ${(props) => props.disabled ? "rgba(255, 255, 255, 0.1)" : "linear-gradient(to right, #E6C87E, #f2d35b)"};
|
|
15562
15925
|
border: none;
|
|
15563
15926
|
border-radius: 8px;
|
|
15564
15927
|
padding: 0.75rem 1.5rem;
|
|
@@ -15569,7 +15932,7 @@ var ConfirmButton = styled9__default.default.button`
|
|
|
15569
15932
|
transition: all 0.2s;
|
|
15570
15933
|
|
|
15571
15934
|
&:hover {
|
|
15572
|
-
background: ${(props) => props.disabled ? "rgba(255, 255, 255, 0.1)" : "linear-gradient(to right, #f2d35b, #
|
|
15935
|
+
background: ${(props) => props.disabled ? "rgba(255, 255, 255, 0.1)" : "linear-gradient(to right, #f2d35b, #E6C87E)"};
|
|
15573
15936
|
transform: ${(props) => props.disabled ? "none" : "translateY(-2px)"};
|
|
15574
15937
|
}
|
|
15575
15938
|
`;
|
|
@@ -15642,7 +16005,7 @@ function PaymentPopup({
|
|
|
15642
16005
|
] }),
|
|
15643
16006
|
/* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-[1.2rem] m-0 mb-4 text-white", children: "Select Payment Method" }),
|
|
15644
16007
|
/* @__PURE__ */ jsxRuntime.jsxs(PaymentOption, { $isSelected: selectedPaymentMethod === "tokens", onClick: () => setSelectedPaymentMethod("tokens"), children: [
|
|
15645
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center w-10 h-10 rounded-full bg-white/10 mr-4", style: { color: "#
|
|
16008
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center w-10 h-10 rounded-full bg-white/10 mr-4", style: { color: "#E6C87E" }, children: /* @__PURE__ */ jsxRuntime.jsx(bi.BiCoin, { size: 24 }) }),
|
|
15646
16009
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
|
|
15647
16010
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Loaf Tokens" }),
|
|
15648
16011
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[0.85rem] text-white/70", children: "Pay with your Loaf token balance" })
|
|
@@ -16023,9 +16386,9 @@ var OwnerBooking = ({ propertyName, token }) => {
|
|
|
16023
16386
|
),
|
|
16024
16387
|
/* @__PURE__ */ jsxRuntime.jsx(DateSelectorDropdown, { $isOpen: isDateSelectorOpen, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-3", children: [
|
|
16025
16388
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center mb-[0.6rem]", children: [
|
|
16026
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => changeYear(-1), className: "bg-none border-none text-[#
|
|
16389
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => changeYear(-1), className: "bg-none border-none text-[#E6C87E] text-[1.1rem] cursor-pointer px-2 py-1 transition-colors duration-200 hover:text-[#f2d35b]", children: "<" }),
|
|
16027
16390
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-white text-base", children: selectorYear }),
|
|
16028
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => changeYear(1), className: "bg-none border-none text-[#
|
|
16391
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => changeYear(1), className: "bg-none border-none text-[#E6C87E] text-[1.1rem] cursor-pointer px-2 py-1 transition-colors duration-200 hover:text-[#f2d35b]", children: ">" })
|
|
16029
16392
|
] }),
|
|
16030
16393
|
/* @__PURE__ */ jsxRuntime.jsx("h4", { className: "m-0 mt-[0.65rem] mb-[0.4rem] text-[0.85rem] uppercase tracking-[0.08em] text-[rgba(212,175,55,0.9)]", children: "Select Month" }),
|
|
16031
16394
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-2", children: monthNames.map((month, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -16041,8 +16404,8 @@ var OwnerBooking = ({ propertyName, token }) => {
|
|
|
16041
16404
|
] })
|
|
16042
16405
|
] }),
|
|
16043
16406
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 items-center flex-wrap", children: [
|
|
16044
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => shiftMonth("prev"), className: "bg-[rgba(212,175,55,0.15)] border-none rounded-md text-[#
|
|
16045
|
-
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => shiftMonth("next"), className: "bg-[rgba(212,175,55,0.15)] border-none rounded-md text-[#
|
|
16407
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => shiftMonth("prev"), className: "bg-[rgba(212,175,55,0.15)] border-none rounded-md text-[#E6C87E] w-8 h-8 flex items-center justify-center cursor-pointer transition-colors duration-200 hover:bg-[rgba(212,175,55,0.3)]", children: "<" }),
|
|
16408
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => shiftMonth("next"), className: "bg-[rgba(212,175,55,0.15)] border-none rounded-md text-[#E6C87E] w-8 h-8 flex items-center justify-center cursor-pointer transition-colors duration-200 hover:bg-[rgba(212,175,55,0.3)]", children: ">" }),
|
|
16046
16409
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: jumpToNextAvailable, className: "bg-[rgba(212,175,55,0.18)] border border-[rgba(212,175,55,0.4)] rounded-md text-[#f2d35b] px-3 py-[0.35rem] text-[0.85rem] cursor-pointer whitespace-nowrap transition-all duration-200 hover:bg-[rgba(212,175,55,0.3)]", children: "Next Available Date" })
|
|
16047
16410
|
] })
|
|
16048
16411
|
] }),
|
|
@@ -16208,7 +16571,7 @@ var OwnerBooking = ({ propertyName, token }) => {
|
|
|
16208
16571
|
" nights"
|
|
16209
16572
|
] }),
|
|
16210
16573
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-right", children: [
|
|
16211
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[0.95rem] font-semibold text-[#
|
|
16574
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[0.95rem] font-semibold text-[#E6C87E]", children: [
|
|
16212
16575
|
range.tokens.toFixed(4),
|
|
16213
16576
|
" Elara"
|
|
16214
16577
|
] }),
|
|
@@ -16249,7 +16612,7 @@ var OwnerBooking = ({ propertyName, token }) => {
|
|
|
16249
16612
|
{
|
|
16250
16613
|
onClick: () => setIsPaymentPopupOpen(true),
|
|
16251
16614
|
className: "mt-2 w-full border-none rounded-xl p-4 text-base font-semibold text-black cursor-pointer transition-all duration-200 hover:-translate-y-0.5 hover:shadow-[0_12px_30px_rgba(212,175,55,0.3)]",
|
|
16252
|
-
style: { background: "linear-gradient(90deg, #
|
|
16615
|
+
style: { background: "linear-gradient(90deg, #E6C87E, #f2d35b)" },
|
|
16253
16616
|
children: "Confirm Reservation"
|
|
16254
16617
|
}
|
|
16255
16618
|
)
|
|
@@ -16292,8 +16655,8 @@ var DateSelectorDropdown = styled9__default.default.div`
|
|
|
16292
16655
|
var MonthButton = styled9__default.default.button`
|
|
16293
16656
|
background: ${({ $isSelected }) => $isSelected ? "rgba(212, 175, 55, 0.2)" : "transparent"};
|
|
16294
16657
|
border: 1px solid
|
|
16295
|
-
${({ $isSelected }) => $isSelected ? "#
|
|
16296
|
-
color: ${({ $isSelected }) => $isSelected ? "#
|
|
16658
|
+
${({ $isSelected }) => $isSelected ? "#E6C87E" : "rgba(255, 255, 255, 0.12)"};
|
|
16659
|
+
color: ${({ $isSelected }) => $isSelected ? "#E6C87E" : "#fff"};
|
|
16297
16660
|
border-radius: 6px;
|
|
16298
16661
|
padding: 0.4rem 0;
|
|
16299
16662
|
cursor: pointer;
|
|
@@ -16378,7 +16741,7 @@ var ReservationCard = styled9__default.default.div`
|
|
|
16378
16741
|
var ActionButton = styled9__default.default.button`
|
|
16379
16742
|
background: none;
|
|
16380
16743
|
border: none;
|
|
16381
|
-
color: ${({ $variant }) => $variant === "danger" ? "#ff7676" : "#
|
|
16744
|
+
color: ${({ $variant }) => $variant === "danger" ? "#ff7676" : "#E6C87E"};
|
|
16382
16745
|
cursor: pointer;
|
|
16383
16746
|
padding: 0.25rem;
|
|
16384
16747
|
display: inline-flex;
|
|
@@ -16394,7 +16757,7 @@ var musgraveComparisonData = {
|
|
|
16394
16757
|
datasets: [
|
|
16395
16758
|
{
|
|
16396
16759
|
name: "Musgrave",
|
|
16397
|
-
color: "#
|
|
16760
|
+
color: "#E6C87E",
|
|
16398
16761
|
data: [100, 115, 125, 118, 130, 145, 155, 165, 180, 195, 210, 225, 240, 225, 235, 231, 265, 285, 300, 310, 320]
|
|
16399
16762
|
},
|
|
16400
16763
|
{
|
|
@@ -16497,7 +16860,7 @@ function PropertyValuation({
|
|
|
16497
16860
|
const year = musgraveComparisonData.labels[ctx.dataIndex];
|
|
16498
16861
|
if (year === "2006") return "#4CAF50";
|
|
16499
16862
|
if (year === "2021") return "#FF5722";
|
|
16500
|
-
if (year === "2026") return "#
|
|
16863
|
+
if (year === "2026") return "#E6C87E";
|
|
16501
16864
|
}
|
|
16502
16865
|
return dataset.color;
|
|
16503
16866
|
},
|
|
@@ -16521,13 +16884,13 @@ function PropertyValuation({
|
|
|
16521
16884
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
16522
16885
|
/* @__PURE__ */ jsxRuntime.jsx(ValuationHeading, { children: "Valuation Model" }),
|
|
16523
16886
|
/* @__PURE__ */ jsxRuntime.jsxs(LoafPricingSection, { children: [
|
|
16524
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { color: "#
|
|
16887
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { color: "#E6C87E", marginBottom: "0" }, children: "Loaf Pricing Model" }),
|
|
16525
16888
|
/* @__PURE__ */ jsxRuntime.jsx(BlurredContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(PricingModelCard, { children: [
|
|
16526
16889
|
/* @__PURE__ */ jsxRuntime.jsxs(PricingModelHeader, { children: [
|
|
16527
16890
|
/* @__PURE__ */ jsxRuntime.jsx(PricingModelTitle, { children: propertyTitle }),
|
|
16528
16891
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "right" }, children: [
|
|
16529
16892
|
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "0.75rem", color: "rgba(255,255,255,0.7)" }, children: "Valuation as of" }),
|
|
16530
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#
|
|
16893
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#E6C87E", fontWeight: "600" }, children: (valSummary?.valuationAsOf ? new Date(valSummary.valuationAsOf) : /* @__PURE__ */ new Date()).toLocaleDateString("en-US", { day: "2-digit", month: "short", year: "numeric" }) }),
|
|
16531
16894
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: "0.75rem", color: "rgba(255,255,255,0.7)" }, children: [
|
|
16532
16895
|
(valSummary?.valuationAsOf ? new Date(valSummary.valuationAsOf) : /* @__PURE__ */ new Date()).toLocaleTimeString("en-AU", { hour: "2-digit", minute: "2-digit", second: "2-digit", hour12: false, timeZone: "Australia/Sydney" }),
|
|
16533
16896
|
" AEST"
|
|
@@ -16547,7 +16910,7 @@ function PropertyValuation({
|
|
|
16547
16910
|
valSummary.confidence
|
|
16548
16911
|
] })
|
|
16549
16912
|
] }),
|
|
16550
|
-
/* @__PURE__ */ jsxRuntime.jsx(PricingDetailValue, { style: { color: "#
|
|
16913
|
+
/* @__PURE__ */ jsxRuntime.jsx(PricingDetailValue, { style: { color: "#E6C87E", fontWeight: "bold" }, children: valSummary?.fairValue != null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
16551
16914
|
`$${valSummary.fairValue.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`,
|
|
16552
16915
|
totalUnits > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.85em", fontWeight: "normal", opacity: 0.8 }, children: [
|
|
16553
16916
|
" ($",
|
|
@@ -16567,9 +16930,9 @@ function PropertyValuation({
|
|
|
16567
16930
|
padding: "10px 16px",
|
|
16568
16931
|
border: "1px solid rgba(212, 175, 55, 0.2)"
|
|
16569
16932
|
}, children: [
|
|
16570
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#
|
|
16933
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#E6C87E", fontWeight: "600" }, children: valSummary?.valuationStatus ?? "Fair Value" }),
|
|
16571
16934
|
/* @__PURE__ */ jsxRuntime.jsx("div", { style: {
|
|
16572
|
-
background: "linear-gradient(135deg, #
|
|
16935
|
+
background: "linear-gradient(135deg, #E6C87E 0%, #B8960C 100%)",
|
|
16573
16936
|
color: "white",
|
|
16574
16937
|
padding: "5px 12px",
|
|
16575
16938
|
borderRadius: "20px",
|
|
@@ -16626,7 +16989,7 @@ function PropertyValuation({
|
|
|
16626
16989
|
/* @__PURE__ */ jsxRuntime.jsxs(ValuationIndicator, { children: [
|
|
16627
16990
|
/* @__PURE__ */ jsxRuntime.jsxs(ValuationHeader, { children: [
|
|
16628
16991
|
/* @__PURE__ */ jsxRuntime.jsx(ValuationTitle, { style: { color: "#4CAF50" }, children: "Undervalued" }),
|
|
16629
|
-
/* @__PURE__ */ jsxRuntime.jsx(ValuationTitle, { style: { color: "#
|
|
16992
|
+
/* @__PURE__ */ jsxRuntime.jsx(ValuationTitle, { style: { color: "#E6C87E" }, children: "Fair Value" }),
|
|
16630
16993
|
/* @__PURE__ */ jsxRuntime.jsx(ValuationTitle, { style: { color: "#F44336" }, children: "Overvalued" })
|
|
16631
16994
|
] }),
|
|
16632
16995
|
/* @__PURE__ */ jsxRuntime.jsxs(ValuationGauge, { children: [
|
|
@@ -16634,7 +16997,7 @@ function PropertyValuation({
|
|
|
16634
16997
|
/* @__PURE__ */ jsxRuntime.jsx(GaugeIndicator, { $position: gaugePosition }),
|
|
16635
16998
|
/* @__PURE__ */ jsxRuntime.jsxs(GaugePriceTag, { $position: gaugePosition, children: [
|
|
16636
16999
|
/* @__PURE__ */ jsxRuntime.jsx("span", { children: "IPO Price" }),
|
|
16637
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#
|
|
17000
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#E6C87E" }, children: tokenPriceValue != null ? `$${tokenPriceValue.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}` : /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: 60, height: 12 }) })
|
|
16638
17001
|
] })
|
|
16639
17002
|
] }),
|
|
16640
17003
|
/* @__PURE__ */ jsxRuntime.jsxs(ValuationDetails, { children: [
|
|
@@ -16649,7 +17012,7 @@ function PropertyValuation({
|
|
|
16649
17012
|
"m)"
|
|
16650
17013
|
] })
|
|
16651
17014
|
] }) : /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { width: 90, height: 16 }) }) }),
|
|
16652
|
-
/* @__PURE__ */ jsxRuntime.jsx(ValuationItem, { children: /* @__PURE__ */ jsxRuntime.jsx(ValuationValue, { style: { color: "#
|
|
17015
|
+
/* @__PURE__ */ jsxRuntime.jsx(ValuationItem, { children: /* @__PURE__ */ jsxRuntime.jsx(ValuationValue, { style: { color: "#E6C87E" }, children: tokenPriceValue != null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
16653
17016
|
/* @__PURE__ */ jsxRuntime.jsx("span", { children: `$${tokenPriceValue.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}` }),
|
|
16654
17017
|
totalUnits > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.8rem", fontWeight: "normal", color: "rgba(255,255,255,0.6)" }, children: [
|
|
16655
17018
|
"($",
|
|
@@ -16709,8 +17072,8 @@ function PropertyValuation({
|
|
|
16709
17072
|
{
|
|
16710
17073
|
$active: hoveredSaleYear === marker.year,
|
|
16711
17074
|
style: {
|
|
16712
|
-
backgroundColor: marker.year === "2006" ? "#4CAF50" : marker.year === "2021" ? "#FF5722" : "#
|
|
16713
|
-
boxShadow: hoveredSaleYear === marker.year ? `0 0 12px ${marker.year === "2006" ? "#4CAF50" : marker.year === "2021" ? "#FF5722" : "#
|
|
17075
|
+
backgroundColor: marker.year === "2006" ? "#4CAF50" : marker.year === "2021" ? "#FF5722" : "#E6C87E",
|
|
17076
|
+
boxShadow: hoveredSaleYear === marker.year ? `0 0 12px ${marker.year === "2006" ? "#4CAF50" : marker.year === "2021" ? "#FF5722" : "#E6C87E"}` : "none"
|
|
16714
17077
|
}
|
|
16715
17078
|
}
|
|
16716
17079
|
),
|
|
@@ -16892,7 +17255,7 @@ var ValuationGauge = styled9__default.default.div`
|
|
|
16892
17255
|
var GaugeBackground = styled9__default.default.div`
|
|
16893
17256
|
height: 8px;
|
|
16894
17257
|
border-radius: 4px;
|
|
16895
|
-
background: linear-gradient(to right, #4CAF50 0%, #4CAF50 33%, #
|
|
17258
|
+
background: linear-gradient(to right, #4CAF50 0%, #4CAF50 33%, #E6C87E 33%, #E6C87E 66%, #F44336 66%, #F44336 100%);
|
|
16896
17259
|
`;
|
|
16897
17260
|
var GaugeIndicator = styled9__default.default.div`
|
|
16898
17261
|
position: absolute;
|
|
@@ -16901,7 +17264,7 @@ var GaugeIndicator = styled9__default.default.div`
|
|
|
16901
17264
|
transform: translateX(-50%);
|
|
16902
17265
|
width: 3px;
|
|
16903
17266
|
height: 30px;
|
|
16904
|
-
background: #
|
|
17267
|
+
background: #E6C87E;
|
|
16905
17268
|
border-radius: 2px;
|
|
16906
17269
|
`;
|
|
16907
17270
|
var GaugePriceTag = styled9__default.default.div`
|
|
@@ -17106,7 +17469,7 @@ var FeatureTooltip = styled9__default.default.div`
|
|
|
17106
17469
|
max-width: 220px;
|
|
17107
17470
|
padding: 0.65rem 0.85rem;
|
|
17108
17471
|
border-radius: 10px;
|
|
17109
|
-
border: 1px solid var(--color-accent, #
|
|
17472
|
+
border: 1px solid var(--color-accent, #E6C87E);
|
|
17110
17473
|
background: rgba(20, 23, 29, 0.95);
|
|
17111
17474
|
color: white;
|
|
17112
17475
|
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
|
|
@@ -17119,7 +17482,7 @@ var FeatureTooltip = styled9__default.default.div`
|
|
|
17119
17482
|
h4 {
|
|
17120
17483
|
margin: 0 0 0.2rem;
|
|
17121
17484
|
font-size: 0.9rem;
|
|
17122
|
-
color: var(--color-accent, #
|
|
17485
|
+
color: var(--color-accent, #E6C87E);
|
|
17123
17486
|
font-weight: 600;
|
|
17124
17487
|
}
|
|
17125
17488
|
|
|
@@ -17220,12 +17583,27 @@ var MainImage = styled9__default.default.img`
|
|
|
17220
17583
|
opacity: ${(p) => p.$visible ? 1 : 0};
|
|
17221
17584
|
pointer-events: ${(p) => p.$visible ? "auto" : "none"};
|
|
17222
17585
|
transition: opacity 300ms ease;
|
|
17586
|
+
/* Inset box excludes the bottom thumbnail strip so margin:auto centres the image in the
|
|
17587
|
+
space ABOVE the thumbnails (absolute ignores the parent's padding). */
|
|
17223
17588
|
position: absolute;
|
|
17224
|
-
|
|
17589
|
+
top: 24px;
|
|
17590
|
+
left: 24px;
|
|
17591
|
+
right: 24px;
|
|
17592
|
+
bottom: 120px;
|
|
17225
17593
|
margin: auto;
|
|
17226
17594
|
|
|
17595
|
+
/* Desktop: keep the image from dominating the viewport (incl. 14"/16" MacBooks). */
|
|
17596
|
+
@media (min-width: 769px) {
|
|
17597
|
+
max-width: 72%;
|
|
17598
|
+
max-height: 84%;
|
|
17599
|
+
}
|
|
17600
|
+
|
|
17227
17601
|
@media (max-width: 768px) {
|
|
17228
17602
|
max-width: 100%;
|
|
17603
|
+
left: 0;
|
|
17604
|
+
right: 0;
|
|
17605
|
+
top: 12px;
|
|
17606
|
+
bottom: 64px;
|
|
17229
17607
|
}
|
|
17230
17608
|
`;
|
|
17231
17609
|
var Hotspot = styled9__default.default.button`
|
|
@@ -17235,7 +17613,7 @@ var Hotspot = styled9__default.default.button`
|
|
|
17235
17613
|
border-radius: 50%;
|
|
17236
17614
|
border: none;
|
|
17237
17615
|
cursor: pointer;
|
|
17238
|
-
background: var(--color-accent, #
|
|
17616
|
+
background: var(--color-accent, #E6C87E);
|
|
17239
17617
|
color: #0b0e13;
|
|
17240
17618
|
transform: translate(-50%, -50%);
|
|
17241
17619
|
opacity: ${(p) => p.$visible ? 1 : 0};
|
|
@@ -17258,6 +17636,10 @@ var ThumbnailStrip = styled9__default.default.div`
|
|
|
17258
17636
|
overflow-x: auto;
|
|
17259
17637
|
background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, transparent 100%);
|
|
17260
17638
|
|
|
17639
|
+
/* Hide the native scrollbar — still scrollable via drag/trackpad. */
|
|
17640
|
+
scrollbar-width: none;
|
|
17641
|
+
&::-webkit-scrollbar { display: none; }
|
|
17642
|
+
|
|
17261
17643
|
@media (max-width: 768px) {
|
|
17262
17644
|
display: none;
|
|
17263
17645
|
}
|
|
@@ -17267,7 +17649,7 @@ var Thumbnail3 = styled9__default.default.button`
|
|
|
17267
17649
|
height: 64px;
|
|
17268
17650
|
border-radius: 6px;
|
|
17269
17651
|
overflow: hidden;
|
|
17270
|
-
border: 2px solid ${(p) => p.$active ? "var(--color-accent, #
|
|
17652
|
+
border: 2px solid ${(p) => p.$active ? "var(--color-accent, #E6C87E)" : "transparent"};
|
|
17271
17653
|
opacity: ${(p) => p.$active ? 1 : 0.45};
|
|
17272
17654
|
transition: all 0.2s ease;
|
|
17273
17655
|
background: transparent;
|
|
@@ -17304,21 +17686,8 @@ var NavigationButton = styled9__default.default.button`
|
|
|
17304
17686
|
}
|
|
17305
17687
|
`;
|
|
17306
17688
|
var SliderContainer = styled9__default.default.div`
|
|
17307
|
-
|
|
17308
|
-
|
|
17309
|
-
left: 50%;
|
|
17310
|
-
transform: translateX(-50%);
|
|
17311
|
-
width: min(860px, 90%);
|
|
17312
|
-
background: rgba(0, 0, 0, 0.8);
|
|
17313
|
-
border-radius: 16px;
|
|
17314
|
-
padding: 0.75rem 1.5rem;
|
|
17315
|
-
backdrop-filter: blur(12px);
|
|
17316
|
-
user-select: none;
|
|
17317
|
-
|
|
17318
|
-
@media (max-width: 768px) {
|
|
17319
|
-
bottom: 70px;
|
|
17320
|
-
width: 85%;
|
|
17321
|
-
}
|
|
17689
|
+
/* Slider/scrubber removed — navigate via thumbnails + arrows (desktop) or swipe (mobile). */
|
|
17690
|
+
display: none;
|
|
17322
17691
|
`;
|
|
17323
17692
|
var SliderTrack = styled9__default.default.div`
|
|
17324
17693
|
position: relative;
|
|
@@ -17331,7 +17700,7 @@ var SliderProgress = styled9__default.default.div`
|
|
|
17331
17700
|
position: absolute;
|
|
17332
17701
|
inset: 0;
|
|
17333
17702
|
width: ${(p) => p.$progress}%;
|
|
17334
|
-
background: linear-gradient(90deg, var(--color-accent, #
|
|
17703
|
+
background: linear-gradient(90deg, var(--color-accent, #E6C87E), rgba(240, 185, 11, 0.5));
|
|
17335
17704
|
border-radius: inherit;
|
|
17336
17705
|
`;
|
|
17337
17706
|
var SliderThumb = styled9__default.default.div`
|
|
@@ -17342,24 +17711,13 @@ var SliderThumb = styled9__default.default.div`
|
|
|
17342
17711
|
width: 18px;
|
|
17343
17712
|
height: 18px;
|
|
17344
17713
|
border-radius: 50%;
|
|
17345
|
-
background: var(--color-accent, #
|
|
17714
|
+
background: var(--color-accent, #E6C87E);
|
|
17346
17715
|
border: 3px solid white;
|
|
17347
17716
|
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
|
|
17348
17717
|
`;
|
|
17349
17718
|
var SliderLabels = styled9__default.default.div`
|
|
17350
|
-
|
|
17351
|
-
|
|
17352
|
-
margin-top: 0.75rem;
|
|
17353
|
-
font-size: 0.75rem;
|
|
17354
|
-
color: rgba(255, 255, 255, 0.7);
|
|
17355
|
-
|
|
17356
|
-
span {
|
|
17357
|
-
cursor: pointer;
|
|
17358
|
-
}
|
|
17359
|
-
|
|
17360
|
-
@media (max-width: 768px) {
|
|
17361
|
-
display: none;
|
|
17362
|
-
}
|
|
17719
|
+
/* Per-image category labels removed from the fullscreen carousel. */
|
|
17720
|
+
display: none;
|
|
17363
17721
|
`;
|
|
17364
17722
|
var MobileDots = styled9__default.default.div`
|
|
17365
17723
|
position: absolute;
|
|
@@ -17378,7 +17736,7 @@ var MobileDot = styled9__default.default.button`
|
|
|
17378
17736
|
height: 8px;
|
|
17379
17737
|
border-radius: 50%;
|
|
17380
17738
|
border: none;
|
|
17381
|
-
background: ${(p) => p.$active ? "var(--color-accent, #
|
|
17739
|
+
background: ${(p) => p.$active ? "var(--color-accent, #E6C87E)" : "rgba(255,255,255,0.3)"};
|
|
17382
17740
|
${(p) => p.$active && styled9.css`
|
|
17383
17741
|
transform: scale(1.2);
|
|
17384
17742
|
`}
|