chore: update template styles

Author: byodian

src/components/workspace/content-item.tsx

@@ -81,8 +81,9 @@ export function ContentItem(props: ContainerProps) {
             <GripVertical className="w-4 h-4" />
           </div>
 
-          {/* 桌面端展示 */}
-          <a href={`/#${item.id}`} className="min-h-[61px] relative border-b border-b-border py-4 hidden sm:block">
+          {/* 桌面端展示，只允许一级标题可点击 */}
+          {!item.parentId
+            ? <a href={`/#${item.id}`} className="min-h-[61px] relative border-b border-b-border py-4 hidden sm:block">
             <div className="mr-28">{parse(DOMPurify.sanitize(item.title))}</div>
             <ContentItemButtons
               item={item}
@@ -91,6 +92,15 @@ export function ContentItem(props: ContainerProps) {
               onSubContentAdd={handleSubContentAdd}
             />
           </a>
+            : <div className="min-h-[61px] relative border-b border-b-border py-4" onClick={e => e.preventDefault()}>
+            <div className="mr-28 select-none">{parse(DOMPurify.sanitize(item.title))}</div>
+            <ContentItemButtons
+              item={item}
+              onContentEdit={handleContentEdit}
+              onDialogOpen={handleDialogOpen}
+              onSubContentAdd={handleSubContentAdd}
+            />
+          </div>}
 
           {/* 移动端展示 */}
           <div className="min-h-[61px] relative border-b border-b-border py-4 sm:hidden" onClick={e => e.preventDefault()}>

src/theme/templates/cartoon-template/cartoon-template.ts

@@ -155,6 +155,7 @@ export const cartoonTemplate: ArticleModuleTemplate = {
       },
     },
     content: {
+      flexGrow: 1,
       width: '100%',
       paddingTop: '30px',
       paddingLeft: '16px',
@@ -164,6 +165,7 @@ export const cartoonTemplate: ArticleModuleTemplate = {
       borderRadius: '8px',
       border: '1px solid',
       backgroundColor: 'var(--main-content-background)',
+      overflow: 'hidden',
     },
   },
   sub: {

src/theme/templates/simple-template/simple-template.ts

@@ -44,6 +44,8 @@ export const simpleTemplate: ArticleModuleTemplate = {
   },
   main: {
     container: {
+      'display': 'flex',
+      'flexDirection': 'column',
       'padding': '45px 36px',
 
       '&:nth-of-type(2n)': {
@@ -61,6 +63,7 @@ export const simpleTemplate: ArticleModuleTemplate = {
       color: 'var(--main-title-foreground)',
     },
     content: {
+      'flexGrow': 1,
       'color': 'var(--main-content-foreground)',
       'backgroundColor': 'var(--main-content-background)',
       'fontSize': '15px',
@@ -82,6 +85,7 @@ export const simpleTemplate: ArticleModuleTemplate = {
         backgroundColor: 'var(--main-content-secondary-background)',
         color: 'var(--sub-container-foreground)',
       },
+      'overflow': 'hidden',
     },
   },
   sub: {

src/theme/templates/tech-template/tech-template.ts

@@ -45,6 +45,8 @@ export const techTemplate: ArticleModuleTemplate = {
   },
   main: {
     container: {
+      display: 'flex',
+      flexDirection: 'column',
       paddingLeft: '12px',
       paddingRight: '12px',
       paddingTop: '13px',
@@ -84,12 +86,14 @@ export const techTemplate: ArticleModuleTemplate = {
       },
     },
     content: {
+      flexGrow: 1,
       position: 'relative',
       padding: '12px 18px',
       borderRadius: '12px',
       fontSize: '15px',
       backgroundColor: 'rgb(255 255 255 / 0.7)',
       color: 'var(--main-content-foreground)',
+      overflow: 'hidden',
     },
   },
   sub: {