@nuskin/react-mysite-elements 1.0.0 → 1.0.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 +21 -6
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -53,6 +53,11 @@ function App() {
|
|
|
53
53
|
shopDescription="Welcome to my personalized Nu Skin experience"
|
|
54
54
|
socialTitleText="Connect with me"
|
|
55
55
|
email="contact@example.com"
|
|
56
|
+
bannerProps={{
|
|
57
|
+
backgroundColor: '#383838',
|
|
58
|
+
headlineFont: 'Lora',
|
|
59
|
+
paragraphFont: 'Inter',
|
|
60
|
+
}}
|
|
56
61
|
socialIcons={[
|
|
57
62
|
{ type: 'facebook', url: 'https://facebook.com/myshop' },
|
|
58
63
|
{ type: 'instagram', url: 'https://instagram.com/myshop' },
|
|
@@ -84,12 +89,20 @@ The main hero component for Mysite pages with advanced scroll behavior and respo
|
|
|
84
89
|
| `socialTitleText` | `string` | ✅ | Label for the social media section |
|
|
85
90
|
| `email` | `string` | ✅ | Contact email address |
|
|
86
91
|
| `className` | `string` | ❌ | Additional CSS classes |
|
|
87
|
-
| `
|
|
88
|
-
| `headlineFont` | `string` | ❌ | Custom font for headlines |
|
|
89
|
-
| `paragraphFont` | `string` | ❌ | Custom font for paragraphs |
|
|
92
|
+
| `bannerProps` | `object` | ❌ | Banner styling configuration |
|
|
90
93
|
| `imageDetails` | `object` | ❌ | Hero image configuration |
|
|
91
94
|
| `socialIcons` | `array` | ❌ | Social media links configuration |
|
|
92
95
|
|
|
96
|
+
#### BannerProps Object
|
|
97
|
+
|
|
98
|
+
```typescript
|
|
99
|
+
{
|
|
100
|
+
backgroundColor?: string; // Custom background color
|
|
101
|
+
headlineFont?: string; // Custom font for headlines
|
|
102
|
+
paragraphFont?: string; // Custom font for paragraphs/ description
|
|
103
|
+
}
|
|
104
|
+
```
|
|
105
|
+
|
|
93
106
|
#### ImageDetails Object
|
|
94
107
|
|
|
95
108
|
```typescript
|
|
@@ -193,9 +206,11 @@ const theme = createTheme({
|
|
|
193
206
|
```jsx
|
|
194
207
|
<MysiteHero
|
|
195
208
|
className="custom-hero"
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
209
|
+
bannerProps={{
|
|
210
|
+
backgroundColor: '#f5f5f5',
|
|
211
|
+
headlineFont: "'Inter', sans-serif",
|
|
212
|
+
paragraphFont: "'Roboto', sans-serif",
|
|
213
|
+
}}
|
|
199
214
|
{...otherProps}
|
|
200
215
|
/>
|
|
201
216
|
```
|