@godaddy/gd-commerce-storefront 0.1.1 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -2
- package/dist/styles.css +1 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -54,7 +54,7 @@ Use the providers your application already has; do not create another router or
|
|
|
54
54
|
| `catalogPath` | `/shop` | Same-origin catalog route |
|
|
55
55
|
| `productPath` | `/products` | Same-origin prefix for product links; register `${productPath}/:productId` |
|
|
56
56
|
| `checkoutSuccessPath` | unset | Same-origin return route; enables checkout UI only when supplied |
|
|
57
|
-
| `theme` | neutral palette | CSS custom properties applied to storefront surfaces and the portalled drawer |
|
|
57
|
+
| `theme` | inherited text and transparent wrappers; neutral control palette | CSS custom properties applied to storefront surfaces and the portalled drawer |
|
|
58
58
|
|
|
59
59
|
Provide root-relative paths without a trailing slash. Enable `checkoutSuccessPath` only after your server supports checkout and validates merchant readiness. Mount a corresponding return page. A redirect back from checkout is **not proof of payment**; that page must obtain authoritative payment status from your server. This package does not provide a payment receipt page or merchant onboarding.
|
|
60
60
|
|
|
@@ -82,7 +82,9 @@ A connection failure leaves the surrounding application and its state mounted. C
|
|
|
82
82
|
</CommerceStorefront>
|
|
83
83
|
```
|
|
84
84
|
|
|
85
|
-
The stylesheet includes all required utilities and scopes them to the package's surfaces. The build removes CSS layer wrappers in their declared order, so the exported CSS can pass through a host Tailwind v3 PostCSS pipeline without `@tailwind` directives. Import it directly; consumers do not need to copy or rewrite the CSS. It does not add a global reset or require dependency scanning by a host Tailwind build. The `theme` prop reaches the drawer even though it is portalled into `document.body`.
|
|
85
|
+
The stylesheet includes all required utilities and scopes them to the package's surfaces. The build removes CSS layer wrappers in their declared order, so the exported CSS can pass through a host Tailwind v3 PostCSS pipeline without `@tailwind` directives. Import it directly; consumers do not need to copy or rewrite the CSS. It does not add a global reset or require dependency scanning by a host Tailwind build. The `theme` prop reaches the drawer even though it is portalled into `document.body`.
|
|
86
|
+
|
|
87
|
+
By default, `.commerce-storefront` wrappers do not paint a background and inherit the host's text color. Set page and section backgrounds on the host application's layout elements. `--commerce-surface` colors controls and the opaque cart drawer, and supplies the base for muted colors; it does not color component wrappers. Set `--commerce-surface` and `--commerce-text` together to adapt controls and the drawer to a dark theme. Avoid setting wrapper backgrounds through CSS or the `theme` prop's `background`, `backgroundColor`, or `backgroundImage` properties, which can still override the transparent default. Descendants inherit the surface text and body font instead of global heading styles. Keep text, controls and focus indicators accessible when changing colors. Utility class names and internal markup are not a customization API.
|
|
86
88
|
|
|
87
89
|
The first release uses English UI text and `en-US` currency formatting. Catalog title and description are configurable. Full localization and arbitrary component slots are outside this initial API.
|
|
88
90
|
|
package/dist/styles.css
CHANGED
|
@@ -64,8 +64,7 @@
|
|
|
64
64
|
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
65
65
|
}
|
|
66
66
|
.commerce-storefront {
|
|
67
|
-
color: var(--commerce-text,
|
|
68
|
-
background-color: var(--commerce-surface, #fff);
|
|
67
|
+
color: var(--commerce-text, inherit);
|
|
69
68
|
font-family: inherit;
|
|
70
69
|
line-height: 1.5;
|
|
71
70
|
}
|
|
@@ -108,7 +107,6 @@
|
|
|
108
107
|
}
|
|
109
108
|
.commerce-inline {
|
|
110
109
|
display: inline-block;
|
|
111
|
-
background-color: transparent;
|
|
112
110
|
}
|
|
113
111
|
.commerce-sr-only {
|
|
114
112
|
position: absolute;
|