hds-web 1.38.6 → 1.38.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hds-web",
3
- "version": "1.38.6",
3
+ "version": "1.38.8",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es.js",
@@ -2,6 +2,7 @@ import React from "react";
2
2
  import { HDSColor } from "../../../foundation/ColorPalette";
3
3
  import { FlyoutB, FlyoutA, FlyoutD } from "../Menu";
4
4
  import ConnectorsDropdown from "../Menu/ConnectorsDropdown";
5
+ import ResourcesDropdown from "../Menu/ResourcesDropdown";
5
6
 
6
7
  export default function DropdownA(props) {
7
8
  return (
@@ -32,6 +33,13 @@ export default function DropdownA(props) {
32
33
  // split={item.split}
33
34
  split={true}
34
35
  />
36
+ ) : item?.label === "RESOURCES" ? (
37
+ <ResourcesDropdown
38
+ label={item.label}
39
+ childArray={item.childArray}
40
+ // split={item.split}
41
+ split={true}
42
+ />
35
43
  ) : (
36
44
  <FlyoutA
37
45
  label={item.label}
@@ -62,7 +70,7 @@ export default function DropdownA(props) {
62
70
  </div>
63
71
  </div>
64
72
  } */}
65
- {props.flyoutD && <FlyoutD />}
73
+ {props.flyoutD && <FlyoutD {...props?.flyoutD} />}
66
74
  </div>
67
75
  </div>
68
76
  );
@@ -0,0 +1,106 @@
1
+ import React from "react";
2
+ import { Icon } from "../../common-components/Icon";
3
+ import { Typography } from "../../../foundation/Typography";
4
+
5
+ export default function ResourcesDropdown(props) {
6
+ const { split } = props;
7
+
8
+ const cardLayout = (label, childArray) => (
9
+ <div className=" group h-full">
10
+ <div className={`w-full h-full ` + (split ? " " : " rounded-2xl")}>
11
+ <div className={`w-full py-6 px-4`}>
12
+ {label ? (
13
+ <Typography
14
+ textStyle="h6"
15
+ className=" uppercase group-hover/split:text-neutral-1000 group-hover:text-neutral-1000 group-hover-transition text-neutral-500 mb-4"
16
+ >
17
+ {label}
18
+ </Typography>
19
+ ) : (
20
+ <div className="mb-8"></div>
21
+ )}
22
+ <div className={` tb:tb:grid tb:tb:grid-cols-1 tb:min-w-[200px] `}>
23
+ {childArray &&
24
+ childArray.map((item) => (
25
+ <div
26
+ key={item.name}
27
+ className="relative pb-2 flex rounded-lg items-center"
28
+ >
29
+ <a href={item.href} className="w-full">
30
+ <div className="flex group/icon pl-2 py-2 pr-3 hover:pl-[9px] hover:bg-neutral-100 rounded-lg flex-row w-full justify-between items-center">
31
+ <div className="flex gap-2 flex-row items-center">
32
+ <div className="flex rounded-lg items-center group-hover:bg-white">
33
+ {item.icon && (
34
+ <Icon
35
+ height={
36
+ "h-5 w-5 stroke-2 " +
37
+ (item.icon === "discord" ||
38
+ item.icon === "octoface" ||
39
+ item.icon === "meetup"
40
+ ? ""
41
+ : "group-hover/icon:stroke-blue-500 ")
42
+ }
43
+ variant={item.icon}
44
+ strokeClass={item.strokeClass}
45
+ />
46
+ )}
47
+ </div>
48
+ <Typography
49
+ textStyle="body3c-medium"
50
+ className="text-neutral-1000 group-hover/icon:text-blue-600 hover:transition-all hover:duration-300 hover:ease-in-out whitespace-nowrap overflow-clip"
51
+ >
52
+ {item.name}
53
+ </Typography>
54
+ </div>
55
+ <div className="flex group-hover/icon:translate-x-1 transform transition-all duration-200 ease-in-out tb-l:-ml-1">
56
+ <Icon
57
+ height={
58
+ "h-4 w-4 stroke-2 invisible group-hover/icon:visible transition-all ease-in-out "
59
+ }
60
+ variant={"chevronright"}
61
+ strokeClass={"stroke-blue-500"}
62
+ />
63
+ </div>
64
+ </div>
65
+ </a>
66
+ </div>
67
+ ))}
68
+ </div>
69
+ </div>
70
+ </div>
71
+ </div>
72
+ );
73
+
74
+ return (
75
+ <>
76
+ {split ? (
77
+ <>
78
+ <div className="hds-hidden tb-l:flex h-full">
79
+ <div className="rounded-l-2xl">
80
+ {cardLayout(
81
+ props.label,
82
+ props.childArray.slice(
83
+ 0,
84
+ Math.ceil(props.childArray.length / 2)
85
+ )
86
+ )}
87
+ </div>
88
+ <div className="group/split rounded-r-2xl tb-l:-ml-6">
89
+ {cardLayout(
90
+ null,
91
+ props.childArray.slice(Math.ceil(props.childArray.length / 2))
92
+ )}
93
+ </div>
94
+ </div>
95
+ <div className="hds-hidden-tbl h-full rounded-2xl">
96
+ {cardLayout(props.label, props.childArray)}
97
+ </div>
98
+ </>
99
+ ) : (
100
+ <div className=" shadow h-full rounded-2xl">
101
+ {cardLayout(props.label, props.childArray)}
102
+ </div>
103
+ )}
104
+ </>
105
+ );
106
+ }
@@ -1,12 +1,12 @@
1
1
  import React from "react";
2
2
 
3
- export default function FlyoutD() {
3
+ export default function FlyoutD(props) {
4
4
  return (
5
5
  <div className="flex justify-center">
6
- <a href={`https://hasura.io/ddn`}>
6
+ <a href={props?.link}>
7
7
  <img
8
- src="https://res.cloudinary.com/dh8fp23nd/image/upload/v1716906625/Frame_12754_2_iaixzx.png"
9
- alt="Hasura DDN"
8
+ src={props?.cardImg}
9
+ alt={props?.cardImgAlt}
10
10
  className="w-full min-w-[204px] max-w-[204px] mt-2 tb-l:mt-0"
11
11
  />
12
12
  </a>
@@ -21,7 +21,7 @@ const updatePGParam = (originalLink, websiteKey) => {
21
21
  };
22
22
 
23
23
  export default function V3Header(props) {
24
- const listSize = props.HEADER_LIST.length;
24
+ // const listSize = props.HEADER_LIST.length;
25
25
 
26
26
  const [mobileNavOpen, setmobileNavOpen] = useState(false);
27
27
 
@@ -29,17 +29,19 @@ export default function V3Header(props) {
29
29
 
30
30
  const [isDeveloper, setIsDeveloper] = useState(false);
31
31
 
32
+ const [isResources, setIsResources] = useState(false);
33
+
32
34
  const [isCompany, setIsCompany] = useState(false);
33
35
 
34
36
  const [currentTab, setCurrentTab] = useState("");
35
37
 
36
- const [isShown, setIsShown] = useState(false);
38
+ // const [isShown, setIsShown] = useState(false);
37
39
 
38
40
  const [isArrowActive, setIsArrowActive] = useState(false);
39
41
 
40
42
  const signUpLink = props.signUpLink
41
43
  ? props.signUpLink
42
- : "https://cloud.hasura.io/signup?pg=sample-apps&plcmt=header&cta=try-hasura&tech=default";
44
+ : "https://console.hasura.io";
43
45
 
44
46
  const logInLink = props.logInLink
45
47
  ? props.logInLink
@@ -172,6 +174,7 @@ export default function V3Header(props) {
172
174
  <>
173
175
  {renderDropdownContainer(headerList, 0)}
174
176
  {renderDropdownContainer(headerList, 1)}
177
+ {renderDropdownContainer(headerList, 2)}
175
178
  {
176
179
  <a href="/customers">
177
180
  <Typography
@@ -186,8 +189,6 @@ export default function V3Header(props) {
186
189
  </Typography>
187
190
  </a>
188
191
  }
189
- {renderDropdownContainer(headerList, 3)}
190
-
191
192
  {
192
193
  <a href="/pricing">
193
194
  <Typography
@@ -226,10 +227,21 @@ export default function V3Header(props) {
226
227
  primaryCard={HEADER_LIST[1]["primaryCard"]}
227
228
  secondaryCardArr={HEADER_LIST[1]["secondaryCardArr"]}
228
229
  tertiaryCard={HEADER_LIST[1]["tertiaryCard"]}
230
+ flyoutD={HEADER_LIST[1]["flyoutD"]}
231
+ />
232
+ </div>
233
+ )}
234
+ {isResources && (
235
+ <div className="product_resources">
236
+ <V3Dropdown
237
+ primaryCard={HEADER_LIST[2]["primaryCard"]}
238
+ secondaryCardArr={HEADER_LIST[2]["secondaryCardArr"]}
239
+ tertiaryCard={HEADER_LIST[2]["tertiaryCard"]}
240
+ flyoutD={HEADER_LIST[2]["flyoutD"]}
229
241
  />
230
242
  </div>
231
243
  )}
232
- {isCompany && (
244
+ {/* {isCompany && (
233
245
  <div className="product_company">
234
246
  <V3Dropdown
235
247
  primaryCard={HEADER_LIST[3]["primaryCard"]}
@@ -237,7 +249,7 @@ export default function V3Header(props) {
237
249
  tertiaryCard={HEADER_LIST[3]["tertiaryCard"]}
238
250
  />
239
251
  </div>
240
- )}
252
+ )} */}
241
253
  </div>
242
254
  </div>
243
255
  );
@@ -259,6 +271,7 @@ export default function V3Header(props) {
259
271
  function handleMbDropdownClose() {
260
272
  setmobileNavOpen(!mobileNavOpen);
261
273
  setIsDeveloper(false);
274
+ setIsResources(false);
262
275
  setIsCompany(false);
263
276
  setIsProduct(false);
264
277
  setCurrentTab("");
@@ -269,6 +282,7 @@ export default function V3Header(props) {
269
282
  }
270
283
  function handleBackClick() {
271
284
  setIsDeveloper(false);
285
+ setIsResources(false);
272
286
  setIsCompany(false);
273
287
  setIsProduct(false);
274
288
  setCurrentTab("");
@@ -285,6 +299,9 @@ export default function V3Header(props) {
285
299
  if (title === "Developer") {
286
300
  setIsDeveloper(true);
287
301
  }
302
+ if (title === "Resources") {
303
+ setIsResources(true);
304
+ }
288
305
  if (title === "Customers") {
289
306
  window.location.href = "/customers";
290
307
  }
@@ -304,10 +321,12 @@ export default function V3Header(props) {
304
321
  setCurrentTab("Product");
305
322
  } else if (isDeveloper) {
306
323
  setCurrentTab("Developer");
324
+ } else if (isResources) {
325
+ setCurrentTab("Resources");
307
326
  } else if (isCompany) {
308
327
  setCurrentTab("Company");
309
328
  }
310
- }, [isProduct, isDeveloper, isCompany]);
329
+ }, [isProduct, isDeveloper, isCompany, isResources]);
311
330
 
312
331
  // **************************** //
313
332
 
@@ -336,7 +355,7 @@ export default function V3Header(props) {
336
355
  <div className={"h-full " + (mobileNavOpen ? " hds-hidden" : "")}>
337
356
  {!props.hideSearch && <AlgoliaSearch {...props} />}
338
357
  </div>
339
- {!(isCompany || isDeveloper || isProduct) && (
358
+ {!(isCompany || isDeveloper || isProduct || isResources) && (
340
359
  <motion.div
341
360
  initial={{ opacity: 0 }}
342
361
  animate={{ opacity: 1 }}
@@ -435,7 +454,7 @@ export default function V3Header(props) {
435
454
  >
436
455
  <div className="bg-neutral-100 h-[calc(100%-80px)] rounded-2xl overflow-y-scroll scrollbar-hide">
437
456
  <div className="pt-6 pb-4 tb:mr-[12px] mr-[30px] min-h-[36px] flex flex-row justify-between items-center sticky top-0 bg-neutral-100 z-50 ">
438
- {(isCompany || isDeveloper || isProduct) && (
457
+ {(isCompany || isDeveloper || isProduct || isResources) && (
439
458
  <div
440
459
  className=" flex flex-row justify-start z-10"
441
460
  onClick={() => handleBackClick()}
@@ -460,7 +479,7 @@ export default function V3Header(props) {
460
479
  {currentTab}
461
480
  </Typography>
462
481
  </motion.div>
463
- {(isCompany || isDeveloper || isProduct) && (
482
+ {(isCompany || isDeveloper || isProduct || isResources) && (
464
483
  <motion.div
465
484
  initial={{ opacity: 0 }}
466
485
  animate={{ opacity: 1 }}
@@ -477,7 +496,7 @@ export default function V3Header(props) {
477
496
  )}
478
497
  </div>
479
498
  <AnimatePresence mode="wait" exit={false}>
480
- {isProduct || isDeveloper || isCompany ? (
499
+ {isProduct || isDeveloper || isCompany || isResources ? (
481
500
  <motion.div
482
501
  key="hey"
483
502
  exit={{ opacity: 0, y: [0, 300] }}
@@ -487,7 +506,7 @@ export default function V3Header(props) {
487
506
  exit: { duration: 0.3 },
488
507
  opacity: { ease: "easeIn" },
489
508
  }}
490
- when={isProduct || isDeveloper || isCompany}
509
+ when={isProduct || isDeveloper || isCompany || isResources}
491
510
  className="flex flex-col justify-between "
492
511
  >
493
512
  <div className="flex flex-col justify-between rounded-2xl h-full">
@@ -631,8 +650,7 @@ V3Header.defaultProps = {
631
650
  cta_leftVariantIcon: "zap",
632
651
  cta_leftVariantIconColor: "#6C737F",
633
652
  cta_text: "Get Started",
634
- cta_link:
635
- "https://cloud.hasura.io/signup?pg=nav&plcmt=product-dropdown&cta=get-started",
653
+ cta_link: "https://console.hasura.io/",
636
654
  },
637
655
  ],
638
656
  },
@@ -649,44 +667,51 @@ V3Header.defaultProps = {
649
667
  },
650
668
  {
651
669
  description: "",
652
- href: "/graphql/database/mongodb",
670
+ href: "/graphql/database/mysql",
653
671
  icon: "database01",
654
- name: "MongoDB",
672
+ name: "MySQL",
655
673
  strokeClass: "stroke-blue-500",
656
674
  },
657
675
  {
658
676
  description: "",
659
- href: "/graphql/database/mysql",
677
+ href: "/graphql/database/elasticsearch",
660
678
  icon: "database01",
661
- name: "MySQL",
679
+ name: "Elasticsearch",
662
680
  strokeClass: "stroke-blue-500",
663
681
  },
664
682
  {
665
683
  description: "",
666
- href: "/graphql/database/snowflake",
684
+ href: "/graphql/database/sql-server",
667
685
  icon: "database01",
668
- name: "Snowflake",
686
+ name: "SQL Server",
669
687
  strokeClass: "stroke-blue-500",
670
688
  },
671
689
  {
672
690
  description: "",
673
- href: "/graphql/database/oracle",
691
+ href: "/graphql/database/mongodb",
674
692
  icon: "database01",
675
- name: "Oracle",
693
+ name: "MongoDB",
676
694
  strokeClass: "stroke-blue-500",
677
695
  },
678
696
  {
679
697
  description: "",
680
- href: "/graphql/database/sql-server",
698
+ href: "/graphql/database/snowflake",
681
699
  icon: "database01",
682
- name: "SQL Server",
700
+ name: "Snowflake",
701
+ strokeClass: "stroke-blue-500",
702
+ },
703
+ {
704
+ description: "",
705
+ href: "/graphql/database/clickhouse",
706
+ icon: "database01",
707
+ name: "ClickHouse",
683
708
  strokeClass: "stroke-blue-500",
684
709
  },
685
710
  {
686
711
  description: "",
687
712
  href: "/graphql/database",
688
713
  icon: "database01",
689
- name: "See all",
714
+ name: "More",
690
715
  strokeClass: "stroke-blue-500",
691
716
  },
692
717
  ],
@@ -694,7 +719,8 @@ V3Header.defaultProps = {
694
719
  ],
695
720
  flyoutD: {
696
721
  link: "https://hasura.io/ddn",
697
- cardImg: `https://res.cloudinary.com/dh8fp23nd/image/upload/v1716906625/Frame_12754_2_iaixzx.png`,
722
+ cardImg: `https://res.cloudinary.com/dh8fp23nd/image/upload/v1721205269/Frame_2610016_1_jluh5u.png`,
723
+ cardImgAlt: "Hasura DDN",
698
724
  },
699
725
  },
700
726
  {
@@ -704,56 +730,16 @@ V3Header.defaultProps = {
704
730
  childArray: [
705
731
  {
706
732
  description: "",
707
- href: "/docs/latest/index/",
733
+ href: "/docs/3.0/index/",
708
734
  icon: "file02",
709
735
  name: "Documentation",
710
736
  strokeClass: "stroke-neutral-500",
711
737
  },
712
738
  {
713
739
  description: "",
714
- href: "/hub",
715
- icon: "hasura",
716
- name: "Hasura Hub",
717
- strokeClass: "stroke-neutral-500",
718
- },
719
- {
720
- description: "",
721
- href: "/reference-app/",
740
+ href: "/connectors",
722
741
  icon: "route",
723
- name: "Guides",
724
- strokeClass: "stroke-neutral-500",
725
- },
726
- {
727
- description: "",
728
- href: "/graphql/",
729
- icon: "asterisk02",
730
- name: "GraphQL Hub",
731
- strokeClass: "stroke-neutral-500",
732
- },
733
- {
734
- description: "",
735
- href: "https://cloud.hasura.io/public/graphiql",
736
- icon: "codebrowser",
737
- name: "GraphiQL",
738
- strokeClass: "stroke-neutral-500",
739
- },
740
- {
741
- description: "",
742
- href: "/changelog",
743
- icon: "gitpullrequest",
744
- name: "Changelog",
745
- strokeClass: "stroke-neutral-500",
746
- },
747
- ],
748
- label: "BUILD",
749
- },
750
- {
751
- childArray: [
752
- {
753
- description: "",
754
- href: "/blog",
755
- icon: "bookopen01",
756
- name: "Blog",
742
+ name: "Connector Hub",
757
743
  strokeClass: "stroke-neutral-500",
758
744
  },
759
745
  {
@@ -763,22 +749,8 @@ V3Header.defaultProps = {
763
749
  name: "Tutorials",
764
750
  strokeClass: "stroke-neutral-500",
765
751
  },
766
- {
767
- description: "",
768
- href: "/events",
769
- icon: "calendarplus02",
770
- name: "Events",
771
- strokeClass: "stroke-neutral-500",
772
- },
773
- {
774
- description: "",
775
- href: "/sample-apps/",
776
- icon: "box",
777
- name: "Resources",
778
- strokeClass: "stroke-neutral-500",
779
- },
780
752
  ],
781
- label: "Learn",
753
+ label: "BUILD",
782
754
  },
783
755
  {
784
756
  childArray: [
@@ -814,107 +786,64 @@ V3Header.defaultProps = {
814
786
  label: "Connect",
815
787
  },
816
788
  ],
817
- tertiaryCard: [
818
- {
819
- title: "HasuraCon 2023 is here!",
820
-
821
- title_colorClass: "text-neutral-900",
822
- img_url:
823
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/hascon_211daeb83a.png",
824
- },
825
- {
826
- title: "Top 6 Architecture Trends for API Development",
827
-
828
- title_colorClass: "text-neutral-900",
829
- img_url:
830
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/api_trends_0a035678d8.png",
831
- },
832
- {
833
- title: "Announcing Hasura integration with Snowflake",
834
-
835
- title_colorClass: "text-neutral-900",
836
- img_url:
837
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/snowflake_def20494db.png",
838
- },
839
- ],
789
+ flyoutD: {
790
+ link: "https://hasura.io/events/community-call/latest",
791
+ cardImg: `https://res.cloudinary.com/dh8fp23nd/image/upload/v1721210357/cc-blog-july_2_1_k8k22u.png`,
792
+ cardImgAlt: "Hasura Community Call",
793
+ },
840
794
  },
841
795
  {
842
- title: "Customers",
843
- href: "",
844
- },
845
-
846
- {
847
- title: "Company",
796
+ title: "Resources",
848
797
  secondaryCardArr: [
849
798
  {
850
799
  childArray: [
851
800
  {
852
801
  description: "",
853
- href: "/about/",
854
- icon: "pentool02",
855
- name: "Our Story",
802
+ href: "/blog",
803
+ icon: "bookopen01",
804
+ name: "Blogs",
805
+ strokeClass: "stroke-neutral-500",
806
+ },
807
+ {
808
+ description: "",
809
+ href: "/events?category=Webinar#wall-section",
810
+ icon: "videorecorder",
811
+ name: "Webinars",
856
812
  strokeClass: "stroke-neutral-500",
857
813
  },
858
814
  {
859
815
  description: "",
860
- href: "/partners",
861
- icon: "intersectcircle",
862
- name: "Partners",
816
+ href: "/graphql/",
817
+ icon: "home04",
818
+ name: "GraphQL Hub",
863
819
  strokeClass: "stroke-neutral-500",
864
820
  },
865
821
  {
866
822
  description: "",
867
- href: "/careers/",
868
- icon: "hearthand",
869
- name: "Work at Hasura",
823
+ href: "/events",
824
+ icon: "calendarplus02",
825
+ name: "Events",
826
+ strokeClass: "stroke-neutral-500",
827
+ },
828
+ {
829
+ description: "",
830
+ href: "/",
831
+ icon: "file05",
832
+ name: "Whitepapers",
833
+ strokeClass: "stroke-neutral-500",
834
+ },
835
+ {
836
+ description: "",
837
+ href: "https://supergraph.io/",
838
+ icon: "beziercurve02",
839
+ name: "Supergraph Manifesto",
870
840
  strokeClass: "stroke-neutral-500",
871
841
  },
872
- // {
873
- // description: '',
874
- // href: '/press/',
875
- // icon: 'headingsquare',
876
- // name: 'Newsroom',
877
- // strokeClass: 'stroke-neutral-500'
878
- // },
879
- // {
880
- // description: '',
881
- // href: '/brand',
882
- // icon: 'star06',
883
- // name: 'Brand',
884
- // strokeClass: 'stroke-neutral-500'
885
- // },
886
842
  ],
887
- label: "Company",
888
- },
889
- ],
890
- tertiaryCard: [
891
- {
892
- title: "HasuraCon 2023 is here!",
893
-
894
- title_colorClass: "text-neutral-900",
895
- img_url:
896
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/hascon_211daeb83a.png",
897
- },
898
- {
899
- title: "Top 6 Architecture Trends for API Development",
900
-
901
- title_colorClass: "text-neutral-900",
902
- img_url:
903
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/api_trends_0a035678d8.png",
904
- },
905
- {
906
- title: "Announcing Hasura integration with Snowflake",
907
-
908
- title_colorClass: "text-neutral-900",
909
- img_url:
910
- "https://res.cloudinary.com/hasura-cms-uploads/image/upload/v1687040455/snowflake_def20494db.png",
843
+ label: "RESOURCES",
911
844
  },
912
845
  ],
913
846
  },
914
- {
915
- title: "Pricing",
916
- href: "",
917
- },
918
847
  ],
919
848
  headerUrl: "/",
920
849
  };
@@ -11172,6 +11172,28 @@ select{
11172
11172
  min-width: 500px;
11173
11173
  }
11174
11174
 
11175
+ .tb\:min-w-\[190px\]{
11176
+ min-width: 190px;
11177
+ }
11178
+
11179
+ .tb\:min-w-\[170px\]{
11180
+ min-width: 170px;
11181
+ }
11182
+
11183
+ .tb\:min-w-\[180px\]{
11184
+ min-width: 180px;
11185
+ }
11186
+
11187
+ .tb\:min-w-\[200px\]{
11188
+ min-width: 200px;
11189
+ }
11190
+
11191
+ .tb\:min-w-fit{
11192
+ min-width: -webkit-fit-content;
11193
+ min-width: -moz-fit-content;
11194
+ min-width: fit-content;
11195
+ }
11196
+
11175
11197
  .tb\:max-w-\[17rem\]{
11176
11198
  max-width: 17rem;
11177
11199
  }