@zenpatient-org/healthspan-marketing-ui 0.2.19 → 0.2.20

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.
@@ -40,3 +40,7 @@
40
40
  .active[data-type='other'] {
41
41
  background: linear-gradient(93deg, var(--color-bg-neutral-medium) 40.44%, #888 160.95%);
42
42
  }
43
+
44
+ .active[data-type='lilac'] {
45
+ background: linear-gradient(93deg, var(--color-bg-fill-brand-lilac) 40.44%, var(--color-lilac-400) 160.95%);
46
+ }
@@ -4,7 +4,8 @@ export declare enum EAnchorLinksTypes {
4
4
  ENERGY = "energy",
5
5
  SENESCENCE = "senescence",
6
6
  METABOLISM = "metabolism",
7
- OTHER = "other"
7
+ OTHER = "other",
8
+ LILAC = "lilac"
8
9
  }
9
10
  export type TAnchorLink = {
10
11
  label: string;
@@ -45,6 +45,14 @@
45
45
  color: var(--color-text-primary-inverted);
46
46
  }
47
47
 
48
+ .root[data-color='lilac'] {
49
+ background-color: var(--color-bg-fill-brand-lilac);
50
+ }
51
+
52
+ .root[data-color='lilac-gradient'] {
53
+ background: linear-gradient(90deg, var(--color-lilac-500) -2.53%, var(--color-lilac-400) 54.58%, var(--color-lilac-300) 94.38%, var(--color-lilac-200) 121.21%);
54
+ }
55
+
48
56
  .labelSm {
49
57
  font-family: var(--font-default), sans-serif;
50
58
  line-height: var(--line-height-xs);
@@ -1,5 +1,5 @@
1
1
  export type LabelSize = 'sm' | 'lg';
2
- export type LabelColor = 'black' | 'grey' | 'white' | 'solar' | 'indigo' | 'orchre' | 'alpha-white';
2
+ export type LabelColor = 'black' | 'grey' | 'white' | 'solar' | 'indigo' | 'orchre' | 'alpha-white' | 'lilac' | 'lilac-gradient';
3
3
  export type LabelProps = {
4
4
  children: string;
5
5
  color: LabelColor;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("../../assets/svg/badge-icon.svg.cjs.js"),t=require("../../src/components/TypeBadge/typeBadge.module.css");var n=(e=>(e.SENESCENCE="senescence",e.SUPPLEMENTS="supplements",e.OUTLINE="outline",e.ENERGY="energy",e.METABOLISM="metabolism",e.LABS="labs",e))(n||{});const r=({type:e="senescence"})=>s.jsx("div",{className:t.typeBadge,"data-type":e,children:s.jsx(c.default,{className:t.badgeIcon})});exports.ETypeBadge=n;exports.TypeBadge=r;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("../../assets/svg/badge-icon.svg.cjs.js"),t=require("../../src/components/TypeBadge/typeBadge.module.css");var n=(e=>(e.SENESCENCE="senescence",e.SUPPLEMENTS="supplements",e.OUTLINE="outline",e.ENERGY="energy",e.METABOLISM="metabolism",e.LABS="labs",e.LILAC="lilac",e))(n||{});const r=({type:e="senescence"})=>s.jsx("div",{className:t.typeBadge,"data-type":e,children:s.jsx(c.default,{className:t.badgeIcon})});exports.ETypeBadge=n;exports.TypeBadge=r;
@@ -4,7 +4,8 @@ export declare enum ETypeBadge {
4
4
  OUTLINE = "outline",
5
5
  ENERGY = "energy",
6
6
  METABOLISM = "metabolism",
7
- LABS = "labs"
7
+ LABS = "labs",
8
+ LILAC = "lilac"
8
9
  }
9
10
  export type TypeBadgeProps = {
10
11
  type?: ETypeBadge;
@@ -1,12 +1,12 @@
1
- import { jsx as s } from "react/jsx-runtime";
1
+ import { jsx as e } from "react/jsx-runtime";
2
2
  import n from "../../assets/svg/badge-icon.svg.es.js";
3
3
  import t from "../../components/TypeBadge/typeBadge.module.css";
4
- var o = /* @__PURE__ */ ((e) => (e.SENESCENCE = "senescence", e.SUPPLEMENTS = "supplements", e.OUTLINE = "outline", e.ENERGY = "energy", e.METABOLISM = "metabolism", e.LABS = "labs", e))(o || {});
5
- const a = ({
6
- type: e = "senescence"
4
+ var o = /* @__PURE__ */ ((s) => (s.SENESCENCE = "senescence", s.SUPPLEMENTS = "supplements", s.OUTLINE = "outline", s.ENERGY = "energy", s.METABOLISM = "metabolism", s.LABS = "labs", s.LILAC = "lilac", s))(o || {});
5
+ const l = ({
6
+ type: s = "senescence"
7
7
  /* SENESCENCE */
8
- }) => /* @__PURE__ */ s("div", { className: t.typeBadge, "data-type": e, children: /* @__PURE__ */ s(n, { className: t.badgeIcon }) });
8
+ }) => /* @__PURE__ */ e("div", { className: t.typeBadge, "data-type": s, children: /* @__PURE__ */ e(n, { className: t.badgeIcon }) });
9
9
  export {
10
10
  o as ETypeBadge,
11
- a as TypeBadge
11
+ l as TypeBadge
12
12
  };
@@ -35,6 +35,10 @@
35
35
  background-color: var(--color-sage-200);
36
36
  }
37
37
 
38
+ .typeBadge[data-type='lilac'] {
39
+ background-color: var(--color-lilac-300);
40
+ }
41
+
38
42
  .badgeIcon {
39
43
  fill: var(--color-bg-base-dark);
40
44
  }
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("../../../../utils/cn/cn.cjs.js"),n=require("../../../../utils/formatUnits/formatUnits.cjs.js"),t=require("../../../../src/modules/IndividualProductCard/components/PlanCard/planCard.module.css"),d=require("../../../../components/Label/Label.cjs.js"),m=require("../../../../components/RadioButton/RadioButton.cjs.js"),a=require("../../../../components/Typography/Typography.cjs.js"),o=require("../../../../components/Icon/Icon.cjs.js"),c=require("../../../../components/Icon/constants.cjs.js"),u=({plan:e,isActive:r,onSelect:l})=>s.jsxs("button",{className:i.cn(t.root,r&&t.active),onClick:()=>l(e.id),children:[e.featured&&s.jsx(d.Label,{color:"black",className:t.label,size:"sm",children:"Most popular"}),s.jsxs("div",{className:t.planContainer,children:[s.jsxs("div",{className:t.planInfo,children:[s.jsx(m.RadioButton,{checked:r}),s.jsxs("div",{className:t.planDetails,children:[s.jsx(a.Typography,{as:"h4",defaultVariant:"bodySm",emphasis:!0,align:"left",children:e.label}),!!e.savingsPercentage&&s.jsxs(a.Typography,{as:"p",defaultVariant:"labelXs",weight:"regular",className:t.savings,children:["Save ",e.savingsPercentage,"%"]})]})]}),s.jsxs("div",{className:t.priceDetails,children:[!!e.monthlyPrice&&s.jsxs(a.Typography,{as:"p",defaultVariant:"bodySm",weight:"regular",className:t.description,children:[n.formatUnits(e.monthlyPrice,"usd",0),"/mo"]}),s.jsxs("div",{className:i.cn(t.priceContainer),children:[e.price!==e.totalPrice&&s.jsx(a.Typography,{as:"p",defaultVariant:"labelXs",weight:"regular",className:t.totalPrice,children:n.formatUnits(e.price,"usd",0)}),s.jsx(a.Typography,{as:"p",defaultVariant:!e.monthlyPrice&&e.price===e.totalPrice?"bodySm":"labelXs",className:i.cn(t.price,{[t.description]:!e.monthlyPrice&&e.price===e.totalPrice}),children:n.formatUnits(e.totalPrice,"usd",0)})]})]})]}),!!e.duration&&e.duration!=="one-time"&&s.jsx("div",{className:i.cn(t.benefitsContainer,r&&t.benefitsActive),children:s.jsxs("div",{className:t.benefitsContent,children:[s.jsxs("div",{className:t.benefit,children:[s.jsx(o.Icon,{name:c.EIconName.ARROW_RETURN,className:t.benefitIcon}),s.jsxs(a.Typography,{as:"p",defaultVariant:"bodyXs",children:["Delivered every"," ",e.durationAmount&&e.durationAmount>1?`${e.durationAmount} months`:"month"]})]}),s.jsxs("div",{className:t.benefit,children:[s.jsx(o.Icon,{name:c.EIconName.CALENDAR,className:t.benefitIcon}),s.jsx(a.Typography,{as:"p",defaultVariant:"bodyXs",children:"Modify or cancel anytime"})]})]})})]});exports.PlanCard=u;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("../../../../utils/cn/cn.cjs.js"),n=require("../../../../utils/formatUnits/formatUnits.cjs.js"),t=require("../../../../src/modules/IndividualProductCard/components/PlanCard/planCard.module.css"),d=require("../../../../components/Label/Label.cjs.js"),m=require("../../../../components/RadioButton/RadioButton.cjs.js"),a=require("../../../../components/Typography/Typography.cjs.js"),o=require("../../../../components/Icon/Icon.cjs.js"),c=require("../../../../components/Icon/constants.cjs.js"),u=({plan:e,isActive:i,onSelect:l})=>s.jsxs("button",{className:r.cn(t.root,i&&t.active),onClick:()=>l(e.id),children:[e.featured&&s.jsx(d.Label,{color:e.featuredLabelColor||"black",className:t.label,size:"sm",children:"Most popular"}),s.jsxs("div",{className:t.planContainer,children:[s.jsxs("div",{className:t.planInfo,children:[s.jsx(m.RadioButton,{checked:i}),s.jsxs("div",{className:t.planDetails,children:[s.jsx(a.Typography,{as:"h4",defaultVariant:"bodySm",emphasis:!0,align:"left",children:e.label}),!!e.savingsPercentage&&s.jsxs(a.Typography,{as:"p",defaultVariant:"labelXs",weight:"regular",className:t.savings,children:["Save ",e.savingsPercentage,"%"]})]})]}),s.jsxs("div",{className:t.priceDetails,children:[!!e.monthlyPrice&&s.jsxs(a.Typography,{as:"p",defaultVariant:"bodySm",weight:"regular",className:t.description,children:[n.formatUnits(e.monthlyPrice,"usd",0),"/mo"]}),s.jsxs("div",{className:r.cn(t.priceContainer),children:[e.price!==e.totalPrice&&s.jsx(a.Typography,{as:"p",defaultVariant:"labelXs",weight:"regular",className:t.totalPrice,children:n.formatUnits(e.price,"usd",0)}),s.jsx(a.Typography,{as:"p",defaultVariant:!e.monthlyPrice&&e.price===e.totalPrice?"bodySm":"labelXs",className:r.cn(t.price,{[t.description]:!e.monthlyPrice&&e.price===e.totalPrice}),children:n.formatUnits(e.totalPrice,"usd",0)})]})]})]}),!!e.duration&&e.duration!=="one-time"&&s.jsx("div",{className:r.cn(t.benefitsContainer,i&&t.benefitsActive),children:s.jsxs("div",{className:t.benefitsContent,children:[s.jsxs("div",{className:t.benefit,children:[s.jsx(o.Icon,{name:c.EIconName.ARROW_RETURN,className:t.benefitIcon}),s.jsxs(a.Typography,{as:"p",defaultVariant:"bodyXs",children:["Delivered every"," ",e.durationAmount&&e.durationAmount>1?`${e.durationAmount} months`:"month"]})]}),s.jsxs("div",{className:t.benefit,children:[s.jsx(o.Icon,{name:c.EIconName.CALENDAR,className:t.benefitIcon}),s.jsx(a.Typography,{as:"p",defaultVariant:"bodyXs",children:"Modify or cancel anytime"})]})]})})]});exports.PlanCard=u;
@@ -9,7 +9,7 @@ import { Typography as t } from "../../../../components/Typography/Typography.es
9
9
  import { Icon as n } from "../../../../components/Icon/Icon.es.js";
10
10
  import { EIconName as l } from "../../../../components/Icon/constants.es.js";
11
11
  const C = ({ plan: e, isActive: o, onSelect: d }) => /* @__PURE__ */ r("button", { className: s(i.root, o && i.active), onClick: () => d(e.id), children: [
12
- e.featured && /* @__PURE__ */ a(m, { color: "black", className: i.label, size: "sm", children: "Most popular" }),
12
+ e.featured && /* @__PURE__ */ a(m, { color: e.featuredLabelColor || "black", className: i.label, size: "sm", children: "Most popular" }),
13
13
  /* @__PURE__ */ r("div", { className: i.planContainer, children: [
14
14
  /* @__PURE__ */ r("div", { className: i.planInfo, children: [
15
15
  /* @__PURE__ */ a(h, { checked: o }),
@@ -1,4 +1,5 @@
1
1
  import { ETypeBadge } from '../../components/TypeBadge';
2
+ import { LabelColor } from '../../components/Label';
2
3
 
3
4
  export type TProductFeature = {
4
5
  label: string;
@@ -16,4 +17,5 @@ export type TProductPlan = {
16
17
  duration?: 'one-time' | 'day' | 'month' | 'year';
17
18
  durationAmount?: number;
18
19
  featured?: boolean;
20
+ featuredLabelColor?: LabelColor;
19
21
  };
@@ -1 +1 @@
1
- html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--color-black: #000000;--color-white: #ffffff;--color-midnight-50: #f1f0f4;--color-midnight-100: #e3e1ea;--color-midnight-200: #aaa6bf;--color-midnight-300: #5b5676;--color-midnight-400: #2e2b3b;--color-midnight-500: #111016;--color-navy-50: #e9f5fc;--color-navy-100: #d2eaf9;--color-navy-200: #79c0ec;--color-navy-300: #1a78b2;--color-navy-400: #0d3c59;--color-navy-500: #092a3e;--color-copper-50: #f8f1ec;--color-copper-100: #f1e3da;--color-copper-200: #d5ac90;--color-copper-300: #955d37;--color-copper-400: #835231;--color-copper-500: #4a2e1c;--color-orchre-50: #fff5e6;--color-orchre-100: #feeacd;--color-orchre-200: #fcc169;--color-orchre-300: #fba626;--color-orchre-400: #c87a04;--color-orchre-500: #643d02;--color-indigo-50: #eaf2fa;--color-indigo-100: #cadff3;--color-indigo-200: #81b1e2;--color-indigo-300: #5999d9;--color-indigo-400: #2666a6;--color-indigo-500: #133353;--color-sage-50: #f1f8ed;--color-sage-100: #e3f1da;--color-sage-200: #a5d088;--color-sage-300: #90c56d;--color-sage-400: #5d923a;--color-sage-500: #2f491d;--color-solar-50: #fffce6;--color-solar-100: #fffacc;--color-solar-200: #fef38e;--color-solar-300: #feef67;--color-solar-400: #cab602;--color-solar-500: #655b01;--color-ivory-50: #fbf3e9;--color-ivory-100: #fbf1e6;--color-ivory-200: #f1cda7;--color-ivory-300: #e39b4f;--color-ivory-400: #b0681c;--color-ivory-500: #58340e;--color-neutral-100: #f7f7f7;--color-neutral-200: #e5e5e5;--color-neutral-300: #adadad;--color-neutral-400: #888888;--color-neutral-500: #676767;--color-neutral-900: #1a1a1a;--color-urgent-red-100: #ffe2e1;--color-urgent-red-200: #ffcabe;--color-urgent-red-300: #ff5850;--color-urgent-red-400: #e4271d;--color-urgent-red-500: #841d18;--color-calm-green-100: #e1f7e6;--color-calm-green-200: #beecc8;--color-calm-green-300: #56d391;--color-calm-green-400: #0d9051;--color-calm-green-500: #084b2e;--color-powder-blue-100: #deecfa;--color-powder-blue-200: #c4e0f8;--color-powder-blue-300: #5a9bea;--color-powder-blue-400: #3375dc;--color-powder-blue-500: #264582;--color-heal-yellow-100: #fff8c8;--color-heal-yellow-200: #ffec88;--color-heal-yellow-300: #f6c64f;--color-heal-yellow-400: #eeab04;--color-heal-yellow-500: #733b10;--color-cell-pink-100: #fee5f1;--color-cell-pink-200: #fed7ea;--color-cell-pink-300: #ff81b8;--color-cell-pink-400: #eb1664;--color-cell-pink-500: #8d0e37;--color-bg-base-light: var(--color-white);--color-bg-base-dark: var(--color-black);--color-bg-neutral-light: var(--color-neutral-100);--color-bg-neutral-medium: var(--color-neutral-200);--color-bg-success: var(--color-calm-green-100);--color-bg-warning: var(--color-heal-yellow-100);--color-bg-danger: var(--color-urgent-red-300);--color-bg-info: var(--color-powder-blue-100);--color-bg-supportive: var(--color-cell-pink-100);--color-bg-success-fill: var(--color-calm-green-300);--color-bg-warning-fill: var(--color-heal-yellow-300);--color-bg-danger-fill: var(--color-urgent-red-300);--color-bg-info-fill: var(--color-powder-blue-300);--color-bg-supportive-fill: var(--color-cell-pink-300);--color-bg-fill-primary: var(--color-black);--color-bg-fill-brand-solar: var(--color-solar-200);--color-bg-fill-brand-indigo: var(--color-indigo-200);--color-bg-fill-brand-sage: var(--color-sage-200);--color-bg-fill-brand-orchre: var(--color-orchre-300);--color-bg-fill-brand-disabled: var(--color-neutral-400);--color-bg-fill-brand-inverse: var(--color-white);--color-bg-fill-neutral-dark: var(--color-neutral-900);--color-bg-fill-alpha-white-10: rgba(255, 255, 255, .1);--color-bg-fill-alpha-white-20: rgba(255, 255, 255, .2);--color-bg-fill-alpha-black-10: rgba(0, 0, 0, .1);--color-bg-fill-alpha-black-40: rgba(0, 0, 0, .4);--color-text-primary: var(--color-black);--color-text-primary-brand-solar: var(--color-solar-200);--color-text-primary-brand-indigo: var(--color-indigo-300);--color-text-primary-disabled: var(--color-neutral-300);--color-text-primary-inverted: var(--color-white);--color-text-secondary: var(--color-neutral-500);--color-text-secondary-hover: var(--color-neutral-400);--color-text-secondary-disabled: var(--color-neutral-300);--color-text-secondary-inverted: var(--color-neutral-200);--color-text-success-dark: var(--color-calm-green-500);--color-text-success-light: var(--color-calm-green-400);--color-text-success-hover: var(--color-calm-green-300);--color-text-success-disabled: var(--color-calm-green-200);--color-text-warning-dark: var(--color-heal-yellow-500);--color-text-warning-light: var(--color-heal-yellow-400);--color-text-warning-hover: var(--color-heal-yellow-300);--color-text-warning-disabled: var(--color-heal-yellow-200);--color-text-danger-dark: var(--color-urgent-red-500);--color-text-danger-light: var(--color-urgent-red-400);--color-text-danger-hover: var(--color-urgent-red-300);--color-text-danger-disabled: var(--color-urgent-red-200);--color-text-info-dark: var(--color-powder-blue-500);--color-text-info-light: var(--color-powder-blue-400);--color-text-info-hover: var(--color-powder-blue-300);--color-text-info-disabled: var(--color-powder-blue-200);--color-text-supportive-dark: var(--color-cell-pink-500);--color-text-supportive-light: var(--color-cell-pink-400);--color-text-supportive-hover: var(--color-cell-pink-300);--color-text-supportive-disabled: var(--color-cell-pink-200);--border-color-light: var(--color-neutral-200);--border-color-medium: var(--color-neutral-300);--border-color-dark: var(--color-black);--border-color-indigo: var(--color-indigo-200);--border-color-solar: var(--color-solar-200);--border-color-invert: var(--color-white);--border-color-alpha-white-10: rgba(255, 255, 255, .1);--border-color-alpha-white-20: rgba(255, 255, 255, .2);--border-color-alpha-white-50: rgba(255, 255, 255, .5);--border-color-alpha-black-10: rgba(0, 0, 0, .1);--border-color-alpha-black-20: rgba(0, 0, 0, .2);--border-color-success: var(--color-calm-green-300);--border-color-success-en: var(--color-calm-green-500);--border-color-warning: var(--color-heal-yellow-300);--border-color-warning-en: var(--color-heal-yellow-500);--border-color-danger: var(--color-urgent-red-300);--border-color-danger-en: var(--color-urgent-red-500);--border-color-info: var(--color-powder-blue-300);--border-color-info-en: var(--color-powder-blue-500);--border-color-decorative: var(--color-cell-pink-300);--border-color-decorative-en: var(--color-cell-pink-500)}:root{--font-default: "Suisse Intl", sans-serif;--font-decorative: "Soehne Mono", monospace;--font-size-xxs: 10px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-xxl: 24px;--font-size-heading-xxs: 18px;--font-size-heading-xs: 20px;--font-size-heading-sm: 24px;--font-size-heading-md: 28px;--font-size-heading-lg: 32px;--font-size-heading-xl: 40px;--font-size-display-xs: 48px;--font-size-display-sm: 56px;--font-size-display-md: 64px;--font-size-display-lg: 96px;--font-size-display-xl: 120px;--line-height-xxs: .9;--line-height-xs: 1;--line-height-sm: 1.1;--line-height-md: 1.2;--line-height-lg: 1.35;--line-height-xl: 1.4;--line-height-xxl: 1.5;--letter-spacing-negative-xxl: -.06em;--letter-spacing-negative-xl: -.04em;--letter-spacing-negative-lg: -.03em;--letter-spacing-negative-md: -.02em;--letter-spacing-negative-sm: -.01em;--letter-spacing-null: 0;--letter-spacing-sm: .01em;--letter-spacing-md: .02em;--letter-spacing-lg: .03em;--letter-spacing-xl: .05em;--letter-spacing-xxl: .1em;--font-weight-extra-light: 200;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semi-bold: 600;--font-weight-bold: 700;--font-weight-extra-bold: 800}:root{--border-radius-none: 0;--border-radius-xxs: 4px;--border-radius-xs: 8px;--border-radius-sm: 12px;--border-radius-md: 16px;--border-radius-lg: 24px;--border-radius-xl: 40px;--border-radius-xxl: 48px;--border-radius-xxxl: 120px;--border-radius-full: 999px;--border-width-sm: 1px;--border-width-md: 2px}:root{--spacing-0: 0;--spacing-4: 4px;--spacing-8: 8px;--spacing-12: 12px;--spacing-14: 14px;--spacing-16: 16px;--spacing-18: 18px;--spacing-20: 20px;--spacing-24: 24px;--spacing-28: 28px;--spacing-32: 32px;--spacing-36: 36px;--spacing-40: 40px;--spacing-48: 48px;--spacing-52: 52px;--spacing-56: 56px;--spacing-64: 64px;--spacing-72: 72px;--spacing-80: 80px;--spacing-88: 88px;--spacing-96: 96px;--spacing-104: 104px;--spacing-112: 112px;--spacing-120: 120px;--spacing-180: 180px;--content-max-width: 1440px;--content-max-height: 1285px}html{scroll-behavior:smooth}
1
+ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--color-black: #000000;--color-white: #ffffff;--color-midnight-50: #f1f0f4;--color-midnight-100: #e3e1ea;--color-midnight-200: #aaa6bf;--color-midnight-300: #5b5676;--color-midnight-400: #2e2b3b;--color-midnight-500: #111016;--color-navy-50: #e9f5fc;--color-navy-100: #d2eaf9;--color-navy-200: #79c0ec;--color-navy-300: #1a78b2;--color-navy-400: #0d3c59;--color-navy-500: #092a3e;--color-copper-50: #f8f1ec;--color-copper-100: #f1e3da;--color-copper-200: #d5ac90;--color-copper-300: #955d37;--color-copper-400: #835231;--color-copper-500: #4a2e1c;--color-orchre-50: #fff5e6;--color-orchre-100: #feeacd;--color-orchre-200: #fcc169;--color-orchre-300: #fba626;--color-orchre-400: #c87a04;--color-orchre-500: #643d02;--color-indigo-50: #eaf2fa;--color-indigo-100: #cadff3;--color-indigo-200: #81b1e2;--color-indigo-300: #5999d9;--color-indigo-400: #2666a6;--color-indigo-500: #133353;--color-sage-50: #f1f8ed;--color-sage-100: #e3f1da;--color-sage-200: #a5d088;--color-sage-300: #90c56d;--color-sage-400: #5d923a;--color-sage-500: #2f491d;--color-solar-50: #fffce6;--color-solar-100: #fffacc;--color-solar-200: #fef38e;--color-solar-300: #feef67;--color-solar-400: #cab602;--color-solar-500: #655b01;--color-ivory-50: #fbf3e9;--color-ivory-100: #fbf1e6;--color-ivory-200: #f1cda7;--color-ivory-300: #e39b4f;--color-ivory-400: #b0681c;--color-ivory-500: #58340e;--color-lilac-50: #d6cefb;--color-lilac-100: #d6cefb;--color-lilac-200: #d6cefb;--color-lilac-300: #bdb0f8;--color-lilac-400: #625793;--color-lilac-500: #0a151c;--color-neutral-100: #f7f7f7;--color-neutral-200: #e5e5e5;--color-neutral-300: #adadad;--color-neutral-400: #888888;--color-neutral-500: #676767;--color-neutral-900: #1a1a1a;--color-urgent-red-100: #ffe2e1;--color-urgent-red-200: #ffcabe;--color-urgent-red-300: #ff5850;--color-urgent-red-400: #e4271d;--color-urgent-red-500: #841d18;--color-calm-green-100: #e1f7e6;--color-calm-green-200: #beecc8;--color-calm-green-300: #56d391;--color-calm-green-400: #0d9051;--color-calm-green-500: #084b2e;--color-powder-blue-100: #deecfa;--color-powder-blue-200: #c4e0f8;--color-powder-blue-300: #5a9bea;--color-powder-blue-400: #3375dc;--color-powder-blue-500: #264582;--color-heal-yellow-100: #fff8c8;--color-heal-yellow-200: #ffec88;--color-heal-yellow-300: #f6c64f;--color-heal-yellow-400: #eeab04;--color-heal-yellow-500: #733b10;--color-cell-pink-100: #fee5f1;--color-cell-pink-200: #fed7ea;--color-cell-pink-300: #ff81b8;--color-cell-pink-400: #eb1664;--color-cell-pink-500: #8d0e37;--color-bg-base-light: var(--color-white);--color-bg-base-dark: var(--color-black);--color-bg-neutral-light: var(--color-neutral-100);--color-bg-neutral-medium: var(--color-neutral-200);--color-bg-success: var(--color-calm-green-100);--color-bg-warning: var(--color-heal-yellow-100);--color-bg-danger: var(--color-urgent-red-300);--color-bg-info: var(--color-powder-blue-100);--color-bg-supportive: var(--color-cell-pink-100);--color-bg-success-fill: var(--color-calm-green-300);--color-bg-warning-fill: var(--color-heal-yellow-300);--color-bg-danger-fill: var(--color-urgent-red-300);--color-bg-info-fill: var(--color-powder-blue-300);--color-bg-supportive-fill: var(--color-cell-pink-300);--color-bg-fill-primary: var(--color-black);--color-bg-fill-brand-solar: var(--color-solar-200);--color-bg-fill-brand-indigo: var(--color-indigo-200);--color-bg-fill-brand-sage: var(--color-sage-200);--color-bg-fill-brand-orchre: var(--color-orchre-300);--color-bg-fill-brand-lilac: var(--color-lilac-300);--color-bg-fill-brand-disabled: var(--color-neutral-400);--color-bg-fill-brand-inverse: var(--color-white);--color-bg-fill-neutral-dark: var(--color-neutral-900);--color-bg-fill-alpha-white-10: rgba(255, 255, 255, .1);--color-bg-fill-alpha-white-20: rgba(255, 255, 255, .2);--color-bg-fill-alpha-black-10: rgba(0, 0, 0, .1);--color-bg-fill-alpha-black-40: rgba(0, 0, 0, .4);--color-text-primary: var(--color-black);--color-text-primary-brand-solar: var(--color-solar-200);--color-text-primary-brand-indigo: var(--color-indigo-300);--color-text-primary-brand-lilac: var(--color-lilac-300);--color-text-primary-disabled: var(--color-neutral-300);--color-text-primary-inverted: var(--color-white);--color-text-secondary: var(--color-neutral-500);--color-text-secondary-hover: var(--color-neutral-400);--color-text-secondary-disabled: var(--color-neutral-300);--color-text-secondary-inverted: var(--color-neutral-200);--color-text-success-dark: var(--color-calm-green-500);--color-text-success-light: var(--color-calm-green-400);--color-text-success-hover: var(--color-calm-green-300);--color-text-success-disabled: var(--color-calm-green-200);--color-text-warning-dark: var(--color-heal-yellow-500);--color-text-warning-light: var(--color-heal-yellow-400);--color-text-warning-hover: var(--color-heal-yellow-300);--color-text-warning-disabled: var(--color-heal-yellow-200);--color-text-danger-dark: var(--color-urgent-red-500);--color-text-danger-light: var(--color-urgent-red-400);--color-text-danger-hover: var(--color-urgent-red-300);--color-text-danger-disabled: var(--color-urgent-red-200);--color-text-info-dark: var(--color-powder-blue-500);--color-text-info-light: var(--color-powder-blue-400);--color-text-info-hover: var(--color-powder-blue-300);--color-text-info-disabled: var(--color-powder-blue-200);--color-text-supportive-dark: var(--color-cell-pink-500);--color-text-supportive-light: var(--color-cell-pink-400);--color-text-supportive-hover: var(--color-cell-pink-300);--color-text-supportive-disabled: var(--color-cell-pink-200);--border-color-light: var(--color-neutral-200);--border-color-medium: var(--color-neutral-300);--border-color-dark: var(--color-black);--border-color-indigo: var(--color-indigo-200);--border-color-solar: var(--color-solar-200);--border-color-lilac: var(--color-lilac-200);--border-color-invert: var(--color-white);--border-color-alpha-white-10: rgba(255, 255, 255, .1);--border-color-alpha-white-20: rgba(255, 255, 255, .2);--border-color-alpha-white-50: rgba(255, 255, 255, .5);--border-color-alpha-black-10: rgba(0, 0, 0, .1);--border-color-alpha-black-20: rgba(0, 0, 0, .2);--border-color-success: var(--color-calm-green-300);--border-color-success-en: var(--color-calm-green-500);--border-color-warning: var(--color-heal-yellow-300);--border-color-warning-en: var(--color-heal-yellow-500);--border-color-danger: var(--color-urgent-red-300);--border-color-danger-en: var(--color-urgent-red-500);--border-color-info: var(--color-powder-blue-300);--border-color-info-en: var(--color-powder-blue-500);--border-color-decorative: var(--color-cell-pink-300);--border-color-decorative-en: var(--color-cell-pink-500)}:root{--font-default: "Suisse Intl", sans-serif;--font-decorative: "Soehne Mono", monospace;--font-size-xxs: 10px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-xxl: 24px;--font-size-heading-xxs: 18px;--font-size-heading-xs: 20px;--font-size-heading-sm: 24px;--font-size-heading-md: 28px;--font-size-heading-lg: 32px;--font-size-heading-xl: 40px;--font-size-display-xs: 48px;--font-size-display-sm: 56px;--font-size-display-md: 64px;--font-size-display-lg: 96px;--font-size-display-xl: 120px;--line-height-xxs: .9;--line-height-xs: 1;--line-height-sm: 1.1;--line-height-md: 1.2;--line-height-lg: 1.35;--line-height-xl: 1.4;--line-height-xxl: 1.5;--letter-spacing-negative-xxl: -.06em;--letter-spacing-negative-xl: -.04em;--letter-spacing-negative-lg: -.03em;--letter-spacing-negative-md: -.02em;--letter-spacing-negative-sm: -.01em;--letter-spacing-null: 0;--letter-spacing-sm: .01em;--letter-spacing-md: .02em;--letter-spacing-lg: .03em;--letter-spacing-xl: .05em;--letter-spacing-xxl: .1em;--font-weight-extra-light: 200;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semi-bold: 600;--font-weight-bold: 700;--font-weight-extra-bold: 800}:root{--border-radius-none: 0;--border-radius-xxs: 4px;--border-radius-xs: 8px;--border-radius-sm: 12px;--border-radius-md: 16px;--border-radius-lg: 24px;--border-radius-xl: 40px;--border-radius-xxl: 48px;--border-radius-xxxl: 120px;--border-radius-full: 999px;--border-width-sm: 1px;--border-width-md: 2px}:root{--spacing-0: 0;--spacing-4: 4px;--spacing-8: 8px;--spacing-12: 12px;--spacing-14: 14px;--spacing-16: 16px;--spacing-18: 18px;--spacing-20: 20px;--spacing-24: 24px;--spacing-28: 28px;--spacing-32: 32px;--spacing-36: 36px;--spacing-40: 40px;--spacing-48: 48px;--spacing-52: 52px;--spacing-56: 56px;--spacing-64: 64px;--spacing-72: 72px;--spacing-80: 80px;--spacing-88: 88px;--spacing-96: 96px;--spacing-104: 104px;--spacing-112: 112px;--spacing-120: 120px;--spacing-180: 180px;--content-max-width: 1440px;--content-max-height: 1285px}html{scroll-behavior:smooth}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zenpatient-org/healthspan-marketing-ui",
3
- "version": "0.2.19",
3
+ "version": "0.2.20",
4
4
  "description": "Design system",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.es.js",