@jimmy_harika/websitekit 0.4.0 → 0.5.1
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/README.md +24 -1
- package/package.json +1 -1
- package/src/blocks/back-to-top.tsx +25 -0
- package/src/blocks/banner-quote.tsx +89 -0
- package/src/blocks/category-showcase.tsx +107 -0
- package/src/blocks/hero-slideshow.tsx +151 -0
- package/src/blocks/index.ts +40 -0
- package/src/blocks/logo-band.tsx +62 -0
- package/src/blocks/nav-menu.tsx +105 -0
- package/src/blocks/nav.tsx +149 -0
- package/src/blocks/primitives.tsx +54 -0
- package/src/blocks/reveal.tsx +74 -0
- package/src/blocks/site-footer.tsx +190 -0
- package/src/blocks/slider.tsx +200 -0
- package/src/blocks/teaser-cards.tsx +77 -0
- package/src/blocks/testimonial-slider.tsx +167 -0
- package/src/editor/Inspector.tsx +106 -22
- package/src/editor/edit-primitives.tsx +57 -8
- package/src/model.ts +8 -0
- package/src/renderer/index.tsx +31 -20
- package/src/theme.ts +13 -0
package/src/theme.ts
CHANGED
|
@@ -28,6 +28,8 @@ function spacingScale(s: ThemeTokens["spacing"]): string {
|
|
|
28
28
|
export function themeVars(theme: ThemeTokens): CSSProperties {
|
|
29
29
|
const heading = fontStack(theme.fontHeading, "serif");
|
|
30
30
|
const body = fontStack(theme.fontBody, "sans-serif");
|
|
31
|
+
// v0.5 optional treatments — computed here so blocks only ever read vars.
|
|
32
|
+
const filled = theme.buttonStyle !== "outline";
|
|
31
33
|
const vars: Record<string, string> = {
|
|
32
34
|
// legacy storefront tokens (existing renderers depend on these)
|
|
33
35
|
"--sf-font-heading": heading,
|
|
@@ -46,6 +48,13 @@ export function themeVars(theme: ThemeTokens): CSSProperties {
|
|
|
46
48
|
"--pb-color-muted": theme.colors.muted,
|
|
47
49
|
"--pb-radius": radiusPx(theme.radius),
|
|
48
50
|
"--pb-spacing": spacingScale(theme.spacing),
|
|
51
|
+
// v0.5: heading case — blocks apply `textTransform: var(--pb-heading-case, none)`.
|
|
52
|
+
"--pb-heading-case": theme.headingCase === "uppercase" ? "uppercase" : "none",
|
|
53
|
+
// v0.5: button treatment — filled (bg=primary, fg=page bg, border=primary)
|
|
54
|
+
// or outline (transparent bg, fg=text, border=accent). Blocks read the vars.
|
|
55
|
+
"--pb-btn-bg": filled ? theme.colors.primary : "transparent",
|
|
56
|
+
"--pb-btn-fg": filled ? theme.colors.bg : theme.colors.text,
|
|
57
|
+
"--pb-btn-border": filled ? theme.colors.primary : theme.colors.accent,
|
|
49
58
|
};
|
|
50
59
|
return {
|
|
51
60
|
...(vars as CSSProperties),
|
|
@@ -73,6 +82,8 @@ export const FONT_PAIRS: { id: string; label: string; heading: string; body: str
|
|
|
73
82
|
{ id: "modern", label: "Modern", heading: "Fraunces", body: "Manrope" },
|
|
74
83
|
{ id: "grotesk", label: "Grotesk", heading: "Space Grotesk", body: "Inter" },
|
|
75
84
|
{ id: "warm", label: "Warm", heading: "DM Serif Display", body: "DM Sans" },
|
|
85
|
+
{ id: "cinematic", label: "Cinematic", heading: "Archivo", body: "Roboto Mono" },
|
|
86
|
+
{ id: "romantic", label: "Romantic", heading: "Cormorant Garamond", body: "EB Garamond" },
|
|
76
87
|
];
|
|
77
88
|
|
|
78
89
|
/** Curated palettes offered in the theme panel. */
|
|
@@ -82,4 +93,6 @@ export const PALETTES: { id: string; label: string; colors: ThemeTokens["colors"
|
|
|
82
93
|
{ id: "blush", label: "Blush", colors: { bg: "#fbf6f3", text: "#2b2422", primary: "#2b2422", accent: "#c98b7e", muted: "#8a7d78" } },
|
|
83
94
|
{ id: "sage", label: "Sage", colors: { bg: "#f4f6f2", text: "#22281f", primary: "#22281f", accent: "#7c8a6a", muted: "#7a8073" } },
|
|
84
95
|
{ id: "cobalt", label: "Cobalt", colors: { bg: "#ffffff", text: "#0f172a", primary: "#0f172a", accent: "#2f5cff", muted: "#64748b" } },
|
|
96
|
+
{ id: "porcelain", label: "Porcelain", colors: { bg: "#faf9f6", text: "#1c1a17", primary: "#1c1a17", accent: "#a8894e", muted: "#7c766b" } },
|
|
97
|
+
{ id: "onyx-mono", label: "Onyx Mono", colors: { bg: "#0c0c0c", text: "#f2efe9", primary: "#f2efe9", accent: "#9c968b", muted: "#7d786f" } },
|
|
85
98
|
];
|