feat: refactor button with new design (#3343)

apps/core/src/components/affine/create-workspace-modal/index.tsx

@@ -79,7 +79,7 @@ const NameWorkspaceContent = ({
       <div className={style.buttonGroup}>
         <Button
           data-testid="create-workspace-close-button"
-          type="light"
+          type="primary"
           onClick={onClose}
         >
           {t.Cancel()}
@@ -155,7 +155,7 @@ const SetDBLocationContent = ({
         <Button
           disabled={opening}
           data-testid="create-workspace-customize-button"
-          type="light"
+          type="primary"
           onClick={handleSelectDBFileLocation}
         >
           {t['Customize']()}

apps/core/src/components/affine/language-menu/index.tsx

@@ -47,7 +47,7 @@ const LanguageMenuContent: FC<{
     </>
   );
 };
-export const LanguageMenu: FC<{ triggerProps: ButtonProps }> = ({
+export const LanguageMenu: FC<{ triggerProps?: ButtonProps }> = ({
   triggerProps,
 }) => {
   const i18n = useI18N();

apps/core/src/components/affine/new-workspace-setting-detail/delete-leave-workspace/delete/index.tsx

@@ -99,7 +99,7 @@ export const WorkspaceDeleteModal = ({
             data-testid="delete-workspace-confirm-button"
             disabled={!allowDelete}
             onClick={handleDelete}
-            type="danger"
+            type="error"
             shape="circle"
             style={{ marginLeft: '24px' }}
           >

apps/core/src/components/affine/new-workspace-setting-detail/delete-leave-workspace/leave/index.tsx

@@ -37,7 +37,7 @@ export const WorkspaceLeave = ({ open, onClose }: WorkspaceDeleteProps) => {
           </Button>
           <Button
             onClick={handleLeave}
-            type="danger"
+            type="error"
             shape="circle"
             style={{ marginLeft: '24px' }}
           >

apps/core/src/components/affine/new-workspace-setting-detail/export.tsx

@@ -14,7 +14,6 @@ export const ExportPanel: FC<{
     <>
       <SettingRow name={t['Export']()} desc={t['Export Description']()}>
         <Button
-          size="small"
           data-testid="export-affine-backup"
           onClick={async () => {
             const result = await window.apis?.dialog.saveDBFileAs(workspaceId);

apps/core/src/components/affine/new-workspace-setting-detail/profile.tsx

@@ -84,13 +84,12 @@ export const ProfilePanel: FC<{
         />
         {input === workspace.blockSuiteWorkspace.meta.name ? null : (
           <IconButton
-            size="middle"
             data-testid="save-workspace-name"
             onClick={() => {
               handleUpdateWorkspaceName(input);
             }}
+            active={true}
             style={{
-              color: 'var(--affine-primary-color)',
               marginLeft: '12px',
             }}
           >

apps/core/src/components/affine/new-workspace-setting-detail/publish.tsx

@@ -74,7 +74,7 @@ const PublishPanelAffine: FC<PublishPanelAffineProps> = props => {
       <FlexWrapper justifyContent="space-between">
         <Button
           className={style.urlButton}
-          size="middle"
+          size="large"
           onClick={useCallback(() => {
             window.open(shareUrl, '_blank');
           }, [shareUrl])}
@@ -82,7 +82,7 @@ const PublishPanelAffine: FC<PublishPanelAffineProps> = props => {
         >
           {shareUrl}
         </Button>
-        <Button size="middle" onClick={copyUrl}>
+        <Button size="large" onClick={copyUrl}>
           {t['Copy']()}
         </Button>
       </FlexWrapper>

apps/core/src/components/affine/new-workspace-setting-detail/storage.tsx

@@ -79,14 +79,13 @@ export const StoragePanel: FC<{
             <Button
               data-testid="move-folder"
               className={style.urlButton}
-              size="middle"
+              size="large"
               onClick={handleMoveTo}
             >
               {secondaryPath}
             </Button>
           </Tooltip>
           <Button
-            size="small"
             data-testid="reveal-folder"
             data-disabled={moveToInProgress}
             onClick={onRevealDBFile}
@@ -96,7 +95,6 @@ export const StoragePanel: FC<{
         </FlexWrapper>
       ) : (
         <Button
-          size="small"
           data-testid="move-folder"
           data-disabled={moveToInProgress}
           onClick={handleMoveTo}

apps/core/src/components/affine/setting-modal/general-setting/appearance/index.tsx

@@ -32,11 +32,7 @@ export const ThemeSettings = () => {
         [setTheme]
       )}
     >
-      <RadioButton
-        bold={true}
-        value="system"
-        data-testid="system-theme-trigger"
-      >
+      <RadioButton value="system" data-testid="system-theme-trigger">
         {t['system']()}
       </RadioButton>
       <RadioButton bold={true} value="light" data-testid="light-theme-trigger">
@@ -117,7 +113,7 @@ export const AppearanceSettings = () => {
           desc={t['Select the language for the interface.']()}
         >
           <div className={settingWrapper}>
-            <LanguageMenu triggerProps={{ size: 'small' }} />
+            <LanguageMenu />
           </div>
         </SettingRow>
         {environment.isDesktop ? (