Added bare-bones foundation for project modal component

calblueprint · Oct 7, 2024 · 8837554 · 8837554
1 parent 278bd4f
commit 8837554
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/components/ProjectModal/index.tsx b/components/ProjectModal/index.tsx
@@ -66,8 +66,11 @@ export default function ProjectModal({
           <div>{project_name}</div>
         </div>
         <div>{size}</div>
-        DETAILS
-        <div>{additional_info}</div>
+        <div style={styles.additionalInfoStyles}>
+          DETAILS
+          <br></br>
+          {additional_info}
+        </div>
       </Modal>
     </div>
   );

diff --git a/components/ProjectModal/styles.ts b/components/ProjectModal/styles.ts
@@ -1,12 +1,18 @@
 import { CSSProperties } from 'react';
 
 export const modalOverlayStyles: CSSProperties = {
-  ///
+  width: '310px',
+  height: '100%',
 };
 
 export const modalContentStyles: CSSProperties = {
   display: 'flex',
   width: '360px',
+  height: '100%',
+  top: '0',
+  bottom: '0',
+  left: '0',
+  right: '0',
   flexShrink: 0,
   flexDirection: 'column',
   alignItems: 'center',
@@ -40,3 +46,7 @@ export const developerStyles: CSSProperties = {
   display: 'flex',
   justifyContent: 'space-between',
 };
+
+export const additionalInfoStyles: CSSProperties = {
+  width: '315px',
+};