@axos-web-dev/shared-components 0.0.59 → 0.0.60

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.
@@ -16,7 +16,7 @@ const ExecutiveBioSet = ({
16
16
  title && /* @__PURE__ */ jsx("h2", { className: `header_1 ${header_theme({ variant })}`, children: title }),
17
17
  description && /* @__PURE__ */ jsx(Fragment, { children: description })
18
18
  ] }) }),
19
- /* @__PURE__ */ jsx("div", { className: components, children: executiveBios.map((bio, index) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
19
+ /* @__PURE__ */ jsx("div", { className: components, children: executiveBios.map((bio) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
20
20
  ExecutiveBio,
21
21
  {
22
22
  id: `id_${bio.id}`,
@@ -30,7 +30,7 @@ const ExecutiveBioSet = ({
30
30
  executiveHeadshot: { src: bio?.executiveHeadshot?.src || "" },
31
31
  variant: bio?.variant
32
32
  },
33
- index
33
+ bio.id
34
34
  ) })) }),
35
35
  additionalDetails && /* @__PURE__ */ jsx("div", { className: "containment", children: /* @__PURE__ */ jsx("div", { className: details, children: /* @__PURE__ */ jsx(Fragment, { children: additionalDetails }) }) })
36
36
  ] });
@@ -100,5 +100,24 @@ export declare const header_section: import('@vanilla-extract/recipes').RuntimeF
100
100
  };
101
101
  }>;
102
102
  export declare const section_container: string;
103
+ export declare const section_body: import('@vanilla-extract/recipes').RuntimeFn<{
104
+ variant: {
105
+ primary: {
106
+ background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
107
+ border: "1px solid #D4D4D4";
108
+ };
109
+ secondary: {
110
+ background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
111
+ };
112
+ tertiary: {
113
+ background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
114
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
115
+ };
116
+ quaternary: {
117
+ background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
118
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
119
+ };
120
+ };
121
+ }>;
103
122
  export type ContainerVariants = RecipeVariants<typeof containerIconBillboard>;
104
123
  export type LayoutVariants = RecipeVariants<typeof layout>;
@@ -15,6 +15,7 @@ var buttons = "_1r4ovbuh";
15
15
  var section_text = "_1r4ovbui";
16
16
  var header_section = createRuntimeFn({ defaultClassName: "_1r4ovbuj", variantClassNames: { variant: { primary: "_1r4ovbuk", secondary: "_1r4ovbul", tertiary: "_1r4ovbum", quaternary: "_1r4ovbun" } }, defaultVariants: {}, compoundVariants: [] });
17
17
  var section_container = "_1r4ovbuo";
18
+ var section_body = createRuntimeFn({ defaultClassName: "_1r4ovbup", variantClassNames: { variant: { primary: "_1r4ovbuq", secondary: "_1r4ovbur", tertiary: "_1r4ovbus", quaternary: "_1r4ovbut" } }, defaultVariants: {}, compoundVariants: [] });
18
19
  export {
19
20
  billboard_icon,
20
21
  buttons,
@@ -25,6 +26,7 @@ export {
25
26
  layout,
26
27
  list,
27
28
  listItem,
29
+ section_body,
28
30
  section_container,
29
31
  section_text,
30
32
  title
@@ -2,11 +2,12 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
2
2
  import { BulletItem } from "../BulletItem/BulletItem.js";
3
3
  import { Chevron } from "../Chevron/index.js";
4
4
  import { getVariant } from "../utils/getVariant.js";
5
+ import clsx from "clsx";
5
6
  import { Button } from "../Button/Button.js";
6
7
  import "../Button/Button.css.js";
7
8
  import "react";
8
9
  import "react-use";
9
- import { section_text, header_section, section_container, containerIconBillboard, layout, billboard_icon, content, headerIconBillboard, title, list, buttons } from "./IconBillboard.css.js";
10
+ import { section_text, header_section, section_body, section_container, containerIconBillboard, layout, billboard_icon, content, headerIconBillboard, title, list, buttons } from "./IconBillboard.css.js";
10
11
  const IconBillboardSet = ({
11
12
  variant,
12
13
  side = false,
@@ -25,7 +26,7 @@ const IconBillboardSet = ({
25
26
  children: headline
26
27
  }
27
28
  ),
28
- bodyCopy && /* @__PURE__ */ jsx(Fragment, { children: bodyCopy })
29
+ bodyCopy && /* @__PURE__ */ jsx("div", { className: clsx(section_body({ variant })), children: bodyCopy })
29
30
  ] }),
30
31
  /* @__PURE__ */ jsx("div", { className: section_container, children: iconBillboards.map(
31
32
  ({ id, icon, headline: headline2, bodyCopy: bodyCopy2, bullets, callToActionRow }) => /* @__PURE__ */ jsxs("div", { className: containerIconBillboard({ variant }), children: [
@@ -1,5 +1,5 @@
1
1
  import { IconBillboard } from "./IconBillboard.js";
2
- import { billboard_icon, buttons, containerIconBillboard, content, headerIconBillboard, header_section, layout, list, listItem, section_container, section_text, title } from "./IconBillboard.css.js";
2
+ import { billboard_icon, buttons, containerIconBillboard, content, headerIconBillboard, header_section, layout, list, listItem, section_body, section_container, section_text, title } from "./IconBillboard.css.js";
3
3
  import { IconBillboardSet } from "./IconBillboardSet.js";
4
4
  export {
5
5
  IconBillboard,
@@ -13,6 +13,7 @@ export {
13
13
  layout,
14
14
  list,
15
15
  listItem,
16
+ section_body,
16
17
  section_container,
17
18
  section_text,
18
19
  title
@@ -1,56 +1,56 @@
1
- const header = "_header_5tt5v_1";
2
- const wrapper = "_wrapper_5tt5v_5";
3
- const header_main_row = "_header_main_row_5tt5v_11";
4
- const mobile_header = "_mobile_header_5tt5v_12";
5
- const logo_wrap = "_logo_wrap_5tt5v_18";
6
- const primary_links = "_primary_links_5tt5v_22";
7
- const main_nav_link = "_main_nav_link_5tt5v_26";
8
- const sub_nav_link = "_sub_nav_link_5tt5v_48";
9
- const signin_wrap = "_signin_wrap_5tt5v_50";
10
- const signin_btn = "_signin_btn_5tt5v_51";
11
- const sub_nav = "_sub_nav_5tt5v_48";
12
- const header_sub_row = "_header_sub_row_5tt5v_93";
13
- const signin_dropdown = "_signin_dropdown_5tt5v_109";
14
- const shadow = "_shadow_5tt5v_119";
15
- const signin_header = "_signin_header_5tt5v_127";
16
- const signin_subheader = "_signin_subheader_5tt5v_134";
17
- const opacity = "_opacity_5tt5v_156";
18
- const fadeInDown = "_fadeInDown_5tt5v_1";
19
- const footer = "_footer_5tt5v_162";
20
- const open = "_open_5tt5v_178";
21
- const dd_wrapper = "_dd_wrapper_5tt5v_190";
22
- const dd_media = "_dd_media_5tt5v_195";
23
- const dd_media_img = "_dd_media_img_5tt5v_200";
24
- const dd_site_navs = "_dd_site_navs_5tt5v_204";
25
- const dd_media_header = "_dd_media_header_5tt5v_211";
26
- const mt_8 = "_mt_8_5tt5v_220";
27
- const mt_16 = "_mt_16_5tt5v_224";
28
- const ml_8 = "_ml_8_5tt5v_228";
29
- const dd_media_cta = "_dd_media_cta_5tt5v_232";
30
- const reversed_row = "_reversed_row_5tt5v_246";
31
- const headline = "_headline_5tt5v_262";
32
- const nav_anchor = "_nav_anchor_5tt5v_268";
33
- const headline_cta = "_headline_cta_5tt5v_276";
34
- const site_lists = "_site_lists_5tt5v_291";
35
- const hamburger = "_hamburger_5tt5v_326";
36
- const mobile_only = "_mobile_only_5tt5v_340";
37
- const mobile_logo = "_mobile_logo_5tt5v_346";
38
- const highlight = "_highlight_5tt5v_351";
39
- const mobile_nav = "_mobile_nav_5tt5v_387";
40
- const mobile_opened = "_mobile_opened_5tt5v_397";
41
- const mobile_nav_item = "_mobile_nav_item_5tt5v_402";
42
- const has_dropdown = "_has_dropdown_5tt5v_417";
43
- const icon_wrap = "_icon_wrap_5tt5v_438";
44
- const mobile_footer = "_mobile_footer_5tt5v_443";
45
- const mobile_footer_content = "_mobile_footer_content_5tt5v_448";
46
- const mobile_footer_media = "_mobile_footer_media_5tt5v_462";
47
- const footer_cta = "_footer_cta_5tt5v_468";
48
- const inner_wrapper = "_inner_wrapper_5tt5v_496";
49
- const btn = "_btn_5tt5v_501";
50
- const sub_menu = "_sub_menu_5tt5v_506";
51
- const main = "_main_5tt5v_26";
52
- const dd_footer = "_dd_footer_5tt5v_531";
53
- const desktop_only = "_desktop_only_5tt5v_550";
1
+ const header = "_header_1i6pg_1";
2
+ const wrapper = "_wrapper_1i6pg_5";
3
+ const header_main_row = "_header_main_row_1i6pg_11";
4
+ const mobile_header = "_mobile_header_1i6pg_12";
5
+ const logo_wrap = "_logo_wrap_1i6pg_18";
6
+ const primary_links = "_primary_links_1i6pg_22";
7
+ const main_nav_link = "_main_nav_link_1i6pg_26";
8
+ const sub_nav_link = "_sub_nav_link_1i6pg_48";
9
+ const signin_wrap = "_signin_wrap_1i6pg_50";
10
+ const signin_btn = "_signin_btn_1i6pg_51";
11
+ const sub_nav = "_sub_nav_1i6pg_48";
12
+ const header_sub_row = "_header_sub_row_1i6pg_93";
13
+ const signin_dropdown = "_signin_dropdown_1i6pg_109";
14
+ const shadow = "_shadow_1i6pg_119";
15
+ const signin_header = "_signin_header_1i6pg_127";
16
+ const signin_subheader = "_signin_subheader_1i6pg_134";
17
+ const opacity = "_opacity_1i6pg_156";
18
+ const fadeInDown = "_fadeInDown_1i6pg_1";
19
+ const footer = "_footer_1i6pg_162";
20
+ const open = "_open_1i6pg_178";
21
+ const dd_wrapper = "_dd_wrapper_1i6pg_190";
22
+ const dd_media = "_dd_media_1i6pg_195";
23
+ const dd_media_img = "_dd_media_img_1i6pg_200";
24
+ const dd_site_navs = "_dd_site_navs_1i6pg_204";
25
+ const dd_media_header = "_dd_media_header_1i6pg_211";
26
+ const mt_8 = "_mt_8_1i6pg_220";
27
+ const mt_16 = "_mt_16_1i6pg_224";
28
+ const ml_8 = "_ml_8_1i6pg_228";
29
+ const dd_media_cta = "_dd_media_cta_1i6pg_232";
30
+ const reversed_row = "_reversed_row_1i6pg_246";
31
+ const headline = "_headline_1i6pg_262";
32
+ const nav_anchor = "_nav_anchor_1i6pg_268";
33
+ const headline_cta = "_headline_cta_1i6pg_276";
34
+ const site_lists = "_site_lists_1i6pg_291";
35
+ const hamburger = "_hamburger_1i6pg_326";
36
+ const mobile_only = "_mobile_only_1i6pg_340";
37
+ const mobile_logo = "_mobile_logo_1i6pg_346";
38
+ const highlight = "_highlight_1i6pg_351";
39
+ const mobile_nav = "_mobile_nav_1i6pg_387";
40
+ const mobile_opened = "_mobile_opened_1i6pg_398";
41
+ const mobile_nav_item = "_mobile_nav_item_1i6pg_402";
42
+ const has_dropdown = "_has_dropdown_1i6pg_417";
43
+ const icon_wrap = "_icon_wrap_1i6pg_438";
44
+ const mobile_footer = "_mobile_footer_1i6pg_443";
45
+ const mobile_footer_content = "_mobile_footer_content_1i6pg_448";
46
+ const mobile_footer_media = "_mobile_footer_media_1i6pg_462";
47
+ const footer_cta = "_footer_cta_1i6pg_468";
48
+ const inner_wrapper = "_inner_wrapper_1i6pg_496";
49
+ const btn = "_btn_1i6pg_501";
50
+ const sub_menu = "_sub_menu_1i6pg_506";
51
+ const main = "_main_1i6pg_26";
52
+ const dd_footer = "_dd_footer_1i6pg_531";
53
+ const desktop_only = "_desktop_only_1i6pg_550";
54
54
  const styles = {
55
55
  header,
56
56
  wrapper,
@@ -114,6 +114,9 @@
114
114
  ._1es6o1h0 .txcb8dj {
115
115
  fill: var(--_1073cm8o);
116
116
  }
117
+ .txcb8dk {
118
+ flex: 1 1 0%;
119
+ }
117
120
  .txcb8dl {
118
121
  flex: 1 1 0%;
119
122
  max-width: 50%;
@@ -130,6 +130,24 @@
130
130
  grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) );
131
131
  gap: 24px;
132
132
  }
133
+ ._1r4ovbup {
134
+ color: var(--_1073cm82);
135
+ }
136
+ ._1r4ovbuq {
137
+ background: var(--_1073cm81);
138
+ border: 1px solid #D4D4D4;
139
+ }
140
+ ._1r4ovbur {
141
+ background: var(--_1073cm88);
142
+ }
143
+ ._1r4ovbus {
144
+ background: var(--_1073cm8f);
145
+ color: var(--_1073cm8g);
146
+ }
147
+ ._1r4ovbut {
148
+ background: var(--_1073cm8m);
149
+ color: var(--_1073cm8n);
150
+ }
133
151
  @media screen and (max-width: 380px) {
134
152
  ._1r4ovbuh {
135
153
  flex-direction: column;
@@ -1,43 +1,43 @@
1
- ._header_5tt5v_1 {
1
+ ._header_1i6pg_1 {
2
2
  border-bottom: 1px solid #ebebeb;
3
3
  }
4
4
 
5
- ._wrapper_5tt5v_5 {
5
+ ._wrapper_1i6pg_5 {
6
6
  width: calc(100% - 80px);
7
7
  margin-left: auto;
8
8
  margin-right: auto;
9
9
  }
10
10
 
11
- ._header_main_row_5tt5v_11,
12
- ._mobile_header_5tt5v_12 {
11
+ ._header_main_row_1i6pg_11,
12
+ ._mobile_header_1i6pg_12 {
13
13
  min-height: 80px;
14
14
  padding-top: 1rem;
15
15
  padding-bottom: 0.5rem;
16
16
  }
17
17
 
18
- ._logo_wrap_5tt5v_18 {
18
+ ._logo_wrap_1i6pg_18 {
19
19
  padding: 9px 6px;
20
20
  }
21
21
 
22
- ._primary_links_5tt5v_22 {
22
+ ._primary_links_1i6pg_22 {
23
23
  margin-left: 30px;
24
24
  }
25
25
 
26
- ._main_nav_link_5tt5v_26 {
26
+ ._main_nav_link_1i6pg_26 {
27
27
  padding: 10px 8px;
28
28
  text-align: center;
29
29
  }
30
30
 
31
- ._main_nav_link_5tt5v_26 .active {
31
+ ._main_nav_link_1i6pg_26 .active {
32
32
  border-color: currentColor;
33
33
  transition: border-color 0.5s ease;
34
34
  }
35
35
 
36
- ._main_nav_link_5tt5v_26 .active {
36
+ ._main_nav_link_1i6pg_26 .active {
37
37
  font-weight: 700;
38
38
  }
39
39
 
40
- ._main_nav_link_5tt5v_26 > a {
40
+ ._main_nav_link_1i6pg_26 > a {
41
41
  color: #1e3860;
42
42
  display: inline-block;
43
43
  font-size: 16px;
@@ -45,26 +45,26 @@
45
45
  border-bottom: 4px solid transparent;
46
46
  }
47
47
 
48
- ._sub_nav_link_5tt5v_48 a,
49
- ._main_nav_link_5tt5v_26 a,
50
- ._signin_wrap_5tt5v_50 a,
51
- ._signin_btn_5tt5v_51 {
48
+ ._sub_nav_link_1i6pg_48 a,
49
+ ._main_nav_link_1i6pg_26 a,
50
+ ._signin_wrap_1i6pg_50 a,
51
+ ._signin_btn_1i6pg_51 {
52
52
  text-decoration: none;
53
53
  transition: opacity 0.3s ease;
54
54
  }
55
55
 
56
- ._sub_nav_link_5tt5v_48:hover,
57
- ._main_nav_link_5tt5v_26 a:hover,
58
- ._signin_wrap_5tt5v_50 a:hover {
56
+ ._sub_nav_link_1i6pg_48:hover,
57
+ ._main_nav_link_1i6pg_26 a:hover,
58
+ ._signin_wrap_1i6pg_50 a:hover {
59
59
  opacity: 0.8;
60
60
  }
61
61
 
62
- ._signin_wrap_5tt5v_50 .link {
62
+ ._signin_wrap_1i6pg_50 .link {
63
63
  text-decoration: none;
64
64
  padding: 8px;
65
65
  }
66
66
 
67
- ._signin_btn_5tt5v_51 {
67
+ ._signin_btn_1i6pg_51 {
68
68
  border: none;
69
69
  color: #fff;
70
70
  padding: 11px 24px;
@@ -76,37 +76,37 @@
76
76
  cursor: pointer;
77
77
  }
78
78
 
79
- ._signin_btn_5tt5v_51:hover {
79
+ ._signin_btn_1i6pg_51:hover {
80
80
  color: var(--colors-primary-textButton__1073cm85);
81
81
  background-color: var(--colors-primary-backgroundButton__1073cm86);
82
82
  opacity: 0.9;
83
83
  }
84
84
 
85
- ._signin_btn_5tt5v_51 > span {
85
+ ._signin_btn_1i6pg_51 > span {
86
86
  margin-right: 8px;
87
87
  }
88
88
 
89
- ._sub_nav_5tt5v_48 {
89
+ ._sub_nav_1i6pg_48 {
90
90
  background-color: var(--primary-theme-color);
91
91
  }
92
92
 
93
- ._header_sub_row_5tt5v_93 {
93
+ ._header_sub_row_1i6pg_93 {
94
94
  padding-block: 12px;
95
95
  min-height: 48px;
96
96
  }
97
97
 
98
- ._sub_nav_link_5tt5v_48 {
98
+ ._sub_nav_link_1i6pg_48 {
99
99
  padding-inline: 1rem;
100
100
  text-align: center;
101
101
  color: #fff;
102
102
  }
103
103
 
104
- ._sub_nav_link_5tt5v_48 a {
104
+ ._sub_nav_link_1i6pg_48 a {
105
105
  font-weight: 500;
106
106
  line-height: 1.5;
107
107
  }
108
108
 
109
- ._signin_dropdown_5tt5v_109 {
109
+ ._signin_dropdown_1i6pg_109 {
110
110
  min-width: 288px;
111
111
  padding: 1.5rem 1rem;
112
112
  position: absolute;
@@ -116,32 +116,32 @@
116
116
  display: none;
117
117
  }
118
118
 
119
- ._shadow_5tt5v_119 {
119
+ ._shadow_1i6pg_119 {
120
120
  box-shadow: 0px 8px 16px 0px rgba(30, 38, 47, 0.2);
121
121
  }
122
122
 
123
- ._signin_dropdown_5tt5v_109 li[role="heading"] {
123
+ ._signin_dropdown_1i6pg_109 li[role="heading"] {
124
124
  margin-top: 1px;
125
125
  }
126
126
 
127
- ._signin_header_5tt5v_127 {
127
+ ._signin_header_1i6pg_127 {
128
128
  color: #323339;
129
129
  font-weight: 700;
130
130
  padding: 0.5rem 1rem;
131
131
  text-align: left;
132
132
  }
133
133
 
134
- ._signin_subheader_5tt5v_134 {
134
+ ._signin_subheader_1i6pg_134 {
135
135
  color: #2f5b88;
136
136
  padding: 0.5rem 0.5rem 0.5rem 1.5rem;
137
137
  }
138
138
 
139
- ._signin_header_5tt5v_127,
140
- ._signin_subheader_5tt5v_134 a {
139
+ ._signin_header_1i6pg_127,
140
+ ._signin_subheader_1i6pg_134 a {
141
141
  line-height: 1.5;
142
142
  }
143
143
 
144
- @keyframes _fadeInDown_5tt5v_1 {
144
+ @keyframes _fadeInDown_1i6pg_1 {
145
145
  from {
146
146
  opacity: 0;
147
147
  transform: translate3d(0, -1%, 0);
@@ -153,18 +153,18 @@
153
153
  }
154
154
  }
155
155
 
156
- ._opacity_5tt5v_156 {
156
+ ._opacity_1i6pg_156 {
157
157
  animation-duration: 0.5s;
158
158
  animation-fill-mode: both;
159
- animation-name: _fadeInDown_5tt5v_1;
159
+ animation-name: _fadeInDown_1i6pg_1;
160
160
  }
161
161
 
162
- ._footer_5tt5v_162 {
162
+ ._footer_1i6pg_162 {
163
163
  margin-top: 0.5rem;
164
164
  padding-top: 1rem;
165
165
  }
166
166
 
167
- ._footer_5tt5v_162::before {
167
+ ._footer_1i6pg_162::before {
168
168
  content: "";
169
169
  background-color: #8f8f8f;
170
170
  height: 2px;
@@ -175,61 +175,61 @@
175
175
  width: 94%;
176
176
  }
177
177
 
178
- ._open_5tt5v_178 {
178
+ ._open_1i6pg_178 {
179
179
  opacity: 0.8;
180
180
  }
181
181
 
182
- ._open_5tt5v_178 > svg {
182
+ ._open_1i6pg_178 > svg {
183
183
  transform: scaleY(-1);
184
184
  }
185
185
 
186
- ._open_5tt5v_178 + ._signin_dropdown_5tt5v_109 {
186
+ ._open_1i6pg_178 + ._signin_dropdown_1i6pg_109 {
187
187
  display: block;
188
188
  }
189
189
 
190
- ._dd_wrapper_5tt5v_190 {
190
+ ._dd_wrapper_1i6pg_190 {
191
191
  z-index: 1203;
192
192
  max-width: 1440px;
193
193
  }
194
194
 
195
- ._dd_media_5tt5v_195 {
195
+ ._dd_media_1i6pg_195 {
196
196
  padding: 1.5rem;
197
197
  width: 280px;
198
198
  }
199
199
 
200
- ._dd_media_img_5tt5v_200 {
200
+ ._dd_media_img_1i6pg_200 {
201
201
  min-height: 232px;
202
202
  }
203
203
 
204
- ._dd_site_navs_5tt5v_204 {
204
+ ._dd_site_navs_1i6pg_204 {
205
205
  flex: 1 1 0%;
206
206
  padding: 1.5rem;
207
207
  display: flex;
208
208
  flex-direction: column;
209
209
  }
210
210
 
211
- ._dd_media_header_5tt5v_211 p {
211
+ ._dd_media_header_1i6pg_211 p {
212
212
  font-size: 14px;
213
213
  line-height: 1.42;
214
214
  }
215
215
 
216
- ._dd_media_header_5tt5v_211 p[role="heading"] {
216
+ ._dd_media_header_1i6pg_211 p[role="heading"] {
217
217
  font: 600 1.25rem/ 1.4 var(--header-font-family);
218
218
  }
219
219
 
220
- ._mt_8_5tt5v_220 {
220
+ ._mt_8_1i6pg_220 {
221
221
  margin-top: 8px;
222
222
  }
223
223
 
224
- ._mt_16_5tt5v_224 {
224
+ ._mt_16_1i6pg_224 {
225
225
  margin-top: 1rem;
226
226
  }
227
227
 
228
- ._ml_8_5tt5v_228 {
228
+ ._ml_8_1i6pg_228 {
229
229
  margin-left: 8px;
230
230
  }
231
231
 
232
- ._dd_media_cta_5tt5v_232 > a {
232
+ ._dd_media_cta_1i6pg_232 > a {
233
233
  border-radius: 8px;
234
234
  color: #1e3860 !important;
235
235
  display: inline-block;
@@ -243,29 +243,29 @@
243
243
  border: 2px solid transparent;
244
244
  }
245
245
 
246
- ._reversed_row_5tt5v_246 {
246
+ ._reversed_row_1i6pg_246 {
247
247
  flex-direction: row-reverse;
248
248
  }
249
249
 
250
- ._dd_media_cta_5tt5v_232 > a:hover {
250
+ ._dd_media_cta_1i6pg_232 > a:hover {
251
251
  background-color: transparent;
252
252
  border-color: #fff;
253
253
  color: #fff;
254
254
  }
255
255
 
256
- ._dd_media_cta_5tt5v_232 > a:active {
256
+ ._dd_media_cta_1i6pg_232 > a:active {
257
257
  background-color: #fff;
258
258
  border-color: transparent;
259
259
  color: #1e3860 !important;
260
260
  }
261
261
 
262
- ._headline_5tt5v_262 > p {
262
+ ._headline_1i6pg_262 > p {
263
263
  font: 600 1.5rem / 1.33 var(--header-font-family);
264
264
  flex: 1 1 0%;
265
265
  color: #1e3860;
266
266
  }
267
267
 
268
- ._nav_anchor_5tt5v_268 {
268
+ ._nav_anchor_1i6pg_268 {
269
269
  width: 1.5rem;
270
270
  height: 1.5rem;
271
271
  aspect-ratio: 1;
@@ -273,26 +273,26 @@
273
273
  border-radius: 8px;
274
274
  }
275
275
 
276
- ._headline_cta_5tt5v_276 {
276
+ ._headline_cta_1i6pg_276 {
277
277
  margin-left: 8px;
278
278
  }
279
279
 
280
- ._headline_cta_5tt5v_276 > a {
280
+ ._headline_cta_1i6pg_276 > a {
281
281
  font-weight: 700;
282
282
  line-height: 1.5;
283
283
  text-decoration: none;
284
284
  color: #1e3860;
285
285
  }
286
286
 
287
- ._sub_nav_link_5tt5v_48:hover,
288
- ._signin_wrap_5tt5v_50 a:hover,
289
- ._main_nav_link_5tt5v_26 a:not(.active):hover,
290
- ._dd_site_navs_5tt5v_204 a:hover,
291
- ._site_lists_5tt5v_291 a:hover {
287
+ ._sub_nav_link_1i6pg_48:hover,
288
+ ._signin_wrap_1i6pg_50 a:hover,
289
+ ._main_nav_link_1i6pg_26 a:not(.active):hover,
290
+ ._dd_site_navs_1i6pg_204 a:hover,
291
+ ._site_lists_1i6pg_291 a:hover {
292
292
  text-decoration: underline;
293
293
  }
294
294
 
295
- ._dd_site_navs_5tt5v_204 hr {
295
+ ._dd_site_navs_1i6pg_204 hr {
296
296
  border-style: solid;
297
297
  border-width: 1px;
298
298
  color: #a0aab3;
@@ -301,29 +301,29 @@
301
301
  position: relative;
302
302
  }
303
303
 
304
- ._site_lists_5tt5v_291 {
304
+ ._site_lists_1i6pg_291 {
305
305
  padding-bottom: 1.5rem;
306
306
  }
307
307
 
308
- ._site_lists_5tt5v_291 > * {
308
+ ._site_lists_1i6pg_291 > * {
309
309
  width: 100%;
310
310
  }
311
311
 
312
- ._site_lists_5tt5v_291 a {
312
+ ._site_lists_1i6pg_291 a {
313
313
  color: #323339;
314
314
  text-decoration: none;
315
315
  }
316
316
 
317
- ._site_lists_5tt5v_291 [role="heading"] {
317
+ ._site_lists_1i6pg_291 [role="heading"] {
318
318
  color: #1e3860;
319
319
  font-weight: 700;
320
320
  }
321
321
 
322
- ._site_lists_5tt5v_291 li + li {
322
+ ._site_lists_1i6pg_291 li + li {
323
323
  margin-top: 8px;
324
324
  }
325
325
 
326
- ._hamburger_5tt5v_326 {
326
+ ._hamburger_1i6pg_326 {
327
327
  background: transparent;
328
328
  border: none;
329
329
  font-size: 0px;
@@ -331,24 +331,24 @@
331
331
  outline: none;
332
332
  }
333
333
 
334
- ._hamburger_5tt5v_326:hover,
335
- ._mobile_header_5tt5v_12 button:hover {
334
+ ._hamburger_1i6pg_326:hover,
335
+ ._mobile_header_1i6pg_12 button:hover {
336
336
  cursor: pointer;
337
337
  opacity: 0.8;
338
338
  }
339
339
 
340
- ._signin_wrap_5tt5v_50 > ._mobile_only_5tt5v_340 > a {
340
+ ._signin_wrap_1i6pg_50 > ._mobile_only_1i6pg_340 > a {
341
341
  color: #4a5560;
342
342
  padding: 0;
343
343
  line-height: 1;
344
344
  }
345
345
 
346
- ._mobile_logo_5tt5v_346 {
346
+ ._mobile_logo_1i6pg_346 {
347
347
  flex: 1 1 0%;
348
348
  text-align: center;
349
349
  }
350
350
 
351
- ._highlight_5tt5v_351 > a {
351
+ ._highlight_1i6pg_351 > a {
352
352
  border-bottom: none;
353
353
  color: #2f5b88;
354
354
  font-weight: 700;
@@ -356,7 +356,7 @@
356
356
  }
357
357
 
358
358
  @media (max-width: 1121px) {
359
- ._mobile_logo_5tt5v_346 {
359
+ ._mobile_logo_1i6pg_346 {
360
360
  position: absolute;
361
361
  transform: translateX(-50%);
362
362
  left: 50%;
@@ -364,18 +364,18 @@
364
364
  }
365
365
  }
366
366
 
367
- ._mobile_header_5tt5v_12 {
367
+ ._mobile_header_1i6pg_12 {
368
368
  padding-bottom: 1rem;
369
369
  display: grid;
370
370
  place-items: center;
371
371
  border-bottom: 1px solid #ebebeb;
372
372
  }
373
373
 
374
- ._mobile_header_5tt5v_12 p {
374
+ ._mobile_header_1i6pg_12 p {
375
375
  font: 400 20px / 1.3 var(--header-font-family);
376
376
  }
377
377
 
378
- ._mobile_header_5tt5v_12 button {
378
+ ._mobile_header_1i6pg_12 button {
379
379
  background: none;
380
380
  border: none;
381
381
  position: absolute;
@@ -384,7 +384,7 @@
384
384
  transform: translateY(-50%);
385
385
  }
386
386
 
387
- ._mobile_nav_5tt5v_387 {
387
+ ._mobile_nav_1i6pg_387 {
388
388
  border-right: 1px solid #ebebeb;
389
389
  left: -100%;
390
390
  min-height: 100vh;
@@ -392,19 +392,19 @@
392
392
  top: 0;
393
393
  transition: all 0.4s ease-in-out;
394
394
  width: 100%;
395
+ z-index: 999;
395
396
  }
396
397
 
397
- ._mobile_opened_5tt5v_397 {
398
+ ._mobile_opened_1i6pg_398 {
398
399
  left: 0%;
399
- z-index: 999;
400
400
  }
401
401
 
402
- ._mobile_nav_item_5tt5v_402 {
402
+ ._mobile_nav_item_1i6pg_402 {
403
403
  background-color: #f4f4f4;
404
404
  border-bottom: 1px solid #ebebeb;
405
405
  }
406
406
 
407
- ._mobile_nav_item_5tt5v_402 > a {
407
+ ._mobile_nav_item_1i6pg_402 > a {
408
408
  color: #323339;
409
409
  display: flex;
410
410
  font-weight: 700;
@@ -414,13 +414,13 @@
414
414
  width: 100%;
415
415
  }
416
416
 
417
- ._mobile_nav_item_5tt5v_402._has_dropdown_5tt5v_417 {
417
+ ._mobile_nav_item_1i6pg_402._has_dropdown_1i6pg_417 {
418
418
  background-color: #f4f4f4;
419
419
  isolation: isolate;
420
420
  position: relative;
421
421
  }
422
422
 
423
- ._mobile_nav_item_5tt5v_402._has_dropdown_5tt5v_417::before {
423
+ ._mobile_nav_item_1i6pg_402._has_dropdown_1i6pg_417::before {
424
424
  content: "";
425
425
  background-color: #ebebeb;
426
426
  height: 100%;
@@ -431,27 +431,27 @@
431
431
  z-index: -1;
432
432
  }
433
433
 
434
- ._mobile_nav_item_5tt5v_402._has_dropdown_5tt5v_417 > a {
434
+ ._mobile_nav_item_1i6pg_402._has_dropdown_1i6pg_417 > a {
435
435
  color: #1e3860;
436
436
  }
437
437
 
438
- ._icon_wrap_5tt5v_438 {
438
+ ._icon_wrap_1i6pg_438 {
439
439
  line-height: 1;
440
440
  height: 24px;
441
441
  }
442
442
 
443
- ._mobile_footer_5tt5v_443 {
443
+ ._mobile_footer_1i6pg_443 {
444
444
  position: relative;
445
445
  width: 100%;
446
446
  }
447
447
 
448
- ._mobile_footer_content_5tt5v_448 {
448
+ ._mobile_footer_content_1i6pg_448 {
449
449
  background-color: #f4f4f4;
450
450
  flex: 1 1 0%;
451
451
  padding: 16px 24px 16px 40px;
452
452
  }
453
453
 
454
- ._mobile_footer_content_5tt5v_448 p {
454
+ ._mobile_footer_content_1i6pg_448 p {
455
455
  line-height: 1.5;
456
456
  text-overflow: ellipsis;
457
457
  display: -webkit-box;
@@ -459,17 +459,17 @@
459
459
  -webkit-line-clamp: 2;
460
460
  }
461
461
 
462
- ._mobile_footer_media_5tt5v_462 {
462
+ ._mobile_footer_media_1i6pg_462 {
463
463
  flex-basis: 42%;
464
464
  background: url("https://images.axos.com/o9ov1v03uwqk/5LzVOJ16CkxenX8yTyoeHe/71d6e3fafbeeef1074dfa4160a94d1ae/axos-advisor-contact-us-today-as295109964_.webp")
465
465
  no-repeat center center / cover;
466
466
  }
467
467
 
468
- ._footer_cta_5tt5v_468 {
468
+ ._footer_cta_1i6pg_468 {
469
469
  margin-top: 3px;
470
470
  }
471
471
 
472
- ._footer_cta_5tt5v_468 a {
472
+ ._footer_cta_1i6pg_468 a {
473
473
  border-radius: 4px;
474
474
  border: 2px solid transparent;
475
475
  color: #fff;
@@ -479,31 +479,31 @@
479
479
  text-decoration: none;
480
480
  }
481
481
 
482
- ._footer_cta_5tt5v_468 a:hover {
482
+ ._footer_cta_1i6pg_468 a:hover {
483
483
  background-color: transparent;
484
484
  text-decoration: underline;
485
485
  }
486
486
 
487
- ._footer_cta_5tt5v_468 a:active {
487
+ ._footer_cta_1i6pg_468 a:active {
488
488
  border-color: transparent;
489
489
  color: #fff;
490
490
  }
491
491
 
492
- ._mobile_footer_5tt5v_443 > .flex_row {
492
+ ._mobile_footer_1i6pg_443 > .flex_row {
493
493
  min-height: 112px;
494
494
  }
495
495
 
496
- ._inner_wrapper_5tt5v_496 {
496
+ ._inner_wrapper_1i6pg_496 {
497
497
  max-height: 100vh;
498
498
  overflow-y: scroll;
499
499
  }
500
500
 
501
- ._btn_5tt5v_501 {
501
+ ._btn_1i6pg_501 {
502
502
  display: block;
503
503
  position: relative;
504
504
  }
505
505
 
506
- ._sub_menu_5tt5v_506 {
506
+ ._sub_menu_1i6pg_506 {
507
507
  overflow: hidden;
508
508
  max-height: 0;
509
509
  transition: max-height 0.8s ease-out;
@@ -511,8 +511,8 @@
511
511
  overflow-y: scroll;
512
512
  }
513
513
 
514
- ._sub_menu_5tt5v_506 a,
515
- ._sub_menu_5tt5v_506 span {
514
+ ._sub_menu_1i6pg_506 a,
515
+ ._sub_menu_1i6pg_506 span {
516
516
  display: block;
517
517
  padding: 12px 14px 12px 64px;
518
518
  position: relative;
@@ -520,15 +520,15 @@
520
520
  text-decoration: none;
521
521
  }
522
522
 
523
- ._sub_menu_5tt5v_506 ._main_5tt5v_26 {
523
+ ._sub_menu_1i6pg_506 ._main_1i6pg_26 {
524
524
  font-weight: 700;
525
525
  }
526
526
 
527
- ._sub_menu_5tt5v_506 a + a {
527
+ ._sub_menu_1i6pg_506 a + a {
528
528
  border-top: 1px solid #ebebeb;
529
529
  }
530
530
 
531
- ._dd_footer_5tt5v_531 {
531
+ ._dd_footer_1i6pg_531 {
532
532
  justify-content: flex-end;
533
533
  flex: 1 1 0%;
534
534
  align-items: end;
@@ -537,51 +537,51 @@
537
537
  }
538
538
 
539
539
  @media (max-width: 1280px) and (min-width: 1121px) {
540
- ._wrapper_5tt5v_5 {
540
+ ._wrapper_1i6pg_5 {
541
541
  width: calc(100% - 28px);
542
542
  }
543
543
 
544
- ._dd_wrapper_5tt5v_190 > ._wrapper_5tt5v_5 {
544
+ ._dd_wrapper_1i6pg_190 > ._wrapper_1i6pg_5 {
545
545
  width: 100%;
546
546
  }
547
547
  }
548
548
 
549
549
  @media (max-width: 1120px) {
550
- ._desktop_only_5tt5v_550 {
550
+ ._desktop_only_1i6pg_550 {
551
551
  display: none !important;
552
552
  }
553
553
  }
554
554
 
555
555
  @media (max-width: 768px) {
556
- ._wrapper_5tt5v_5 {
556
+ ._wrapper_1i6pg_5 {
557
557
  width: calc(100% - 48px);
558
558
  }
559
559
 
560
- ._mobile_header_5tt5v_12 button {
560
+ ._mobile_header_1i6pg_12 button {
561
561
  right: 1.5rem;
562
562
  }
563
563
 
564
- ._mobile_nav_item_5tt5v_402 > a {
564
+ ._mobile_nav_item_1i6pg_402 > a {
565
565
  padding: 16px 24px;
566
566
  }
567
567
 
568
- ._sub_menu_5tt5v_506 a,
569
- ._sub_menu_5tt5v_506 span {
568
+ ._sub_menu_1i6pg_506 a,
569
+ ._sub_menu_1i6pg_506 span {
570
570
  padding-left: 48px;
571
571
  }
572
572
 
573
- ._mobile_nav_item_5tt5v_402._has_dropdown_5tt5v_417::before {
573
+ ._mobile_nav_item_1i6pg_402._has_dropdown_1i6pg_417::before {
574
574
  right: 72px;
575
575
  }
576
576
 
577
- ._mobile_footer_content_5tt5v_448 {
577
+ ._mobile_footer_content_1i6pg_448 {
578
578
  padding-right: 15px;
579
579
  padding-left: 24px;
580
580
  }
581
581
  }
582
582
 
583
583
  @media (max-width: 450px) {
584
- ._footer_cta_5tt5v_468 a {
584
+ ._footer_cta_1i6pg_468 a {
585
585
  white-space: break-spaces;
586
586
  width: 100%;
587
587
  text-align: center;
@@ -589,7 +589,7 @@
589
589
  }
590
590
 
591
591
  @media (min-width: 1121px) {
592
- ._mobile_only_5tt5v_340 {
592
+ ._mobile_only_1i6pg_340 {
593
593
  display: none !important;
594
594
  }
595
595
  }
@@ -217,33 +217,7 @@
217
217
  padding: 0px;
218
218
  margin-top: 24px;
219
219
  }
220
- options => {
221
- var className = config.defaultClassName;
222
- var selections = _objectSpread2(_objectSpread2({}, config.defaultVariants), options);
223
- for (var variantName in selections) {
224
- var _selections$variantNa;
225
- var variantSelection = (_selections$variantNa = selections[variantName]) !== null && _selections$variantNa !== void 0 ? _selections$variantNa : config.defaultVariants[variantName];
226
- if (variantSelection != null) {
227
- var selection = variantSelection;
228
- if (typeof selection === 'boolean') {
229
- // @ts-expect-error
230
- selection = selection === true ? 'true' : 'false';
231
- }
232
- var selectionClassName =
233
- // @ts-expect-error
234
- config.variantClassNames[variantName][selection];
235
- if (selectionClassName) {
236
- className += ' ' + selectionClassName;
237
- }
238
- }
239
- }
240
- for (var [compoundCheck, compoundClassName] of config.compoundVariants) {
241
- if (shouldApplyCompound(compoundCheck, selections, config.defaultVariants)) {
242
- className += ' ' + compoundClassName;
243
- }
244
- }
245
- return className;
246
- }::before {
220
+ ._1hh5tt1n::before {
247
221
  display: none;
248
222
  }
249
223
  ._1hh5tt1s {
package/dist/main.js CHANGED
@@ -43,7 +43,7 @@ import { DealerServices } from "./Forms/DealerServices.js";
43
43
  import { HeroBanner } from "./HeroBanner/index.js";
44
44
  import { Hyperlink } from "./Hyperlink/index.js";
45
45
  import { IconBillboard } from "./IconBillboard/IconBillboard.js";
46
- import { billboard_icon, buttons, containerIconBillboard, content, headerIconBillboard, header_section, layout, list, listItem, section_container, section_text, title } from "./IconBillboard/IconBillboard.css.js";
46
+ import { billboard_icon, buttons, containerIconBillboard, content, headerIconBillboard, header_section, layout, list, listItem, section_body, section_container, section_text, title } from "./IconBillboard/IconBillboard.css.js";
47
47
  import { IconBillboardSet } from "./IconBillboard/IconBillboardSet.js";
48
48
  import { ImageBillboardSet } from "./ImageBillboard/ImageBillboard.js";
49
49
  import { apy_billboard, billboard, billboard_body, billboard_container, billboard_ctas, billboard_header_section, billboard_image, billboard_img, body, body_copy, header, imagePlacement, image_background, mh_330, rate_billboard, rate_container, rate_pad, section_text_ImageBillboard, single_container, sub_bullets, supertag, three_inline, two_inline, up_to } from "./ImageBillboard/ImageBillboard.css.js";
@@ -343,6 +343,7 @@ export {
343
343
  renderSwitch,
344
344
  sec_subtitle,
345
345
  sec_title,
346
+ section_body,
346
347
  section_container,
347
348
  section_text,
348
349
  section_text_ImageBillboard,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@axos-web-dev/shared-components",
3
3
  "description": "Axos shared components library for web.",
4
- "version": "0.0.59",
4
+ "version": "0.0.60",
5
5
  "type": "module",
6
6
  "module": "dist/main.js",
7
7
  "types": "dist/main.d.ts",
@@ -28,15 +28,15 @@
28
28
  "npm:link": "npm run build && npm link"
29
29
  },
30
30
  "dependencies": {
31
- "@hookform/resolvers": "^3.4.0",
31
+ "@hookform/resolvers": "^3.4.2",
32
32
  "@react-input/mask": "^1.2.4",
33
33
  "@react-input/number-format": "^1.0.26",
34
34
  "@storybook/builder-vite": "^7.6.19",
35
35
  "@storybook/preview-api": "^7.6.19",
36
- "@vanilla-extract/css": "^1.15.1",
36
+ "@vanilla-extract/css": "^1.15.2",
37
37
  "@vanilla-extract/recipes": "^0.5.1",
38
38
  "clsx": "^2.1.1",
39
- "react-hook-form": "^7.51.4",
39
+ "react-hook-form": "^7.51.5",
40
40
  "react-markdown": "^9.0.1",
41
41
  "react-use": "^17.5.0",
42
42
  "typed-css-modules": "^0.9.1",
@@ -45,7 +45,6 @@
45
45
  "zustand": "^4.5.2"
46
46
  },
47
47
  "peerDependencies": {
48
- "@vanilla-extract/css": "^1.14.1",
49
48
  "@vanilla-extract/css-utils": "^0.1.3",
50
49
  "@vanilla-extract/recipes": "^0.5.1",
51
50
  "@vanilla-extract/vite-plugin": "^4.0.3",