fix: styleprop should be number

GoodDollar · Nov 20, 2024 · 47071d6 · 47071d6
1 parent fb2fd61
commit 47071d6
Show file tree

Hide file tree

Showing 9 changed files with 8 additions and 9 deletions.
diff --git a/packages/good-design/src/apps/newsfeed/NewsFeed.tsx b/packages/good-design/src/apps/newsfeed/NewsFeed.tsx
@@ -16,7 +16,7 @@ const NewsCardContent = ({ content }: { content: any }) => (
     fontFamily="subheading"
     fontSize="2xs"
     fontWeight="400"
-    lineHeight="130%"
+    lineHeight={14.4} //130%
     paddingBottom={2}
     maxWidth={400}
   >

diff --git a/packages/good-design/src/apps/ubi/components/TransactionStateCard.tsx b/packages/good-design/src/apps/ubi/components/TransactionStateCard.tsx
@@ -82,7 +82,7 @@ export const TransactionCard = withTheme({ name: "TransactionCard" })(
                   fontSize="4xs"
                   fontFamily="subheading"
                   fontWeight="400"
-                  lineHeight="12"
+                  lineHeight={12}
                   color="goodGrey.600"
                 />
                 {/* Todo: should read subtitle from pool details*/}

diff --git a/packages/good-design/src/core/buttons/ActionButton.tsx b/packages/good-design/src/core/buttons/ActionButton.tsx
@@ -27,7 +27,6 @@ export const theme = {
   defaultProps: {},
   baseStyle: {
     fontSize: "xl",
-    lineHeight: "2xs",
     fontWeight: "black",
     textTransform: "capitalize",
     boxShadow: "3px 3px 10px -1px rgba(11, 27, 102, 0.304824)",

diff --git a/packages/good-design/src/core/layout/ActionHeader.tsx b/packages/good-design/src/core/layout/ActionHeader.tsx
@@ -10,7 +10,7 @@ interface ActionHeaderProps {
 
 const ActionHeader = memo(({ textColor, actionText }: ActionHeaderProps) => (
   <Box backgroundColor={"white"}>
-    <Title fontSize="xl" mb="2" fontWeight="bold" lineHeight="36px">
+    <Title fontSize="xl" mb="2" fontWeight="bold" lineHeight={36}>
       Action Required
     </Title>
     <Text color={textColor} fontFamily="subheading" fontWeight="normal" fontSize="md">

diff --git a/packages/good-design/src/core/layout/ClaimCard.tsx b/packages/good-design/src/core/layout/ClaimCard.tsx
@@ -66,7 +66,7 @@ const ClaimCard: FC<ClaimCardProps> = ({ content = [], title, bgColor, externalL
       }}
       viewInteraction={{ hover: { shadow: "3" } }}
     >
-      <Title fontSize="xl" lineHeight="36" pb="2" fontWeight="bold" fontFamily="heading" color={title.color}>
+      <Title fontSize="xl" lineHeight={36} pb={2} fontWeight="bold" fontFamily="heading" color={title.color}>
         {title.text}
       </Title>
 

diff --git a/packages/good-design/src/core/layout/ImageCard.tsx b/packages/good-design/src/core/layout/ImageCard.tsx
@@ -108,7 +108,7 @@ export const theme = {
           fontFamily: "subheading",
           fontSize: "2xs",
           fontWeight: "400",
-          lineHeight: "130%",
+          lineHeight: 14.4, // "130%"
           paddingBottom: 2,
           maxWidth: 400,
           paddingTop: 2,

diff --git a/packages/good-design/src/core/layout/Title.tsx b/packages/good-design/src/core/layout/Title.tsx
@@ -15,7 +15,7 @@ export const theme = {
   baseStyle: {
     fontFamily: "heading",
     fontWeight: "bold",
-    lineHeight: "md"
+    lineHeight: 27.6
   },
   sizes: {
     lg: {

diff --git a/packages/good-design/src/core/web3/modals/BasicStyledModal.tsx b/packages/good-design/src/core/web3/modals/BasicStyledModal.tsx
@@ -46,7 +46,7 @@ export type StyledModalProps = CtaOrLearnModalProps | AltModalProps;
 const ModalHeader = ({ title, variant = "title-gdblue" }: { title: any; variant: any }) => {
   const transTitle = typeof title === "object" ? title.title : { id: title, values: {} };
 
-  return <TransTitle t={transTitle.id} variant={variant} fontSize="xl" values={transTitle.values} lineHeight="27.5" />;
+  return <TransTitle t={transTitle.id} variant={variant} fontSize="xl" values={transTitle.values} lineHeight={27.5} />;
 };
 
 export const ModalLoaderBody = () => <SpinnerCheckMark />;

diff --git a/packages/good-design/src/theme/theme.ts b/packages/good-design/src/theme/theme.ts
@@ -132,7 +132,7 @@ export const theme = extendTheme({
         fontSize: "sm",
         fontStyle: "normal",
         fontWeight: 400,
-        lineHeight: "130%" /* 20.8px */
+        lineHeight: 20.8 //"130%"
       },
       variants: {
         "browse-wrap": () => ({