styled-hairomin 0.3.4 → 0.3.8
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.cjs.js +15 -5
- package/dist/index.esm.js +15 -5
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -289,7 +289,8 @@ const GradientRating = styled.div`
|
|
|
289
289
|
`;
|
|
290
290
|
function CardVariant({
|
|
291
291
|
variant = "elevated",
|
|
292
|
-
data
|
|
292
|
+
data,
|
|
293
|
+
actionButton
|
|
293
294
|
}) {
|
|
294
295
|
switch (variant) {
|
|
295
296
|
case "elevated":
|
|
@@ -331,6 +332,11 @@ function CardVariant({
|
|
|
331
332
|
}), /*#__PURE__*/jsxRuntime.jsxs(Rating, {
|
|
332
333
|
children: [/*#__PURE__*/jsxRuntime.jsx(fa.FaStar, {}), " ", data.rating]
|
|
333
334
|
})]
|
|
335
|
+
}), actionButton && /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
336
|
+
style: {
|
|
337
|
+
marginTop: '1rem'
|
|
338
|
+
},
|
|
339
|
+
children: actionButton
|
|
334
340
|
})]
|
|
335
341
|
})]
|
|
336
342
|
});
|
|
@@ -1092,7 +1098,7 @@ const variantStyles$1 = {
|
|
|
1092
1098
|
|
|
1093
1099
|
/* ====== VARIANT STACKED: Vertical sections ====== */
|
|
1094
1100
|
const StackedFooter = styled.footer`
|
|
1095
|
-
background: ${variantStyles$1.stacked.background};
|
|
1101
|
+
background: ${props => props.$bg || variantStyles$1.stacked.background};
|
|
1096
1102
|
color: ${variantStyles$1.stacked.color};
|
|
1097
1103
|
padding: 3rem 2rem 1.5rem;
|
|
1098
1104
|
font-family: "Inter", sans-serif;
|
|
@@ -1250,7 +1256,7 @@ const SocialIcons = styled.div`
|
|
|
1250
1256
|
|
|
1251
1257
|
/* ====== VARIANT COLUMNS: Multi-column layout ====== */
|
|
1252
1258
|
const ColumnsFooter = styled.footer`
|
|
1253
|
-
background: ${variantStyles$1.columns.background};
|
|
1259
|
+
background: ${props => props.$bg || variantStyles$1.columns.background};
|
|
1254
1260
|
color: ${variantStyles$1.columns.color};
|
|
1255
1261
|
padding: 4rem 3rem 2rem;
|
|
1256
1262
|
font-family: "Poppins", sans-serif;
|
|
@@ -1379,7 +1385,7 @@ const ColumnsDivider = styled.div`
|
|
|
1379
1385
|
|
|
1380
1386
|
/* ====== VARIANT CENTERED: Center-aligned footer ====== */
|
|
1381
1387
|
const CenteredFooter = styled.footer`
|
|
1382
|
-
background: ${variantStyles$1.centered.background};
|
|
1388
|
+
background: ${props => props.$bg || variantStyles$1.centered.background};
|
|
1383
1389
|
color: ${variantStyles$1.centered.color};
|
|
1384
1390
|
padding: 3rem 2rem;
|
|
1385
1391
|
font-family: "Poppins", sans-serif;
|
|
@@ -1478,7 +1484,8 @@ const normalizeLink = link => {
|
|
|
1478
1484
|
};
|
|
1479
1485
|
function FooterVariant({
|
|
1480
1486
|
variant = "stacked",
|
|
1481
|
-
data
|
|
1487
|
+
data,
|
|
1488
|
+
backgroundColor
|
|
1482
1489
|
}) {
|
|
1483
1490
|
const defaultData = {
|
|
1484
1491
|
stacked: {
|
|
@@ -1524,6 +1531,7 @@ function FooterVariant({
|
|
|
1524
1531
|
switch (variant) {
|
|
1525
1532
|
case "stacked":
|
|
1526
1533
|
return /*#__PURE__*/jsxRuntime.jsxs(StackedFooter, {
|
|
1534
|
+
$bg: backgroundColor,
|
|
1527
1535
|
children: [/*#__PURE__*/jsxRuntime.jsxs(StackedSection, {
|
|
1528
1536
|
children: [/*#__PURE__*/jsxRuntime.jsxs(StackedBrand, {
|
|
1529
1537
|
children: [/*#__PURE__*/jsxRuntime.jsx("h2", {
|
|
@@ -1569,6 +1577,7 @@ function FooterVariant({
|
|
|
1569
1577
|
});
|
|
1570
1578
|
case "columns":
|
|
1571
1579
|
return /*#__PURE__*/jsxRuntime.jsxs(ColumnsFooter, {
|
|
1580
|
+
$bg: backgroundColor,
|
|
1572
1581
|
children: [/*#__PURE__*/jsxRuntime.jsxs(ColumnsGrid, {
|
|
1573
1582
|
children: [/*#__PURE__*/jsxRuntime.jsxs(ColumnBox, {
|
|
1574
1583
|
children: [/*#__PURE__*/jsxRuntime.jsx("h3", {
|
|
@@ -1629,6 +1638,7 @@ function FooterVariant({
|
|
|
1629
1638
|
});
|
|
1630
1639
|
case "centered":
|
|
1631
1640
|
return /*#__PURE__*/jsxRuntime.jsx(CenteredFooter, {
|
|
1641
|
+
$bg: backgroundColor,
|
|
1632
1642
|
children: /*#__PURE__*/jsxRuntime.jsxs(CenteredContent, {
|
|
1633
1643
|
children: [/*#__PURE__*/jsxRuntime.jsx(CenteredLogo, {
|
|
1634
1644
|
children: footerData.logo
|
package/dist/index.esm.js
CHANGED
|
@@ -287,7 +287,8 @@ const GradientRating = styled.div`
|
|
|
287
287
|
`;
|
|
288
288
|
function CardVariant({
|
|
289
289
|
variant = "elevated",
|
|
290
|
-
data
|
|
290
|
+
data,
|
|
291
|
+
actionButton
|
|
291
292
|
}) {
|
|
292
293
|
switch (variant) {
|
|
293
294
|
case "elevated":
|
|
@@ -329,6 +330,11 @@ function CardVariant({
|
|
|
329
330
|
}), /*#__PURE__*/jsxs(Rating, {
|
|
330
331
|
children: [/*#__PURE__*/jsx(FaStar, {}), " ", data.rating]
|
|
331
332
|
})]
|
|
333
|
+
}), actionButton && /*#__PURE__*/jsx("div", {
|
|
334
|
+
style: {
|
|
335
|
+
marginTop: '1rem'
|
|
336
|
+
},
|
|
337
|
+
children: actionButton
|
|
332
338
|
})]
|
|
333
339
|
})]
|
|
334
340
|
});
|
|
@@ -1090,7 +1096,7 @@ const variantStyles$1 = {
|
|
|
1090
1096
|
|
|
1091
1097
|
/* ====== VARIANT STACKED: Vertical sections ====== */
|
|
1092
1098
|
const StackedFooter = styled.footer`
|
|
1093
|
-
background: ${variantStyles$1.stacked.background};
|
|
1099
|
+
background: ${props => props.$bg || variantStyles$1.stacked.background};
|
|
1094
1100
|
color: ${variantStyles$1.stacked.color};
|
|
1095
1101
|
padding: 3rem 2rem 1.5rem;
|
|
1096
1102
|
font-family: "Inter", sans-serif;
|
|
@@ -1248,7 +1254,7 @@ const SocialIcons = styled.div`
|
|
|
1248
1254
|
|
|
1249
1255
|
/* ====== VARIANT COLUMNS: Multi-column layout ====== */
|
|
1250
1256
|
const ColumnsFooter = styled.footer`
|
|
1251
|
-
background: ${variantStyles$1.columns.background};
|
|
1257
|
+
background: ${props => props.$bg || variantStyles$1.columns.background};
|
|
1252
1258
|
color: ${variantStyles$1.columns.color};
|
|
1253
1259
|
padding: 4rem 3rem 2rem;
|
|
1254
1260
|
font-family: "Poppins", sans-serif;
|
|
@@ -1377,7 +1383,7 @@ const ColumnsDivider = styled.div`
|
|
|
1377
1383
|
|
|
1378
1384
|
/* ====== VARIANT CENTERED: Center-aligned footer ====== */
|
|
1379
1385
|
const CenteredFooter = styled.footer`
|
|
1380
|
-
background: ${variantStyles$1.centered.background};
|
|
1386
|
+
background: ${props => props.$bg || variantStyles$1.centered.background};
|
|
1381
1387
|
color: ${variantStyles$1.centered.color};
|
|
1382
1388
|
padding: 3rem 2rem;
|
|
1383
1389
|
font-family: "Poppins", sans-serif;
|
|
@@ -1476,7 +1482,8 @@ const normalizeLink = link => {
|
|
|
1476
1482
|
};
|
|
1477
1483
|
function FooterVariant({
|
|
1478
1484
|
variant = "stacked",
|
|
1479
|
-
data
|
|
1485
|
+
data,
|
|
1486
|
+
backgroundColor
|
|
1480
1487
|
}) {
|
|
1481
1488
|
const defaultData = {
|
|
1482
1489
|
stacked: {
|
|
@@ -1522,6 +1529,7 @@ function FooterVariant({
|
|
|
1522
1529
|
switch (variant) {
|
|
1523
1530
|
case "stacked":
|
|
1524
1531
|
return /*#__PURE__*/jsxs(StackedFooter, {
|
|
1532
|
+
$bg: backgroundColor,
|
|
1525
1533
|
children: [/*#__PURE__*/jsxs(StackedSection, {
|
|
1526
1534
|
children: [/*#__PURE__*/jsxs(StackedBrand, {
|
|
1527
1535
|
children: [/*#__PURE__*/jsx("h2", {
|
|
@@ -1567,6 +1575,7 @@ function FooterVariant({
|
|
|
1567
1575
|
});
|
|
1568
1576
|
case "columns":
|
|
1569
1577
|
return /*#__PURE__*/jsxs(ColumnsFooter, {
|
|
1578
|
+
$bg: backgroundColor,
|
|
1570
1579
|
children: [/*#__PURE__*/jsxs(ColumnsGrid, {
|
|
1571
1580
|
children: [/*#__PURE__*/jsxs(ColumnBox, {
|
|
1572
1581
|
children: [/*#__PURE__*/jsx("h3", {
|
|
@@ -1627,6 +1636,7 @@ function FooterVariant({
|
|
|
1627
1636
|
});
|
|
1628
1637
|
case "centered":
|
|
1629
1638
|
return /*#__PURE__*/jsx(CenteredFooter, {
|
|
1639
|
+
$bg: backgroundColor,
|
|
1630
1640
|
children: /*#__PURE__*/jsxs(CenteredContent, {
|
|
1631
1641
|
children: [/*#__PURE__*/jsx(CenteredLogo, {
|
|
1632
1642
|
children: footerData.logo
|