Typography: use final font + Modal: fix image size

Cambly · Mar 27, 2024 · 7d00f1b · 7d00f1b
1 parent c612816
commit 7d00f1b
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/packages/syntax-core/src/Modal/Modal.stories.tsx b/packages/syntax-core/src/Modal/Modal.stories.tsx
@@ -99,7 +99,13 @@ export const WithImage: StoryObj<typeof Modal> = {
   args: {
     ...Default.args,
     header: "With Image",
-    image: <img src="https://placehold.co/400x200" alt="placeholder image" />,
+    image: (
+      <img
+        src="https://placehold.co/600x200"
+        alt="placeholder image"
+        style={{ width: "100%" }}
+      />
+    ),
   },
   render: function WithImageExample({ ...args }): JSX.Element {
     const [isOpen, setIsOpen] = useState(false);

diff --git a/packages/syntax-core/src/Modal/Modal.tsx b/packages/syntax-core/src/Modal/Modal.tsx
@@ -102,7 +102,9 @@ export default function Modal({
   onDismiss: () => void;
   /**
    * The optional image rendered above the Modal.
-   * Image size should be 400w x 200h.
+   * Image
+   *  * Size should be 600w x 200h
+   *  * Be sure to set width="100%" on the image
    * If images aren't that sized, should ask design to give another image.
    */
   image?: JSX.Element;
@@ -222,7 +224,7 @@ export default function Modal({
                   </Box>
                 )}
               </Box>
-              {image && <Box maxHeight={200}>{image}</Box>}
+              {image && <Box>{image}</Box>}
               <Box
                 display="flex"
                 gap={themeName === "classic" ? 3 : 4}

diff --git a/packages/syntax-core/src/Typography/Typography.module.css b/packages/syntax-core/src/Typography/Typography.module.css
@@ -8,15 +8,15 @@
   font-style: normal;
   font-weight: 510;
   src: local("GT-Super-Text-Medium"),
-    url("https://static.cambly.com/fonts/gt-super-text-medium-converted.woff2");
+    url("https://static.cambly.com/fonts/gt-super-text-medium-final.woff2");
 }
 
 @font-face {
   font-family: "GT Super";
   font-style: normal;
   font-weight: 700;
   src: local("GT-Super-Text-Bold"),
-    url("https://static.cambly.com/fonts/gt-super-text-bold-converted.woff2");
+    url("https://static.cambly.com/fonts/gt-super-text-bold-final.woff2");
 }
 
 .sansSerif {