@axos-web-dev/shared-components 2.0.0-dev.31.insights.1 → 2.0.0-dev.31.insights.2

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.
Files changed (4) hide show
  1. package/dist/Insight/Featured/Featured.js +57 -38
  2. package/dist/Insight/Featured/Header.js +10 -17
  3. package/dist/assets/Insight/Featured/Featured.css +7 -2
  4. package/package.json +1 -1
package/dist/Insight/Featured/Featured.js CHANGED
@@ -103,7 +103,7 @@ import "next/script.js";
103
103
  /* empty css */
104
104
  /* empty css */
105
105
  /* empty css */
106
- import { featured_section, featured_title, featured_grid, featured_maingrid, featured_maingrid_img, ratio, featured_main_wrapper, featured_maingrid_title, featured_maingrid_text, info_details, featured_subgrid, featured_subgrid_item, featured_subgrid_title } from "./Featured.css.js";
106
+ import { featured_section, featured_grid, featured_title, featured_maingrid, featured_maingrid_img, ratio, featured_main_wrapper, featured_maingrid_title, featured_maingrid_text, info_details, featured_subgrid, featured_subgrid_item, featured_subgrid_title } from "./Featured.css.js";
107
107
  import { insight_wrap } from "./Header.css.js";
108
108
  import "../../LandingPageHeader/LandingPageHeader.css.js";
109
109
  import "next/link.js";
@@ -145,22 +145,29 @@ const FeaturedItem = (props) => {
145
145
  const variant = getVariant(fullVariant);
146
146
  const imageUrl = image?.url ? `https:${image.url}` : void 0;
147
147
  return /* @__PURE__ */ jsx("a", { href: url ?? "/", className: featured_subgrid_item, children: /* @__PURE__ */ jsxs("div", { className: "flex", style: { gap: "16px" }, children: [
148
- imageUrl ? /* @__PURE__ */ jsxs("picture", { className: ratio, children: [
149
- /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=avif`, type: "image/avif" }),
150
- /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=webp`, type: "image/webp" }),
151
- /* @__PURE__ */ jsx(
152
- Image,
153
- {
154
- src: imageUrl,
155
- className: clsx(featured_maingrid_img, ratio),
156
- height: 159,
157
- width: 269,
158
- priority: true,
159
- alt: image?.alt ?? ""
160
- }
161
- )
162
- ] }) : null,
163
- /* @__PURE__ */ jsxs("div", { className: "flex gap_24", children: [
148
+ imageUrl ? /* @__PURE__ */ jsxs(
149
+ "picture",
150
+ {
151
+ className: clsx(ratio, "rounded"),
152
+ style: { borderRadius: "12px" },
153
+ children: [
154
+ /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=avif`, type: "image/avif" }),
155
+ /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=webp`, type: "image/webp" }),
156
+ /* @__PURE__ */ jsx(
157
+ Image,
158
+ {
159
+ src: imageUrl,
160
+ className: clsx(featured_maingrid_img, ratio),
161
+ height: 159,
162
+ width: 269,
163
+ priority: true,
164
+ alt: image?.alt ?? ""
165
+ }
166
+ )
167
+ ]
168
+ }
169
+ ) : null,
170
+ /* @__PURE__ */ jsxs("div", { className: "flex_col gap_24", children: [
164
171
  /* @__PURE__ */ jsx("h3", { className: clsx(featured_subgrid_title, title({ variant })), children: featureItemTitle ?? "" }),
165
172
  /* @__PURE__ */ jsxs("div", { className: "flex middle", style: { gap: "4px" }, children: [
166
173
  /* @__PURE__ */ jsx(ClockIcon, {}),
@@ -186,13 +193,25 @@ const Featured = (props) => {
186
193
  const variant = getVariant(fullVariant);
187
194
  const [main, ...restFeatured] = featured;
188
195
  const mainImageUrl = main?.image?.url ? `https:${main.image.url}` : void 0;
189
- return /* @__PURE__ */ jsx("section", { id, className: featured_section, children: /* @__PURE__ */ jsxs("div", { className: insight_wrap, children: [
190
- headline && /* @__PURE__ */ jsx("h2", { className: featured_title, children: headline }),
191
- /* @__PURE__ */ jsxs("div", { className: featured_grid, children: [
196
+ return /* @__PURE__ */ jsx("section", { id, className: featured_section, children: /* @__PURE__ */ jsx("div", { className: insight_wrap, children: /* @__PURE__ */ jsxs("div", { className: featured_grid, children: [
197
+ /* @__PURE__ */ jsxs("div", { children: [
198
+ headline && /* @__PURE__ */ jsx("h2", { className: featured_title, children: headline }),
192
199
  /* @__PURE__ */ jsxs("a", { href: main?.url, className: featured_maingrid, children: [
193
200
  mainImageUrl ? /* @__PURE__ */ jsxs("picture", { className: clsx(ratio, "rounded"), children: [
194
- /* @__PURE__ */ jsx("source", { srcSet: `${mainImageUrl}?fm=avif`, type: "image/avif" }),
195
- /* @__PURE__ */ jsx("source", { srcSet: `${mainImageUrl}?fm=webp`, type: "image/webp" }),
201
+ /* @__PURE__ */ jsx(
202
+ "source",
203
+ {
204
+ srcSet: `${mainImageUrl}?fm=avif`,
205
+ type: "image/avif"
206
+ }
207
+ ),
208
+ /* @__PURE__ */ jsx(
209
+ "source",
210
+ {
211
+ srcSet: `${mainImageUrl}?fm=webp`,
212
+ type: "image/webp"
213
+ }
214
+ ),
196
215
  /* @__PURE__ */ jsx(
197
216
  Image,
198
217
  {
@@ -225,24 +244,24 @@ const Featured = (props) => {
225
244
  /* @__PURE__ */ jsx("span", { className: info_details, style: { fontWeight: "600" }, children: (typeof main?.supertag == "string" && main?.supertag.replaceAll("-", " ")) ?? "" })
226
245
  ] })
227
246
  ] })
228
- ] }),
229
- /* @__PURE__ */ jsxs("div", { children: [
230
- /* @__PURE__ */ jsx("h2", { className: featured_title, children: "Popular topics" }),
231
- /* @__PURE__ */ jsx("div", { className: featured_subgrid, children: restFeatured.map((item) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
232
- FeaturedItem,
233
- {
234
- variant: variant ?? "secondary",
235
- image: item.image,
236
- readingTime: item.readingTime,
237
- supertag: item.supertag,
238
- title: item.title,
239
- url: item.url
240
- },
241
- item.id
242
- ) }, item.id)) })
243
247
  ] })
248
+ ] }),
249
+ /* @__PURE__ */ jsxs("div", { children: [
250
+ /* @__PURE__ */ jsx("h2", { className: featured_title, children: "Popular topics" }),
251
+ /* @__PURE__ */ jsx("div", { className: featured_subgrid, children: restFeatured.map((item) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
252
+ FeaturedItem,
253
+ {
254
+ variant: variant ?? "secondary",
255
+ image: item.image,
256
+ readingTime: item.readingTime,
257
+ supertag: item.supertag,
258
+ title: item.title,
259
+ url: item.url
260
+ },
261
+ item.id
262
+ ) }, item.id)) })
244
263
  ] })
245
- ] }) });
264
+ ] }) }) });
246
265
  };
247
266
  export {
248
267
  Featured,
package/dist/Insight/Featured/Header.js CHANGED
@@ -101,7 +101,7 @@ import "next/script.js";
101
101
  /* empty css */
102
102
  /* empty css */
103
103
  /* empty css */
104
- import { header_title_featured, header_in_insight, insight_wrap, header_featured } from "./Header.css.js";
104
+ import { insight_wrap, header_title_featured, header_in_insight, header_featured } from "./Header.css.js";
105
105
  import "../../LandingPageHeader/LandingPageHeader.css.js";
106
106
  import "next/link.js";
107
107
  /* empty css */
@@ -132,26 +132,19 @@ import "../../StepItemSet/StepItemSet.css.js";
132
132
  /* empty css */
133
133
  const BreadcumbHeader = (props) => {
134
134
  const { section, showTitle = true } = props;
135
- return /* @__PURE__ */ jsx(
136
- "div",
135
+ return /* @__PURE__ */ jsx("div", { className: clsx(!showTitle ? header_in_insight : "", header_featured), children: /* @__PURE__ */ jsx("div", { className: insight_wrap, children: showTitle && /* @__PURE__ */ jsxs(
136
+ "h1",
137
137
  {
138
138
  className: clsx(
139
- !showTitle ? header_in_insight : "",
140
- insight_wrap,
141
- header_featured
139
+ title({ variant: "primary" }),
140
+ header_title_featured
142
141
  ),
143
- children: showTitle && /* @__PURE__ */ jsxs(
144
- "h1",
145
- {
146
- className: clsx(title({ variant: "primary" }), header_title_featured),
147
- children: [
148
- section?.replaceAll("-", " "),
149
- " Insights"
150
- ]
151
- }
152
- )
142
+ children: [
143
+ section?.replaceAll("-", " "),
144
+ " Insights"
145
+ ]
153
146
  }
154
- );
147
+ ) }) });
155
148
  };
156
149
  export {
157
150
  BreadcumbHeader
package/dist/assets/Insight/Featured/Featured.css CHANGED
@@ -48,6 +48,12 @@
48
48
  font-size: 16px;
49
49
  line-height: 1.5;
50
50
  margin-bottom: 0;
51
+ display: -webkit-box;
52
+ -webkit-box-orient: vertical;
53
+ line-clamp: 2;
54
+ -webkit-line-clamp: 2;
55
+ overflow: hidden;
56
+ text-overflow: ellipsis;
51
57
  }
52
58
  ._1sr2o6v9 {
53
59
  color: var(--_1073cm8f);
@@ -65,8 +71,6 @@
65
71
  text-decoration: none;
66
72
  }
67
73
  ._1sr2o6vc {
68
- margin-bottom: 8px;
69
- max-height: min(76px, 108px);
70
74
  display: -webkit-box;
71
75
  -webkit-box-orient: vertical;
72
76
  line-clamp: 2;
@@ -74,6 +78,7 @@
74
78
  overflow: hidden;
75
79
  text-overflow: ellipsis;
76
80
  width: 100%;
81
+ font-size: 20px !important;
77
82
  }
78
83
  ._1sr2o6vd {
79
84
  display: inline-block;
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": "2.0.0-dev.31.insights.1",
4
+ "version": "2.0.0-dev.31.insights.2",
5
5
  "type": "module",
6
6
  "main": "index.js",
7
7
  "module": "dist/main.js",