Merge branch 'develop' into fix/clipboard

libs/components/editor-blocks/src/blocks/grid/index.ts

@@ -36,6 +36,9 @@ export class GridBlock extends BaseView {
             }
             return block.remove();
         }
+        if (block.childrenIds.length === 0) {
+            return block.remove();
+        }
         return true;
     }
 }

libs/components/editor-blocks/src/blocks/group/GroupView.tsx

@@ -1,6 +1,8 @@
 import {
     addNewGroup,
+    LINE_GAP,
     RecastScene,
+    TAG_GAP,
     useCurrentView,
     useOnSelect,
 } from '@toeverything/components/editor-core';
@@ -38,6 +40,7 @@ const GroupActionWrapper = styled('div')(({ theme }) => ({
     visibility: 'hidden',
     fontSize: theme.affine.typography.xs.fontSize,
     color: theme.affine.palette.icons,
+    opacity: 0.6,
     '.line': {
         flex: 1,
         height: '15px',
@@ -60,7 +63,7 @@ const GroupContainer = styled('div')<{ isSelect?: boolean }>(
     ({ isSelect, theme }) => ({
         background: theme.affine.palette.white,
         border: '2px solid rgba(236,241,251,.5)',
-        padding: `15px 16px 0 16px`,
+        padding: `15px 16px ${LINE_GAP - TAG_GAP * 2}px 16px`,
         borderRadius: '10px',
         ...(isSelect
             ? {

libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContainer.tsx

@@ -156,7 +156,13 @@ export const CardContainer = (props: CardContainerProps) => {
     const { kanban } = useKanban();
     const { containerIds, items: dataSource, activeId } = props;
     return (
-        <KanbanContainer>
+        <KanbanContainer
+            onMouseDown={e => {
+                // Fix https://github.com/toeverything/AFFiNE/issues/29
+                // Prevent active selection when dragging kanban card
+                e.stopPropagation();
+            }}
+        >
             {containerIds.map((containerId, idx) => {
                 const items = dataSource[containerId];
 

libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContext.tsx

@@ -60,6 +60,9 @@ export const CardContext = (props: Props) => {
 
 const StyledCardContainer = styled('div')`
     cursor: pointer;
+    &:hover {
+        z-index: 1;
+    }
     &:focus-within {
         z-index: 1;
     }

libs/components/editor-blocks/src/blocks/page/PageView.tsx

@@ -86,7 +86,7 @@ export const PageView: FC<CreateView> = ({ block, editor }) => {
                     alwaysShowPlaceholder
                     ref={textRef}
                     className={'title'}
-                    supportMarkdown={true}
+                    supportMarkdown={false}
                     handleEnter={onTextEnter}
                     placeholder={'Untitled'}
                     block={block}
@@ -109,12 +109,15 @@ export const PageView: FC<CreateView> = ({ block, editor }) => {
     );
 };
 
-const PageTitleBlock = styled('div')({
-    '.title': {
-        fontSize: Theme.typography.page.fontSize,
-        lineHeight: Theme.typography.page.lineHeight,
-    },
-    '.content': {
-        outline: 'none',
-    },
+const PageTitleBlock = styled('div')(({ theme }) => {
+    return {
+        '.title': {
+            fontSize: theme.affine.typography.page.fontSize,
+            lineHeight: theme.affine.typography.page.lineHeight,
+            fontWeight: theme.affine.typography.page.fontWeight,
+        },
+        '.content': {
+            outline: 'none',
+        },
+    };
 });

libs/components/editor-blocks/src/blocks/text/TextView.tsx

@@ -46,6 +46,7 @@ const TextBlock = styled(TextManage)<{ type: string }>(({ theme, type }) => {
         return {
             fontSize: textStyleMap.text.fontSize,
             lineHeight: textStyleMap.text.lineHeight,
+            fontWeight: textStyleMap.text.fontWeight,
         };
     }
 });

libs/components/editor-blocks/src/blocks/todo/TodoView.tsx

@@ -150,6 +150,7 @@ const TodoBlock = styled('div')({
     display: 'flex',
     '.checkBoxContainer': {
         marginRight: '4px',
+        padding: '0 4px',
         height: '22px',
     },
     '.textContainer': {

libs/components/editor-blocks/src/components/BlockContainer/BlockContainer.tsx

@@ -27,5 +27,6 @@ export const BlockContainer: FC<BlockContainerProps> = function ({
 export const Container = styled('div')<{ selected: boolean }>(
     ({ selected, theme }) => ({
         backgroundColor: selected ? theme.affine.palette.textSelected : '',
+        marginBottom: '2px',
     })
 );

libs/components/editor-blocks/src/components/text-manage/TextManage.tsx

@@ -39,6 +39,9 @@ export type ExtendedTextUtils = SlateUtils & {
 };
 const TextBlockContainer = styled(Text)(({ theme }) => ({
     lineHeight: theme.affine.typography.body1.lineHeight,
+    fontFamily: theme.affine.typography.body1.fontFamily,
+    color: theme.affine.typography.body1.color,
+    letterSpacing: '0.1px',
 }));
 
 const findSlice = (arr: string[], p: string, q: string) => {