@axos-web-dev/shared-components 1.0.100-dev.73-compact-executive-bio → 1.0.100-dev.73-compact-executive-bio.2

package/dist/ExecutiveBio/ExecutiveBio.css.d.ts

@@ -94,21 +94,77 @@ export declare const headshot: string;
 export declare const img_area: string;
 export declare const media: string;
 export declare const person: string;
+export declare const components: import('@vanilla-extract/recipes').RuntimeFn<{
+    columns: {
+        1: {
+            gridTemplateColumns: "1fr";
+        };
+        2: {
+            gridTemplateColumns: "repeat(2, 1fr)";
+            width: "min(800px, 100%)";
+            "@media": {
+                "(max-width: 1023px)": {
+                    width: "min(675px, 100%)";
+                };
+                "(max-width: 768px)": {
+                    gridTemplateColumns: "1fr";
+                    width: "min(350px, calc(100% - 2rem))";
+                };
+            };
+        };
+        3: {
+            gridTemplateColumns: "repeat(3, 1fr)";
+            "@media": {
+                "(max-width: 1175px)": {
+                    gridTemplateColumns: "repeat(2, 1fr)";
+                    width: "min(840px, 100%)";
+                };
+                "(max-width: 1023px)": {
+                    width: "min(675px, 100%)";
+                };
+                "(max-width: 768px)": {
+                    gridTemplateColumns: "1fr";
+                    width: "min(350px, calc(100% - 2rem))";
+                };
+            };
+        };
+        4: {
+            gridTemplateColumns: "repeat(4, 1fr)";
+            "@media": {
+                "(max-width: 1175px)": {
+                    gridTemplateColumns: "repeat(2, 1fr)";
+                    width: "min(840px, 100%)";
+                };
+                "(max-width: 1023px)": {
+                    width: "min(675px, 100%)";
+                };
+                "(max-width: 768px)": {
+                    gridTemplateColumns: "1fr";
+                    width: "min(350px, calc(100% - 2rem))";
+                };
+            };
+        };
+    };
+}>;
 export declare const shift: string;
 export declare const bio_section_text: string;
 export declare const section_theme: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
             background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         secondary: {
             background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         tertiary: {
             background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         quaternary: {
             background: `var(--${string})`;
+            color: `var(--${string})`;
         };
     };
 }>;
@@ -128,7 +184,6 @@ export declare const header_theme: import('@vanilla-extract/recipes').RuntimeFn<
         };
     };
 }>;
-export declare const components: string;
 export declare const details: string;
 export declare const url_row: string;
 export declare const flexColumn: string;

package/dist/ExecutiveBio/ExecutiveBio.css.js

@@ -21,38 +21,38 @@ var headshot = "txcb8dw";
 var img_area = "txcb8dx";
 var media = "txcb8dy";
 var person = "txcb8dz";
-var shift = "txcb8d10";
-var bio_section_text = "txcb8d11";
-var section_theme = createRuntimeFn({ defaultClassName: "txcb8d12", variantClassNames: { variant: { primary: "txcb8d13", secondary: "txcb8d14", tertiary: "txcb8d15", quaternary: "txcb8d16" } }, defaultVariants: {}, compoundVariants: [] });
-var header_theme = createRuntimeFn({ defaultClassName: "txcb8d17", variantClassNames: { variant: { primary: "txcb8d18", secondary: "txcb8d19", tertiary: "txcb8d1a", quaternary: "txcb8d1b" } }, defaultVariants: {}, compoundVariants: [] });
-var components = "txcb8d1c";
-var details = "txcb8d1d";
-var url_row = "txcb8d1e";
-var flexColumn = "txcb8d1f";
-var ceoSection = createRuntimeFn({ defaultClassName: "txcb8d1g", variantClassNames: { variant: { primary: "txcb8d1h", secondary: "txcb8d1i", tertiary: "txcb8d1j", quaternary: "txcb8d1k" } }, defaultVariants: {}, compoundVariants: [] });
-var ceoContainer = "txcb8d1l";
-var ceoWrapper = "txcb8d1m";
-var ceoMedia = "txcb8d1n txcb8d1f";
-var ceoImgWrapper = "txcb8d1o";
-var imgAlignment = "txcb8d1p";
-var highlights = "txcb8d1q txcb8d1f";
-var bulletsHeadline = createRuntimeFn({ defaultClassName: "txcb8d1r", variantClassNames: { variant: { primary: "txcb8d1s", secondary: "txcb8d1t", tertiary: "txcb8d1u", quaternary: "txcb8d1v" } }, defaultVariants: {}, compoundVariants: [] });
-var bulletsWrapper = "txcb8d1w txcb8d1f";
-var ceoContent = "txcb8d1x txcb8d1f";
-var ceoHeader = "txcb8d1y txcb8d1f";
-var ceoPersonalInfo = "txcb8d1z txcb8d1f";
-var ceo_name = createRuntimeFn({ defaultClassName: "txcb8d20", variantClassNames: { variant: { primary: "txcb8d21", secondary: "txcb8d22", tertiary: "txcb8d23", quaternary: "txcb8d24" } }, defaultVariants: {}, compoundVariants: [] });
-var ceo_title = createRuntimeFn({ defaultClassName: "txcb8d25", variantClassNames: { variant: { primary: "txcb8d26", secondary: "txcb8d27", tertiary: "txcb8d28", quaternary: "txcb8d29" } }, defaultVariants: {}, compoundVariants: [] });
-var ceo_contacts = "txcb8d2a";
-var svg_color = createRuntimeFn({ defaultClassName: "txcb8d2b", variantClassNames: { variant: { primary: "txcb8d2c", secondary: "txcb8d2d", tertiary: "txcb8d2e", quaternary: "txcb8d2f" } }, defaultVariants: {}, compoundVariants: [] });
-var ceo_quote = createRuntimeFn({ defaultClassName: "txcb8d2g", variantClassNames: { variant: { primary: "txcb8d2h", secondary: "txcb8d2i", tertiary: "txcb8d2j", quaternary: "txcb8d2k" } }, defaultVariants: {}, compoundVariants: [] });
-var ceo_body = "txcb8d2l";
-var hover = "txcb8d2m";
-var social = "txcb8d2n";
-var tooltip = createRuntimeFn({ defaultClassName: "txcb8d2o", variantClassNames: { variant: { primary: "txcb8d2p", secondary: "txcb8d2q", tertiary: "txcb8d2r", quaternary: "txcb8d2s" } }, defaultVariants: {}, compoundVariants: [] });
-var order_3 = "txcb8d2t";
-var overlay = "txcb8d2u";
-var stroke_color = createRuntimeFn({ defaultClassName: "txcb8d2v", variantClassNames: { variant: { primary: "txcb8d2w", secondary: "txcb8d2x", tertiary: "txcb8d2y", quaternary: "txcb8d2z" } }, defaultVariants: {}, compoundVariants: [] });
+var components = createRuntimeFn({ defaultClassName: "txcb8d10", variantClassNames: { columns: { "1": "txcb8d11", "2": "txcb8d12", "3": "txcb8d13", "4": "txcb8d14" } }, defaultVariants: { columns: 1 }, compoundVariants: [] });
+var shift = "txcb8d15";
+var bio_section_text = "txcb8d16";
+var section_theme = createRuntimeFn({ defaultClassName: "txcb8d17", variantClassNames: { variant: { primary: "txcb8d18", secondary: "txcb8d19", tertiary: "txcb8d1a", quaternary: "txcb8d1b" } }, defaultVariants: {}, compoundVariants: [] });
+var header_theme = createRuntimeFn({ defaultClassName: "txcb8d1c", variantClassNames: { variant: { primary: "txcb8d1d", secondary: "txcb8d1e", tertiary: "txcb8d1f", quaternary: "txcb8d1g" } }, defaultVariants: {}, compoundVariants: [] });
+var details = "txcb8d1h";
+var url_row = "txcb8d1i";
+var flexColumn = "txcb8d1j";
+var ceoSection = createRuntimeFn({ defaultClassName: "txcb8d1k", variantClassNames: { variant: { primary: "txcb8d1l", secondary: "txcb8d1m", tertiary: "txcb8d1n", quaternary: "txcb8d1o" } }, defaultVariants: {}, compoundVariants: [] });
+var ceoContainer = "txcb8d1p";
+var ceoWrapper = "txcb8d1q";
+var ceoMedia = "txcb8d1r txcb8d1j";
+var ceoImgWrapper = "txcb8d1s";
+var imgAlignment = "txcb8d1t";
+var highlights = "txcb8d1u txcb8d1j";
+var bulletsHeadline = createRuntimeFn({ defaultClassName: "txcb8d1v", variantClassNames: { variant: { primary: "txcb8d1w", secondary: "txcb8d1x", tertiary: "txcb8d1y", quaternary: "txcb8d1z" } }, defaultVariants: {}, compoundVariants: [] });
+var bulletsWrapper = "txcb8d20 txcb8d1j";
+var ceoContent = "txcb8d21 txcb8d1j";
+var ceoHeader = "txcb8d22 txcb8d1j";
+var ceoPersonalInfo = "txcb8d23 txcb8d1j";
+var ceo_name = createRuntimeFn({ defaultClassName: "txcb8d24", variantClassNames: { variant: { primary: "txcb8d25", secondary: "txcb8d26", tertiary: "txcb8d27", quaternary: "txcb8d28" } }, defaultVariants: {}, compoundVariants: [] });
+var ceo_title = createRuntimeFn({ defaultClassName: "txcb8d29", variantClassNames: { variant: { primary: "txcb8d2a", secondary: "txcb8d2b", tertiary: "txcb8d2c", quaternary: "txcb8d2d" } }, defaultVariants: {}, compoundVariants: [] });
+var ceo_contacts = "txcb8d2e";
+var svg_color = createRuntimeFn({ defaultClassName: "txcb8d2f", variantClassNames: { variant: { primary: "txcb8d2g", secondary: "txcb8d2h", tertiary: "txcb8d2i", quaternary: "txcb8d2j" } }, defaultVariants: {}, compoundVariants: [] });
+var ceo_quote = createRuntimeFn({ defaultClassName: "txcb8d2k", variantClassNames: { variant: { primary: "txcb8d2l", secondary: "txcb8d2m", tertiary: "txcb8d2n", quaternary: "txcb8d2o" } }, defaultVariants: {}, compoundVariants: [] });
+var ceo_body = "txcb8d2p";
+var hover = "txcb8d2q";
+var social = "txcb8d2r";
+var tooltip = createRuntimeFn({ defaultClassName: "txcb8d2s", variantClassNames: { variant: { primary: "txcb8d2t", secondary: "txcb8d2u", tertiary: "txcb8d2v", quaternary: "txcb8d2w" } }, defaultVariants: {}, compoundVariants: [] });
+var order_3 = "txcb8d2x";
+var overlay = "txcb8d2y";
+var stroke_color = createRuntimeFn({ defaultClassName: "txcb8d2z", variantClassNames: { variant: { primary: "txcb8d30", secondary: "txcb8d31", tertiary: "txcb8d32", quaternary: "txcb8d33" } }, defaultVariants: {}, compoundVariants: [] });
 export {
   bio_section_text,
   bulletsHeadline,

package/dist/ExecutiveBio/ExecutiveBio.interface.d.ts

@@ -9,6 +9,7 @@ export interface ExecutiveBioSetProps {
     description?: ReactNode | string;
     executiveBios: ExecutiveBioProps[];
     additionalDetails?: string | ReactNode;
+    numberOfColumns?: string;
 }
 export interface ExecutiveBioProps {
     id: string;

package/dist/ExecutiveBio/ExecutiveBio.js

@@ -175,7 +175,7 @@ const ExecutiveBio = ({
   return /* @__PURE__ */ jsx(Fragment, { children: bannerType !== "Hero" ? /* @__PURE__ */ jsx(
     "section",
     {
-      className: `section_spacer ${executive_bio} ${bannerType === "Compact" ? compact : ""}`,
+      className: `${executive_bio} ${bannerType === "Compact" ? compact : ""}`,
       id,
       children: /* @__PURE__ */ jsx("div", { className: "containment", children: /* @__PURE__ */ jsx("div", { className: `${padding} ${item_bio({ variant })} rounded`, children: /* @__PURE__ */ jsxs("div", { className: `${shift} flex`, children: [
         executiveHeadshot && /* @__PURE__ */ jsx("div", { className: media, children: /* @__PURE__ */ jsx("div", { className: headshot, children: /* @__PURE__ */ jsx("div", { className: img_area, role: "presentation", children: /* @__PURE__ */ jsx(OptimizeImage, { src: executiveHeadshot?.src, alt: "" }) }) }) }),

package/dist/ExecutiveBio/ExecutiveBioSet.d.ts

@@ -1,4 +1,3 @@
-import { SetContainerProps } from '../SetContainer';
 import { ExecutiveBioSetProps as Props } from './ExecutiveBio.interface';
 
-export declare const ExecutiveBioSet: ({ id, title, description, executiveBios, additionalDetails, variant: fullVariant, }: Props & SetContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ExecutiveBioSet: ({ id, title, description, executiveBios, additionalDetails, variant: fullVariant, numberOfColumns, }: Props) => import("react/jsx-runtime").JSX.Element;

package/dist/ExecutiveBio/ExecutiveBioSet.js

@@ -2,36 +2,49 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { getVariant } from "../utils/getVariant.js";
 import { ExecutiveBio } from "./ExecutiveBio.js";
 import { section_theme, bio_section_text, header_theme, components, details } from "./ExecutiveBio.css.js";
+import "../utils/allowedAxosDomains.js";
+import "react";
+import { columnValues } from "../utils/variant.types.js";
+import { getNumOfColumns } from "../utils/getNumber.js";
 const ExecutiveBioSet = ({
   id,
   title,
   description,
   executiveBios,
   additionalDetails,
-  variant: fullVariant = "primary"
+  variant: fullVariant = "primary",
+  numberOfColumns = "1 Column"
 }) => {
   const variant = getVariant(fullVariant);
+  const numOfCols = getNumOfColumns(numberOfColumns);
   return /* @__PURE__ */ jsxs("section", { id, className: section_theme({ variant }), children: [
     /* @__PURE__ */ jsx("div", { className: "containment", children: (title || description) && /* @__PURE__ */ jsxs("div", { className: bio_section_text, children: [
       title && /* @__PURE__ */ jsx("h2", { className: `header_1 ${header_theme({ variant })}`, children: title }),
       description && /* @__PURE__ */ jsx(Fragment, { children: description })
     ] }) }),
-    /* @__PURE__ */ jsx("div", { className: components, children: executiveBios.map((bio) => /* @__PURE__ */ jsx(
-      ExecutiveBio,
+    /* @__PURE__ */ jsx(
+      "div",
       {
-        id: `id_${bio.id}`,
-        executiveName: bio?.executiveName,
-        executiveTitle: bio?.executiveTitle,
-        executiveBodyCopy: bio?.executiveBodyCopy,
-        executiveEmailAddress: bio?.executiveEmailAddress,
-        executivePhoneNumber: bio?.executivePhoneNumber,
-        executiveLinkedIn: bio?.executiveLinkedIn,
-        executiveWebsite: bio?.executiveWebsite,
-        executiveHeadshot: { src: bio?.executiveHeadshot?.src || "" },
-        variant: bio?.variant
-      },
-      bio.id
-    )) }),
+        className: numOfCols && columnValues.includes(numOfCols) ? `${components({ columns: numOfCols })} cols_${numOfCols} containment` : "",
+        children: executiveBios.map((bio) => /* @__PURE__ */ jsx(
+          ExecutiveBio,
+          {
+            id: `id_${bio.id}`,
+            executiveName: bio?.executiveName,
+            executiveTitle: bio?.executiveTitle,
+            executiveBodyCopy: bio?.executiveBodyCopy,
+            executiveEmailAddress: bio?.executiveEmailAddress,
+            executivePhoneNumber: bio?.executivePhoneNumber,
+            executiveLinkedIn: bio?.executiveLinkedIn,
+            executiveWebsite: bio?.executiveWebsite,
+            executiveHeadshot: { src: bio?.executiveHeadshot?.src || "" },
+            variant: bio?.variant,
+            bannerType: bio?.bannerType
+          },
+          bio.id
+        ))
+      }
+    ),
     additionalDetails && /* @__PURE__ */ jsx("div", { className: "containment", children: /* @__PURE__ */ jsx("div", { className: details, children: /* @__PURE__ */ jsx(Fragment, { children: additionalDetails }) }) })
   ] });
 };

package/dist/ImageBillboard/ImageBillboard.css.js

@@ -1,10 +1,9 @@
-import '../assets/ImageBillboard/ImageBillboard.css';import '../assets/Insight/Insight.css';import '../assets/SetContainer/SetContainer.css';import '../assets/ExecutiveBio/ExecutiveBio.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';import '../assets/Typography/Typography.css';/* empty css                                          */
+import '../assets/ImageBillboard/ImageBillboard.css';import '../assets/Insight/Insight.css';import '../assets/SetContainer/SetContainer.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';import '../assets/Typography/Typography.css';/* empty css                                          */
 /* empty css                                */
 /* empty css                                   */
 /* empty css                               */
 /* empty css                                    */
 /* empty css                                              */
-/* empty css                                              */
 /* empty css                                    */
 /* empty css                                  */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";

package/dist/SetContainer/SetContainer.css.js

@@ -1,9 +1,7 @@
-import '../assets/SetContainer/SetContainer.css';import '../assets/ExecutiveBio/ExecutiveBio.css';import '../assets/Typography/Typography.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css                                */
+import '../assets/SetContainer/SetContainer.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css                                */
 /* empty css                                   */
 /* empty css                               */
 /* empty css                                    */
-/* empty css                                          */
-/* empty css                                              */
 /* empty css                                */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 var set_container = createRuntimeFn({ defaultClassName: "_18ygy9m0", variantClassNames: { variant: { primary: "_18ygy9m1", secondary: "_18ygy9m2", tertiary: "_18ygy9m3", quaternary: "_18ygy9m4" } }, defaultVariants: {}, compoundVariants: [] });

package/dist/SetContainer/SetContainer.js

@@ -89,6 +89,7 @@ import { heroSupertag } from "../HeroBanner/HeroBanner.css.js";
 import "../ContentBanner/ContentBanner.css.js";
 /* empty css                                              */
 import "../ExecutiveBio/ExecutiveBio.css.js";
+import { getNumOfColumns } from "../utils/getNumber.js";
 import "../FaqAccordion/index.js";
 import "../FooterDisclosure/FooterDisclosure.css.js";
 /* empty css                                                          */
@@ -133,7 +134,6 @@ import "../StepItemSet/StepItemSet.css.js";
 /* empty css                                              */
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";
-import { getNumOfColumns } from "../utils/getNumber.js";
 const SetContainer = ({
   id,
   variant,

package/dist/assets/ExecutiveBio/ExecutiveBio.css

@@ -177,56 +177,76 @@
   margin-right: 0px;
   align-self: flex-start;
 }
-.txcb8d1 .txcb8d10 {
+.txcb8d10 {
+  display: grid;
+  gap: 24px;
+  position: relative;
+  margin-inline: auto;
+}
+.txcb8d11 {
+  grid-template-columns: 1fr;
+}
+.txcb8d12 {
+  grid-template-columns: repeat(2, 1fr);
+  width: min(800px, 100%);
+}
+.txcb8d13 {
+  grid-template-columns: repeat(3, 1fr);
+}
+.txcb8d14 {
+  grid-template-columns: repeat(4, 1fr);
+}
+.txcb8d1 .txcb8d15 {
   gap: 16px;
   height: 100%;
 }
-.txcb8d11 {
+.txcb8d16 {
   margin-bottom: 40px;
-  margin-left: auto;
-  margin-right: auto;
+  margin-inline: auto;
   max-width: 800px;
   text-align: center;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
-.txcb8d11 h2 + p {
-  color: #333D46;
-  margin-top: 8px;
-}
-.txcb8d12 {
+.txcb8d17 {
   margin-top: 0;
   padding-bottom: 56px;
   padding-top: 56px;
 }
-.txcb8d13 {
+.txcb8d18 {
   background: var(--_1073cm81);
+  color: var(--_1073cm83);
 }
-.txcb8d14 {
+.txcb8d19 {
   background: var(--_1073cm88);
+  color: var(--_1073cm8a);
 }
-.txcb8d15 {
+.txcb8d1a {
   background: var(--_1073cm8f);
+  color: var(--_1073cm8h);
 }
-.txcb8d16 {
+.txcb8d1b {
   background: var(--_1073cm8m);
+  color: var(--_1073cm8o);
 }
-.txcb8d18 {
+.txcb8d1d {
   color: var(--_1073cm85);
 }
-.txcb8d19 {
+.txcb8d1e {
   color: var(--_1073cm8c);
 }
-.txcb8d1a {
+.txcb8d1f {
   color: var(--_1073cm8j);
 }
-.txcb8d1b {
+.txcb8d1g {
   color: var(--_1073cm8q);
 }
-.txcb8d1c {
-  position: relative;
+.txcb8d10.containment .containment {
+  width: 100%;
 }
-.txcb8d1d {
-  margin-left: auto;
-  margin-right: auto;
+.txcb8d1h {
+  margin-inline: auto;
   margin-top: 40px;
   max-width: 800px;
   text-align: center;
@@ -234,51 +254,51 @@
 main > div:nth-last-child(2) > .txcb8d0 {
   margin-bottom: 3.5rem;
 }
-.txcb8d1e {
+.txcb8d1i {
   gap: 36px;
 }
-.txcb8dn + .txcb8d1e {
+.txcb8dn + .txcb8d1i {
   margin-top: 24px;
 }
-.txcb8d1f {
+.txcb8d1j {
   display: flex;
   flex-direction: column;
 }
-.txcb8d1g {
+.txcb8d1k {
   position: relative;
   isolation: isolate;
   padding-block: 80px;
   overflow: clip;
 }
-.txcb8d1h {
+.txcb8d1l {
   background: var(--_1073cm81);
   color: var(--_1073cm83);
 }
-.txcb8d1i {
+.txcb8d1m {
   background: var(--_1073cm88);
   color: var(--_1073cm8a);
 }
-.txcb8d1j {
+.txcb8d1n {
   background: var(--_1073cm8f);
   color: var(--_1073cm8h);
 }
-.txcb8d1k {
+.txcb8d1o {
   background: var(--_1073cm8m);
   color: var(--_1073cm8o);
 }
-main > div:has(.txcb8d1g) {
+main > div:has(.txcb8d1k) {
   margin-top: 0;
 }
-.txcb8d1m {
+.txcb8d1q {
   display: flex;
   align-items: flex-start;
   gap: 56px;
 }
-.txcb8d1n {
+.txcb8d1r {
   gap: 32px;
   width: min(344px, 100%);
 }
-.txcb8d1o {
+.txcb8d1s {
   aspect-ratio: 344 / 392;
   border-radius: 16px;
   align-self: stretch;
@@ -286,128 +306,128 @@ main > div:has(.txcb8d1g) {
   max-width: 344px;
   position: relative;
 }
-.txcb8d1p {
+.txcb8d1t {
   height: 100%;
   width: 100%;
   object-fit: cover;
   position: absolute;
   inset: 0;
 }
-.txcb8d1q {
+.txcb8d1u {
   gap: 16px;
 }
-.txcb8d1r {
+.txcb8d1v {
   display: block;
   font: 700 18px / 1.5 var(--header-font-family);
   letter-spacing: -0.198px;
 }
-.txcb8d1s {
+.txcb8d1w {
   color: var(--_1073cm85);
 }
-.txcb8d1t {
+.txcb8d1x {
   color: var(--_1073cm8c);
 }
-.txcb8d1u {
+.txcb8d1y {
   color: var(--_1073cm8j);
 }
-.txcb8d1v {
+.txcb8d1z {
   color: var(--_1073cm8q);
 }
-.txcb8d1w {
+.txcb8d20 {
   gap: 3px;
   padding-left: 24px;
 }
-.txcb8d1x {
+.txcb8d21 {
   flex: 1;
   gap: 24px;
 }
-.txcb8d1y {
+.txcb8d22 {
   gap: 16px;
 }
-.txcb8d1z {
+.txcb8d23 {
   gap: 12px;
 }
-.txcb8d21 {
+.txcb8d25 {
   color: var(--_1073cm85);
 }
-.txcb8d22 {
+.txcb8d26 {
   color: var(--_1073cm8c);
 }
-.txcb8d23 {
+.txcb8d27 {
   color: var(--_1073cm8j);
 }
-.txcb8d24 {
+.txcb8d28 {
   color: var(--_1073cm8q);
 }
-.txcb8d25 {
+.txcb8d29 {
   font-size: 20px;
   line-height: 1.5;
 }
-.txcb8d26 {
+.txcb8d2a {
   color: var(--_1073cm85);
 }
-.txcb8d27 {
+.txcb8d2b {
   color: var(--_1073cm8c);
 }
-.txcb8d28 {
+.txcb8d2c {
   color: var(--_1073cm8j);
 }
-.txcb8d29 {
+.txcb8d2d {
   color: var(--_1073cm8q);
 }
-.txcb8d2a {
+.txcb8d2e {
   display: flex;
   align-items: center;
   gap: 18px;
 }
-.txcb8d2c {
+.txcb8d2g {
   fill: #2F5B88;
 }
-.txcb8d2d {
+.txcb8d2h {
   fill: #2F5B88;
 }
-.txcb8d2e {
+.txcb8d2i {
   fill: var(--_1073cm8g);
 }
-.txcb8d2f {
+.txcb8d2j {
   fill: var(--_1073cm8n);
 }
-.txcb8d2g {
+.txcb8d2k {
   font-size: 24px;
   font-weight: 700;
   line-height: 1.37;
   font-family: var(--header-font-family);
   text-wrap: pretty;
 }
-.txcb8d2h {
+.txcb8d2l {
   color: var(--_1073cm85);
 }
-.txcb8d2i {
+.txcb8d2m {
   color: var(--_1073cm8c);
 }
-.txcb8d2j {
+.txcb8d2n {
   color: var(--_1073cm8j);
 }
-.txcb8d2k {
+.txcb8d2o {
   color: var(--_1073cm8q);
 }
-.txcb8d2l p {
+.txcb8d2p p {
   font-size: 16px;
   line-height: 1.5;
 }
-.txcb8d2m {
+.txcb8d2q {
   scale: 1;
   transition: scale 0.25s ease;
   will-change: scale;
 }
-.txcb8d2m:hover {
+.txcb8d2q:hover {
   scale: 1.1;
 }
-.txcb8d2n {
+.txcb8d2r {
   position: relative;
   display: flex;
 }
-.txcb8d2o {
+.txcb8d2s {
   visibility: hidden;
   min-width: 120px;
   text-align: center;
@@ -424,31 +444,31 @@ main > div:has(.txcb8d1g) {
   font-weight: 700;
   font-family: var(--header-font-family);
 }
-.txcb8d2n:hover .txcb8d2o {
+.txcb8d2r:hover .txcb8d2s {
   visibility: visible;
   opacity: 1;
 }
-.txcb8d2n:focus-visible .txcb8d2o {
+.txcb8d2r:focus-visible .txcb8d2s {
   visibility: visible;
   opacity: 1;
 }
-.txcb8d2p {
+.txcb8d2t {
   background: var(--_1073cm82);
   color: var(--_1073cm86);
 }
-.txcb8d2q {
+.txcb8d2u {
   background: var(--_1073cm89);
   color: var(--_1073cm8d);
 }
-.txcb8d2r {
+.txcb8d2v {
   background: var(--_1073cm8g);
   color: var(--_1073cm8k);
 }
-.txcb8d2s {
+.txcb8d2w {
   background: var(--_1073cm8n);
   color: var(--_1073cm8r);
 }
-.txcb8d2u {
+.txcb8d2y {
   position: absolute;
   top: 0;
   left: 0;
@@ -457,28 +477,28 @@ main > div:has(.txcb8d1g) {
   height: 100%;
   z-index: -1;
 }
-.txcb8d2w {
+.txcb8d30 {
   stroke: var(--_1073cm82);
 }
-.txcb8d2x {
+.txcb8d31 {
   stroke: var(--_1073cm89);
 }
-.txcb8d2y {
+.txcb8d32 {
   stroke: var(--_1073cm8g);
 }
-.txcb8d2z {
+.txcb8d33 {
   stroke: var(--_1073cm8n);
 }
-.txcb8d2w path {
+.txcb8d30 path {
   stroke: var(--_1073cm82) !important;
 }
-.txcb8d2x path {
+.txcb8d31 path {
   stroke: var(--_1073cm89) !important;
 }
-.txcb8d2y path {
+.txcb8d32 path {
   stroke: var(--_1073cm8g) !important;
 }
-.txcb8d2z path {
+.txcb8d33 path {
   stroke: var(--_1073cm8n) !important;
 }
 .txcb8d1 .containment {
@@ -489,6 +509,16 @@ main > div:has(.txcb8d1g) {
     max-width: max-content;
   }
 }
+@media (max-width: 1175px) {
+  .txcb8d13 {
+    grid-template-columns: repeat(2, 1fr);
+    width: min(840px, 100%);
+  }
+  .txcb8d14 {
+    grid-template-columns: repeat(2, 1fr);
+    width: min(840px, 100%);
+  }
+}
 @media (max-width: 1023px) {
   .txcb8dm {
     margin-top: 24px;
@@ -512,57 +542,66 @@ main > div:has(.txcb8d1g) {
   .txcb8dz p:first-of-type {
     margin-top: 8px;
   }
-  .txcb8d10 {
+  .txcb8d12 {
+    width: min(675px, 100%);
+  }
+  .txcb8d13 {
+    width: min(675px, 100%);
+  }
+  .txcb8d14 {
+    width: min(675px, 100%);
+  }
+  .txcb8d15 {
     flex-direction: column;
   }
-  .txcb8d11 {
+  .txcb8d16 {
     margin-bottom: 24px;
   }
-  .txcb8d12 {
+  .txcb8d17 {
     padding-top: 42px;
     padding-bottom: 42px;
   }
-  .txcb8d1d {
+  .txcb8d1h {
     margin-top: 24px;
   }
-  .txcb8d1g {
+  .txcb8d1k {
     padding-block: 42px;
   }
-  .txcb8d1m {
+  .txcb8d1q {
     gap: 32px;
   }
 }
 @media (max-width: 1570px) {
-  .txcb8d2u {
+  .txcb8d2y {
     left: calc(-11.875rem + ((1vw - 12.6200px) * 61.6883));
   }
 }
 @media (max-width: 1262px) {
-  .txcb8d2u {
+  .txcb8d2y {
     left: -190px;
   }
 }
 @media (max-width: 850px) {
-  .txcb8d1m {
+  .txcb8d1q {
     flex-direction: column;
     gap: 24px;
   }
-  .txcb8d1n {
+  .txcb8d1r {
     display: contents;
   }
-  .txcb8d1q {
+  .txcb8d1u {
     order: 1;
   }
-  .txcb8d1x {
+  .txcb8d21 {
     display: contents;
   }
-  .txcb8d2l {
+  .txcb8d2p {
     order: 2;
   }
-  .txcb8d2t {
+  .txcb8d2x {
     order: 3;
   }
-  .txcb8d2u {
+  .txcb8d2y {
     height: 530px;
     left: unset;
     right: -150px;
@@ -596,30 +635,43 @@ main > div:has(.txcb8d1g) {
   .txcb8dx {
     width: 200px;
   }
-  .txcb8d11 h2 + p {
-    font-size: 1rem;
-    line-height: 1.5;
-  }
   .txcb8d12 {
+    grid-template-columns: 1fr;
+    width: min(350px, calc(100% - 2rem));
+  }
+  .txcb8d13 {
+    grid-template-columns: 1fr;
+    width: min(350px, calc(100% - 2rem));
+  }
+  .txcb8d14 {
+    grid-template-columns: 1fr;
+    width: min(350px, calc(100% - 2rem));
+  }
+  .txcb8d17 {
     padding-top: 32px;
     padding-bottom: 32px;
   }
-  .txcb8dn + .txcb8d1e {
+  .txcb8dn + .txcb8d1i {
     margin-top: 10px;
   }
-  .txcb8d1g {
+  .txcb8d1k {
     padding-block: 32px;
   }
-  .txcb8d1q {
+  .txcb8d1u {
     gap: 12px;
   }
-  .txcb8d25 {
+  .txcb8d29 {
     font-size: 16px;
   }
-  .txcb8d2g {
+  .txcb8d2k {
     font-size: 18px;
   }
 }
+@media (min-width: 1176px) {
+  .txcb8d14 .txcb8d15 {
+    flex-direction: column;
+  }
+}
 @media screen and (max-width: 1023px) {
   main > div:nth-last-child(2) > .txcb8d0 {
     margin-bottom: 42px;
@@ -631,32 +683,32 @@ main > div:has(.txcb8d1g) {
   }
 }
 @media (max-width: 500px) {
-  .txcb8d1e {
+  .txcb8d1i {
     gap: 24px;
   }
 }
 @media (max-width: 400px) {
-  .txcb8d1e {
+  .txcb8d1i {
     align-items: flex-start;
     flex-direction: column;
     gap: 10px;
   }
 }
 @media (max-width: 1023px) and (min-width: 769px) {
-  .txcb8d1l {
+  .txcb8d1p {
     width: min(1200px, calc(100% - 4rem));
   }
 }
 @media (min-width: 769px) {
-  .txcb8d2t > * + * {
+  .txcb8d2x > * + * {
     margin-top: 14px;
   }
 }
 @media (min-width: 851px) {
-  .txcb8d2w path {
+  .txcb8d30 path {
     opacity: 0.5;
   }
-  .txcb8d2x path {
+  .txcb8d31 path {
     opacity: 0.5;
   }
 }

package/dist/assets/SetContainer/SetContainer.css

@@ -41,18 +41,6 @@
   flex-wrap: wrap;
   gap: 24px;
 }
-._18ygy9m7:has(.txcb8d1) {
-  grid-template-columns: 1fr;
-}
-._18ygy9m8:has(.txcb8d1) {
-  grid-template-columns: 1fr 1fr;
-}
-._18ygy9m9:has(.txcb8d1) {
-  grid-template-columns: 1fr 1fr 1fr;
-}
-._18ygy9ma:has(.txcb8d1) {
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-}
 ._18ygy9m6.cols_1 > .is_icon {
   flex: 1 1 100%;
 }
@@ -161,23 +149,10 @@
     display: grid;
     grid-template-columns: 1fr;
   }
-  ._18ygy9m6:has(.txcb8d1) {
-    grid-template-columns: 1fr !important;
-    width: min(300px, 100%);
-    margin-inline: auto;
-  }
   ._18ygy9mb {
     padding-block: 1.5rem;
   }
 }
-@media screen and (max-width: 1200px) {
-  ._18ygy9m9:has(.txcb8d1) {
-    grid-template-columns: 1fr 1fr;
-  }
-  ._18ygy9ma:has(.txcb8d1) {
-    grid-template-columns: 1fr 1fr;
-  }
-}
 @media screen and (max-width: 1280px) {
   ._18ygy9m6.cols_4 > .is_icon {
     flex-basis: calc(50% - 12px);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@axos-web-dev/shared-components",
   "description": "Axos shared components library for web.",
-  "version": "1.0.100-dev.73-compact-executive-bio",
+  "version": "1.0.100-dev.73-compact-executive-bio.2",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",