框架整理完毕

src/app.scss

@@ -39,3 +39,120 @@ button[open-type="chooseAvatar"] {
   line-height: inherit !important;
   border-radius: 0 !important;
 }
+
+.content {
+  padding: 32px;
+
+  // 富文本内容样式
+  :global {
+    // 标题样式
+    h1, h2, h3, h4, h5, h6 {
+      margin: 0;
+      font-weight: bold;
+      line-height: 1.4;
+    }
+
+    h1 { font-size: 24px; }
+    h2 { font-size: 22px; }
+    h3 { font-size: 20px; }
+    h4 { font-size: 18px; }
+    h5 { font-size: 16px; }
+    h6 { font-size: 14px; }
+
+    // 图片样式
+    img {
+      max-width: 100%;
+      height: auto;
+      border-radius: 8px;
+      margin: 8px 0;
+      display: block;
+    }
+
+    // 列表样式
+    ul, ol {
+      li {
+        margin: 0;
+      }
+    }
+
+    // 引用样式
+    blockquote {
+      margin: 8px 0;
+      padding: 12px;
+      background-color: #f5f5f5;
+      border-left: 4px solid #ddd;
+      border-radius: 4px;
+
+      p {
+        margin: 0;
+        font-style: italic;
+      }
+    }
+
+    // 代码样式
+    code {
+      background-color: #f5f5f5;
+      padding: 2px 6px;
+      border-radius: 4px;
+      font-family: 'Courier New', monospace;
+      font-size: 14px;
+    }
+
+    pre {
+      background-color: #f5f5f5;
+      padding: 12px;
+      border-radius: 8px;
+      overflow-x: auto;
+      margin: 8px 0;
+
+      code {
+        background: none;
+        padding: 0;
+      }
+    }
+
+    // 表格样式
+    table {
+      width: 100%;
+      border-collapse: collapse;
+      margin: 8px 0;
+
+      th, td {
+        border: 1px solid #ddd;
+        padding: 12px;
+        text-align: left;
+      }
+
+      th {
+        background-color: #f5f5f5;
+        font-weight: bold;
+      }
+    }
+
+    // 链接样式
+    a {
+      color: #1890ff;
+      text-decoration: none;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+
+    // 分割线样式
+    hr {
+      margin: 12px 0;
+      border: none;
+      border-top: 1px solid #eee;
+    }
+
+    // 强调样式
+    strong, b {
+      font-weight: bold;
+    }
+
+    em, i {
+      font-style: italic;
+    }
+  }
+}

src/article/detail.scss

@@ -1,128 +0,0 @@
-.content {
-  padding: 32px;
-  line-height: 2.4rem;
-
-  // 富文本内容样式
-  :global {
-    // 段落样式
-    p {
-      margin: 16px 0;
-      line-height: 1.8;
-      text-align: justify;
-    }
-
-    // 标题样式
-    h1, h2, h3, h4, h5, h6 {
-      margin: 24px 0 16px 0;
-      font-weight: bold;
-      line-height: 1.4;
-    }
-
-    h1 { font-size: 24px; }
-    h2 { font-size: 22px; }
-    h3 { font-size: 20px; }
-    h4 { font-size: 18px; }
-    h5 { font-size: 16px; }
-    h6 { font-size: 14px; }
-
-    // 图片样式
-    img {
-      max-width: 100%;
-      height: auto;
-      border-radius: 8px;
-      margin: 16px 0;
-      display: block;
-    }
-
-    // 列表样式
-    ul, ol {
-      margin: 16px 0;
-      padding-left: 24px;
-
-      li {
-        margin: 8px 0;
-        line-height: 1.6;
-      }
-    }
-
-    // 引用样式
-    blockquote {
-      margin: 16px 0;
-      padding: 16px;
-      background-color: #f5f5f5;
-      border-left: 4px solid #ddd;
-      border-radius: 4px;
-
-      p {
-        margin: 0;
-        font-style: italic;
-      }
-    }
-
-    // 代码样式
-    code {
-      background-color: #f5f5f5;
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-family: 'Courier New', monospace;
-      font-size: 14px;
-    }
-
-    pre {
-      background-color: #f5f5f5;
-      padding: 16px;
-      border-radius: 8px;
-      overflow-x: auto;
-      margin: 16px 0;
-
-      code {
-        background: none;
-        padding: 0;
-      }
-    }
-
-    // 表格样式
-    table {
-      width: 100%;
-      border-collapse: collapse;
-      margin: 16px 0;
-
-      th, td {
-        border: 1px solid #ddd;
-        padding: 12px;
-        text-align: left;
-      }
-
-      th {
-        background-color: #f5f5f5;
-        font-weight: bold;
-      }
-    }
-
-    // 链接样式
-    a {
-      color: #1890ff;
-      text-decoration: none;
-
-      &:hover {
-        text-decoration: underline;
-      }
-    }
-
-    // 分割线样式
-    hr {
-      margin: 24px 0;
-      border: none;
-      border-top: 1px solid #eee;
-    }
-
-    // 强调样式
-    strong, b {
-      font-weight: bold;
-    }
-
-    em, i {
-      font-style: italic;
-    }
-  }
-}

src/article/detail.tsx

@@ -6,7 +6,6 @@ import {CmsArticle} from "@/api/cms/cmsArticle/model"
 import {Eye} from '@nutui/icons-react-taro'
 // 显示html富文本
 import {View, RichText} from '@tarojs/components'
-import './detail.scss'
 import Line from "@/components/Gap";
 import {getCmsArticle} from "@/api/cms/cmsArticle";
 
@@ -35,7 +34,7 @@ function Detail() {
             <div className={'p-3 font-bold text-lg'}>{item?.title}</div>
             <div className={'flex justify-between px-3'}>
                 <Tag type={'success'}>{item?.categoryName}</Tag>
-                <div className={'flex items-center gap-2 text-sm text-gray-400'}><Eye size={14}/>{views}</div>
+                <div className={'flex items-center gap-2 text-xs text-gray-400'}><Eye size={14}/>{views}</div>
             </div>
             <Divider/>
             <View className={'content text-gray-700 text-sm'}>

src/article/index.tsx

@@ -51,7 +51,7 @@ const Index = () => {
                 <Image src={navigation?.style} width={'100%'}
                        height={'auto'}/>
             </div>
-            <div className={'bg-white rounded-lg py-3 px-3'}>
+            <div className={'bg-white rounded-lg py-3 px-2'}>
                 <div className={'grid grid-cols-2 gap-3'}>
                     {
                         // 子级栏目
@@ -63,7 +63,7 @@ const Index = () => {
                                     onClick={() => Taro.navigateTo({url: `./index?id=${item.navigationId}`})}
                                 >
                                     {/* 图片容器 */}
-                                    <div className={'w-full mb-2 flex justify-center'}>
+                                    <div className={'w-full mb-2 flex justify-center bg-gray-50 rounded-lg'}>
                                         <img
                                             className={'object-cover rounded-lg'}
                                             src={item.icon}
@@ -75,7 +75,7 @@ const Index = () => {
                         })
                     }
                 </div>
-                <div className={'grid grid-cols-3'}>
+                <div className={'grid grid-cols-3 gap-3'}>
                     {
                         // 终极文章列表
                         list.map((item, index) => {
@@ -86,7 +86,7 @@ const Index = () => {
                                     onClick={() => Taro.navigateTo({url: `./detail?id=${item.articleId}`})}
                                 >
                                     {/* 图片容器 */}
-                                    <div className={'w-full mb-2 flex justify-center'}>
+                                    <div className={'w-full mb-2 flex justify-center bg-gray-50 rounded-lg'}>
                                         <img
                                             className={'object-cover rounded-lg'}
                                             src={item.image}

src/honor/detail.scss

@@ -1,128 +0,0 @@
-.content {
-  padding: 32px;
-  line-height: 2.4rem;
-
-  // 富文本内容样式
-  :global {
-    // 段落样式
-    p {
-      margin: 16px 0;
-      line-height: 1.8;
-      text-align: justify;
-    }
-
-    // 标题样式
-    h1, h2, h3, h4, h5, h6 {
-      margin: 24px 0 16px 0;
-      font-weight: bold;
-      line-height: 1.4;
-    }
-
-    h1 { font-size: 24px; }
-    h2 { font-size: 22px; }
-    h3 { font-size: 20px; }
-    h4 { font-size: 18px; }
-    h5 { font-size: 16px; }
-    h6 { font-size: 14px; }
-
-    // 图片样式
-    img {
-      max-width: 100%;
-      height: auto;
-      border-radius: 8px;
-      margin: 16px 0;
-      display: block;
-    }
-
-    // 列表样式
-    ul, ol {
-      margin: 16px 0;
-      padding-left: 24px;
-
-      li {
-        margin: 8px 0;
-        line-height: 1.6;
-      }
-    }
-
-    // 引用样式
-    blockquote {
-      margin: 16px 0;
-      padding: 16px;
-      background-color: #f5f5f5;
-      border-left: 4px solid #ddd;
-      border-radius: 4px;
-
-      p {
-        margin: 0;
-        font-style: italic;
-      }
-    }
-
-    // 代码样式
-    code {
-      background-color: #f5f5f5;
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-family: 'Courier New', monospace;
-      font-size: 14px;
-    }
-
-    pre {
-      background-color: #f5f5f5;
-      padding: 16px;
-      border-radius: 8px;
-      overflow-x: auto;
-      margin: 16px 0;
-
-      code {
-        background: none;
-        padding: 0;
-      }
-    }
-
-    // 表格样式
-    table {
-      width: 100%;
-      border-collapse: collapse;
-      margin: 16px 0;
-
-      th, td {
-        border: 1px solid #ddd;
-        padding: 12px;
-        text-align: left;
-      }
-
-      th {
-        background-color: #f5f5f5;
-        font-weight: bold;
-      }
-    }
-
-    // 链接样式
-    a {
-      color: #1890ff;
-      text-decoration: none;
-
-      &:hover {
-        text-decoration: underline;
-      }
-    }
-
-    // 分割线样式
-    hr {
-      margin: 24px 0;
-      border: none;
-      border-top: 1px solid #eee;
-    }
-
-    // 强调样式
-    strong, b {
-      font-weight: bold;
-    }
-
-    em, i {
-      font-style: italic;
-    }
-  }
-}

src/honor/detail.tsx

@@ -6,7 +6,6 @@ import {CmsArticle} from "@/api/cms/cmsArticle/model"
 import {Eye} from '@nutui/icons-react-taro'
 // 显示html富文本
 import {View, RichText} from '@tarojs/components'
-import './detail.scss'
 import Line from "@/components/Gap";
 import {getCmsArticle} from "@/api/cms/cmsArticle";
 

src/honor/index.tsx

@@ -73,7 +73,7 @@ const Index = () => {
                                         width: '100%',
                                         height: 'auto'
                                     }}>
-                                    A {item.title}
+                                    {item.title}
                                 </div>
                             </div>
                         )

src/pages/article/article.config.ts

@@ -1,3 +0,0 @@
-export default definePageConfig({
-  navigationBarTitleText: '学习'
-})

src/pages/page/index.scss

@@ -1,128 +0,0 @@
-.content {
-  padding: 32px;
-  line-height: 2.4rem;
-
-  // 富文本内容样式
-  :global {
-    // 段落样式
-    p {
-      margin: 16px 0;
-      line-height: 1.8;
-      text-align: justify;
-    }
-
-    // 标题样式
-    h1, h2, h3, h4, h5, h6 {
-      margin: 24px 0 16px 0;
-      font-weight: bold;
-      line-height: 1.4;
-    }
-
-    h1 { font-size: 24px; }
-    h2 { font-size: 22px; }
-    h3 { font-size: 20px; }
-    h4 { font-size: 18px; }
-    h5 { font-size: 16px; }
-    h6 { font-size: 14px; }
-
-    // 图片样式
-    img {
-      max-width: 100%;
-      height: auto;
-      border-radius: 8px;
-      margin: 16px 0;
-      display: block;
-    }
-
-    // 列表样式
-    ul, ol {
-      margin: 16px 0;
-      padding-left: 24px;
-
-      li {
-        margin: 8px 0;
-        line-height: 1.6;
-      }
-    }
-
-    // 引用样式
-    blockquote {
-      margin: 16px 0;
-      padding: 16px;
-      background-color: #f5f5f5;
-      border-left: 4px solid #ddd;
-      border-radius: 4px;
-
-      p {
-        margin: 0;
-        font-style: italic;
-      }
-    }
-
-    // 代码样式
-    code {
-      background-color: #f5f5f5;
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-family: 'Courier New', monospace;
-      font-size: 14px;
-    }
-
-    pre {
-      background-color: #f5f5f5;
-      padding: 16px;
-      border-radius: 8px;
-      overflow-x: auto;
-      margin: 16px 0;
-
-      code {
-        background: none;
-        padding: 0;
-      }
-    }
-
-    // 表格样式
-    table {
-      width: 100%;
-      border-collapse: collapse;
-      margin: 16px 0;
-
-      th, td {
-        border: 1px solid #ddd;
-        padding: 12px;
-        text-align: left;
-      }
-
-      th {
-        background-color: #f5f5f5;
-        font-weight: bold;
-      }
-    }
-
-    // 链接样式
-    a {
-      color: #1890ff;
-      text-decoration: none;
-
-      &:hover {
-        text-decoration: underline;
-      }
-    }
-
-    // 分割线样式
-    hr {
-      margin: 24px 0;
-      border: none;
-      border-top: 1px solid #eee;
-    }
-
-    // 强调样式
-    strong, b {
-      font-weight: bold;
-    }
-
-    em, i {
-      font-style: italic;
-    }
-  }
-}

src/pages/page/index.tsx

@@ -4,7 +4,6 @@ import {Divider} from '@nutui/nutui-react-taro'
 import {CmsArticle} from "@/api/cms/cmsArticle/model"
 // 显示html富文本
 import {View, RichText} from '@tarojs/components'
-import './index.scss'
 import {getCmsNavigation} from "@/api/cms/cmsNavigation";
 
 function Detail() {

src/photo/detail.scss

@@ -1,128 +0,0 @@
-.content {
-  padding: 32px;
-  line-height: 2.4rem;
-
-  // 富文本内容样式
-  :global {
-    // 段落样式
-    p {
-      margin: 16px 0;
-      line-height: 1.8;
-      text-align: justify;
-    }
-
-    // 标题样式
-    h1, h2, h3, h4, h5, h6 {
-      margin: 24px 0 16px 0;
-      font-weight: bold;
-      line-height: 1.4;
-    }
-
-    h1 { font-size: 24px; }
-    h2 { font-size: 22px; }
-    h3 { font-size: 20px; }
-    h4 { font-size: 18px; }
-    h5 { font-size: 16px; }
-    h6 { font-size: 14px; }
-
-    // 图片样式
-    img {
-      max-width: 100%;
-      height: auto;
-      border-radius: 8px;
-      margin: 16px 0;
-      display: block;
-    }
-
-    // 列表样式
-    ul, ol {
-      margin: 16px 0;
-      padding-left: 24px;
-
-      li {
-        margin: 8px 0;
-        line-height: 1.6;
-      }
-    }
-
-    // 引用样式
-    blockquote {
-      margin: 16px 0;
-      padding: 16px;
-      background-color: #f5f5f5;
-      border-left: 4px solid #ddd;
-      border-radius: 4px;
-
-      p {
-        margin: 0;
-        font-style: italic;
-      }
-    }
-
-    // 代码样式
-    code {
-      background-color: #f5f5f5;
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-family: 'Courier New', monospace;
-      font-size: 14px;
-    }
-
-    pre {
-      background-color: #f5f5f5;
-      padding: 16px;
-      border-radius: 8px;
-      overflow-x: auto;
-      margin: 16px 0;
-
-      code {
-        background: none;
-        padding: 0;
-      }
-    }
-
-    // 表格样式
-    table {
-      width: 100%;
-      border-collapse: collapse;
-      margin: 16px 0;
-
-      th, td {
-        border: 1px solid #ddd;
-        padding: 12px;
-        text-align: left;
-      }
-
-      th {
-        background-color: #f5f5f5;
-        font-weight: bold;
-      }
-    }
-
-    // 链接样式
-    a {
-      color: #1890ff;
-      text-decoration: none;
-
-      &:hover {
-        text-decoration: underline;
-      }
-    }
-
-    // 分割线样式
-    hr {
-      margin: 24px 0;
-      border: none;
-      border-top: 1px solid #eee;
-    }
-
-    // 强调样式
-    strong, b {
-      font-weight: bold;
-    }
-
-    em, i {
-      font-style: italic;
-    }
-  }
-}

src/photo/detail.tsx

@@ -1,12 +1,11 @@
 import {useEffect, useState} from 'react'
-import {Tag} from '@nutui/nutui-react-taro'
 import {useRouter} from '@tarojs/taro'
 import {Divider} from '@nutui/nutui-react-taro'
 import {CmsArticle} from "@/api/cms/cmsArticle/model"
 import {Eye} from '@nutui/icons-react-taro'
+import dayjs from 'dayjs';
 // 显示html富文本
 import {View, RichText} from '@tarojs/components'
-import './detail.scss'
 import Line from "@/components/Gap";
 import {getCmsArticle} from "@/api/cms/cmsArticle";
 
@@ -33,9 +32,10 @@ function Detail() {
     return (
         <div className={'bg-white'}>
             <div className={'p-3 font-bold text-lg'}>{item?.title}</div>
-            <div className={'flex justify-between px-3'}>
+            <div className={'flex items-center text-gray-400 text-xs px-3 gap-3'}>
-                <Tag type={'success'}>{item?.categoryName}</Tag>
+                <div className={'text-red-800'}>{item?.author}</div>
-                <div className={'flex items-center gap-2 text-sm text-gray-400'}><Eye size={14}/>{views}</div>
+                <div>{dayjs(item?.createTime).format('YYYY-MM-DD')}</div>
+                <div className={'flex items-center gap-1'}><Eye size={14}/>{views}</div>
             </div>
             <Divider/>
             <View className={'content text-gray-700 text-sm'}>

src/photo/index.tsx

@@ -75,14 +75,14 @@ const Index = () => {
                         })
                     }
                 </div>
-                <div className={'grid grid-cols-3'}>
+                <div className={'grid grid-cols-2 gap-3'}>
                     {
                         // 终极文章列表
                         list.map((item, index) => {
                             return (
                                 <div
                                     key={index}
-                                    className={'flex flex-col items-center cursor-pointer my-1'}
+                                    className={'flex flex-col items-center cursor-pointer'}
                                     onClick={() => Taro.navigateTo({url: `./detail?id=${item.articleId}`})}
                                 >
                                     {/* 图片容器 */}
@@ -93,10 +93,6 @@ const Index = () => {
                                             alt={item.title || ''}
                                         />
                                     </div>
-                                    {/* 标题 */}
-                                    <div className={'text-xs text-center text-gray-800 leading-tight px-1'}>
-                                        {item.title}
-                                    </div>
                                 </div>
                             )
                         })