fix(web): css in mobile (#1731)

apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts

@@ -1,11 +1,14 @@
 import { displayFlex, styled } from '@affine/component';
 import { TableRow } from '@affine/component';
 
-export const StyledTableContainer = styled('div')(() => {
+export const StyledTableContainer = styled('div')(({ theme }) => {
   return {
     height: 'calc(100vh - 60px)',
     padding: '78px 72px',
     overflowY: 'auto',
+    [theme.breakpoints.down('sm')]: {
+      padding: '12px 24px',
+    },
   };
 });
 export const StyledTitleWrapper = styled('div')(({ theme }) => {

apps/web/src/styles/globals.css

@@ -208,3 +208,15 @@ affine-block-hub {
 .block-hub-menu-container {
   position: unset !important;
 }
+
+@media (max-width: 768px) {
+  .affine-default-page-block-title-container {
+    margin-top: 24px;
+  }
+
+  .editor-wrapper {
+    width: 100%;
+    height: 100%;
+    padding: 0 0.75rem;
+  }
+}