fix styles

apps/app/src/components/Bookmarks/BookmarkFolderItem.tsx

@@ -265,7 +265,7 @@ export const BookmarkFolderItem: FC<BookmarkFolderItemProps> = (props: BookmarkF
                 }
               >
                 <div onClick={e => e.stopPropagation()}>
-                  <DropdownToggle color="transparent" className="border-0 rounded btn-page-item-control p-0 grw-visible-on-hover me-1">
+                  <DropdownToggle color="transparent" className="border-0 rounded p-0 grw-visible-on-hover me-1">
                     <span className="material-symbols-outlined">more_vert</span>
                   </DropdownToggle>
                 </div>

apps/app/src/components/Bookmarks/BookmarkFolderItemControl.tsx

@@ -35,7 +35,7 @@ export const BookmarkFolderItemControl: React.FC<{
             onClick={onClickMoveToRoot}
             className="grw-page-control-dropdown-item"
           >
-            <i className="fa fa-fw fa-bookmark-o grw-page-control-dropdown-icon"></i>
+            <span className="material-symbols-outlined me-1">bookmark</span>
             {t('bookmark_folder.move_to_root')}
           </DropdownItem>
         )}
@@ -43,7 +43,7 @@ export const BookmarkFolderItemControl: React.FC<{
           onClick={onClickRename}
           className="grw-page-control-dropdown-item"
         >
-          <i className="icon-fw icon-action-redo grw-page-control-dropdown-icon"></i>
+          <span className="material-symbols-outlined me-1">redo</span>
           {t('Rename')}
         </DropdownItem>
 
@@ -53,7 +53,7 @@ export const BookmarkFolderItemControl: React.FC<{
           className="pt-2 grw-page-control-dropdown-item text-danger"
           onClick={onClickDelete}
         >
-          <span className="material-symbols-outlined grw-page-control-dropdown-icon">delete</span>
+          <span className="material-symbols-outlined me-1">delete</span>
           {t('Delete')}
         </DropdownItem>
       </DropdownMenu>

apps/app/src/components/CompleteUserRegistration.tsx

@@ -14,7 +14,9 @@ export const CompleteUserRegistration: FC = () => {
           </p>
           {/* If the transition source is "/login", use <a /> tag since the transition will not occur if next/link is used. */}
           <a href="/login">
-            <span className="material-symbols-outlined">login</span>{t('Sign in is here')}
+            <div className="d-flex align-items-center justify-content-center">
+              <span className="material-symbols-outlined me-1">login</span>{t('Sign in is here')}
+            </div>
           </a>
         </div>
       </div>

apps/app/src/components/CompleteUserRegistrationForm.tsx

@@ -58,6 +58,7 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
   }, [username]);
 
   const handleSubmitRegistration = useCallback(async(e) => {
+    console.log('ok');
     e.preventDefault();
     setDisableForm(true);
     try {
@@ -111,12 +112,16 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
               <input type="hidden" name="token" value={token} />
 
               <div className="input-group">
-                <span className="input-group-text"></span><span className="material-symbols-outlined">mail</span>
+                <span className="input-group-text">
+                  <span className="material-symbols-outlined">mail</span>
+                </span>
                 <input type="text" className="form-control" placeholder={t('Email')} disabled value={email} />
               </div>
 
               <div className="input-group" id="input-group-username">
-                <span className="input-group-text"></span><span className="material-symbols-outlined">person</span>
+                <span className="input-group-text">
+                  <span className="material-symbols-outlined">person</span>
+                </span>
                 <input
                   type="text"
                   className="form-control"
@@ -134,7 +139,9 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
               )}
 
               <div className="input-group">
-                <span className="input-group-text"></span><span className="material-symbols-outlined">sell</span>
+                <span className="input-group-text">
+                  <span className="material-symbols-outlined">sell</span>
+                </span>
                 <input
                   type="text"
                   className="form-control"
@@ -148,7 +155,9 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
               </div>
 
               <div className="input-group">
-                <span className="input-group-text"></span><span className="material-symbols-outlined">lock</span>
+                <span className="input-group-text">
+                  <span className="material-symbols-outlined">lock</span>
+                </span>
                 <input
                   type="password"
                   className="form-control"
@@ -162,10 +171,19 @@ const CompleteUserRegistrationForm: React.FC<Props> = (props: Props) => {
               </div>
 
               <div className="input-group justify-content-center d-flex mt-5">
-                <button type="button" disabled={forceDisableForm || disableForm} className="btn btn-fill" id="register">
+                <button type="submit" disabled={forceDisableForm || disableForm} className="btn btn-fill" id="register">
                   <div className="eff"></div>
-                  <span className="btn-label"></span><span className="material-symbols-outlined">person_add</span>
-                  <span className="btn-label-text">{t('Create')}</span>
+                  <span className="btn-label d-flex align-items-center">
+                    <span className="material-symbols-outlined">person</span>
+                  </span>
+                  <span className="btn-label-text">{ t('Create') }</span>
+                  {/* <div className="eff"></div>
+                  <span className="btn-label d-flex align-items-center">
+                    <span className="btn-label">
+                      <span className="material-symbols-outlined">person_add</span>
+                    </span>
+                    <span className="btn-label-text">{t('Create')}</span>
+                  </span> */}
                 </button>
               </div>