From 536e447eaa156bbab400336fe0c8614f334b7781 Mon Sep 17 00:00:00 2001
From: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
Date: Tue, 14 Nov 2023 22:31:14 +0100
Subject: [PATCH] style: export modal (#592)

* style: tweaks to export modal
---
 .../modals/export-modal/ExportModal.module.scss     | 13 ++++++-------
 .../features/modals/export-modal/ExportModal.tsx    |  8 ++++----
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/apps/client/src/features/modals/export-modal/ExportModal.module.scss b/apps/client/src/features/modals/export-modal/ExportModal.module.scss
index 58b648de3..04a092b85 100644
--- a/apps/client/src/features/modals/export-modal/ExportModal.module.scss
+++ b/apps/client/src/features/modals/export-modal/ExportModal.module.scss
@@ -1,10 +1,9 @@
-.modalHeader {
-  font-weight: 400;
-}
+@use '../../../theme/v2Styles' as *;
 
-.modalBody {
-  display: flex;
+.buttonRow {
   justify-content: space-between;
-  margin-top: 1rem;
-  margin-bottom: 1rem;
+  margin-top: $section-spacing;
+  display: flex;
+  gap: $section-spacing;
+  margin: 0 0.25rem;
 }
diff --git a/apps/client/src/features/modals/export-modal/ExportModal.tsx b/apps/client/src/features/modals/export-modal/ExportModal.tsx
index 68f57a7d2..78bb1bbcb 100644
--- a/apps/client/src/features/modals/export-modal/ExportModal.tsx
+++ b/apps/client/src/features/modals/export-modal/ExportModal.tsx
@@ -13,16 +13,16 @@ export default function ExportModal(props: ExportModalProps) {
   const { isOpen, onClose } = props;
 
   return (
-    <Modal isOpen={isOpen} onClose={onClose} motionPreset='scale' size='xl' colorScheme='blackAlpha'>
+    <Modal isOpen={isOpen} onClose={onClose} motionPreset='slideInBottom' size='xl' variant='ontime-small'>
       <ModalOverlay />
       <ModalContent>
         <ModalHeader className={styles.modalHeader}>Download options</ModalHeader>
         <ModalCloseButton />
-        <ModalBody className={styles.modalBody}>
-          <Button onClick={() => onClose('csv')} variant='ontime-subtle-on-light' width='48%'>
+        <ModalBody className={styles.buttonRow}>
+          <Button onClick={() => onClose('csv')} variant='ontime-subtle-on-light' width='100%'>
             Rundown as CSV
           </Button>
-          <Button onClick={() => onClose('json')} variant='ontime-filled' width='48%'>
+          <Button onClick={() => onClose('json')} variant='ontime-filled' width='100%'>
             Project file
           </Button>
         </ModalBody>