fix: settings style update (#3161)

(cherry picked from commit d88a21d24a)

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

@@ -120,7 +120,7 @@ export const AppearanceSettings = () => {
             <LanguageMenu triggerProps={{ size: 'small' }} />
           </div>
         </SettingRow>
-        {runtimeConfig.enableNewSettingUnstableApi && environment.isDesktop ? (
+        {environment.isDesktop ? (
           <SettingRow
             name={t['Client Border Style']()}
             desc={t['Customize the appearance of the client.']()}

apps/web/src/components/affine/setting-modal/style.css.ts

@@ -4,7 +4,7 @@ export const settingContent = style({
   flexGrow: '1',
   height: '100%',
   padding: '40px 15px 20px',
-  overflowX: 'auto',
+  overflow: 'auto',
 });
 
 globalStyle(`${settingContent} .wrapper`, {
@@ -13,7 +13,6 @@ globalStyle(`${settingContent} .wrapper`, {
   height: '100%',
   maxWidth: '560px',
   margin: '0 auto',
-  overflowY: 'auto',
 });
 globalStyle(`${settingContent} .content`, {
   minHeight: '100%',

apps/web/src/components/blocksuite/workspace-header/styles.css.ts

@@ -210,6 +210,7 @@ export const windowAppControlsWrapper = style({
   display: 'flex',
   gap: '2px',
   transform: 'translateX(8px)',
+  height: '100%',
 });
 
 export const windowAppControl = style({
@@ -217,11 +218,17 @@ export const windowAppControl = style({
   cursor: 'pointer',
   display: 'inline-flex',
   width: '42px',
-  height: '32px',
+  height: 'calc(100% - 10px)',
+  paddingTop: '10px',
   alignItems: 'center',
   justifyContent: 'center',
-  borderRadius: '4px',
+  borderRadius: '0',
   selectors: {
+    '&[data-type="close"]': {
+      width: '56px',
+      paddingRight: '14px',
+      marginRight: '-14px',
+    },
     '&[data-type="close"]:hover': {
       background: 'var(--affine-error-color)',
       color: '#FFFFFF',