wip

src/frontend/apps/impress/src/assets/fonts/OpenSans/OpenSans-font.css

@@ -16,3 +16,15 @@
   src: url('OpenSans-Bold.woff2') format('woff2');
   font-weight: 700;
 }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url('OpenSans-SemiBold.woff2') format('woff2');
+  font-weight: 600;
+}
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url('OpenSans-Bold.woff2') format('woff2');
+  font-weight: 500;
+}

src/frontend/apps/impress/src/cunningham/cunningham-style.css

@@ -327,4 +327,12 @@
   .c__datagrid__table__container > table tbody tr {
     border: 1px var(--c--theme--colors--greyscale-100) solid;
   }
+
+  .c__button--with-icon--left {
+    padding: 0 1.5rem 0 var(--c--theme--spacings--s);
+  }
+
+  .c__button--medium {
+    padding: 0 var(--c--theme--spacings--s);
+  }
 }

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridContainer.tsx

@@ -20,6 +20,7 @@ export const DocsGridContainer = () => {
               onClick={() => {
                 setIsModalCreateOpen(true);
               }}
+              icon={<span className="material-icons">add</span>}
             >
               {t('Create a new document')}
             </Button>

src/frontend/apps/impress/src/features/docs/members/members-add/components/AddMembers.tsx

@@ -146,8 +146,8 @@ export const AddMembers = ({ currentRole, doc }: ModalAddMembersProps) => {
     >
       <IconBG iconName="group_add" />
       <Box $gap="0.7rem" $direction="row" $wrap="wrap" $css="flex: 70%;">
-        <Box $gap="0.7rem" $direction="row" $wrap="wrap" $css="flex: 80%;">
-          <Box $css="flex: auto;" $width="15rem">
+        <Box $gap="1rem" $direction="row" $wrap="wrap" $css="flex: 80%;">
+          <Box $css="flex-shrink: 0;" $width="15rem">
             <SearchUsers
               key={resetKey + 1}
               doc={doc}
@@ -156,7 +156,7 @@ export const AddMembers = ({ currentRole, doc }: ModalAddMembersProps) => {
               disabled={isPending}
             />
           </Box>
-          <Box $css="flex: auto;">
+          <Box $css="width: 50%; flex-shrink: 1;">
             <ChooseRole
               key={resetKey}
               currentRole={currentRole}

src/frontend/apps/impress/src/features/docs/members/members-add/components/ChooseRole.tsx

@@ -32,6 +32,7 @@ export const ChooseRole = ({
       onChange={(evt) => setRole(evt.target.value as Role)}
       disabled={disabled}
       value={defaultRole}
+      fullWidth={true}
     />
   );
 };

src/frontend/apps/impress/src/features/docs/members/members-add/components/SearchUsers.tsx

@@ -145,7 +145,8 @@ export const SearchUsers = ({
         control: (base) => ({
           ...base,
           minHeight: '45px',
-          borderColor: colorsTokens()['greyscale-500'],
+          borderColor: colorsTokens()['greyscale-300'],
+          borderRadius: '8px',
         }),
         input: (base) => ({
           ...base,