fix(web): create workspace beta modal design (#597)

Co-authored-by: nina992 <[email protected]>
reearth · Jul 28, 2023 · 1410264 · 1410264
1 parent 714fb91
commit 1410264
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/web/src/beta/components/Modal/index.tsx b/web/src/beta/components/Modal/index.tsx
@@ -78,7 +78,7 @@ const Modal: React.FC<Props> = ({
           </NavBarWrapper>
         )}
         <ContentWrapper>
-          {tabs && <Content>{tabs.find(tab => tab.active === true)?.content}</Content>}
+          {tabs.length > 0 && <Content>{tabs.find(tab => tab.active === true)?.content}</Content>}
           <Content> {children}</Content>
           <ButtonWrapper>
             {tabs.find(tab => tab.active === true)?.tabButton1 ?? button1}
@@ -113,6 +113,7 @@ const Tab = styled.button<{ isSelected?: boolean }>`
 const ContentWrapper = styled.div`
   display: flex;
   flex-direction: column;
+  flex: 1;
 `;
 
 const Content = styled.div`

diff --git a/web/src/beta/features/Modals/WorkspaceCreationModal/index.tsx b/web/src/beta/features/Modals/WorkspaceCreationModal/index.tsx
@@ -90,18 +90,19 @@ const NewProjectForm = styled.form`
 const FormInputWrapper = styled.div`
   display: flex;
   flex-flow: row wrap;
-  margin: 40px auto;
+  margin: 30px auto;
 `;
 
 const StyledInput = styled.input`
   flex: 2;
   color: ${props => props.theme.content.main};
   background: ${props => props.theme.bg[0]};
+  border-radius: 4px;
   border: 1px solid #3f3d45;
   font-size: ${fonts.sizes.body}px;
-  outline: none;
   cursor: text;
-  padding: 0 10px;
+  padding: 4px 8px;
+  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25) inset;
 `;
 
 export default WorkspaceCreationModal;