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 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
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "styled-hairomin",
3
- "version": "0.3.4",
3
+ "version": "0.3.8",
4
4
  "type": "module",
5
5
  "main": "./dist/index.cjs.js",
6
6
  "module": "./dist/index.esm.js",