diff --git a/pages.json b/pages.json
index 0e909f74a7331745fb714ab38cced0b1c58b664a..b094fd5b5e92db01a538f41ea06d839ff302a1f7 100644
--- a/pages.json
+++ b/pages.json
@@ -715,21 +715,21 @@
       }
     },
     {
-      "path": "pages/component/list-news/list",
+      "path": "pages/template/list-news/list-news",
       "style": {
         "navigationBarTitleText": "列表到详情示例"
       }
     },
     {
-      "path": "pages/API/get-network-type/get-network-type",
+      "path": "pages/template/list-news/detail/detail",
       "style": {
-        "navigationBarTitleText": ""
+        "navigationBarTitleText": "详情示例"
       }
     },
     {
-      "path": "pages/component/list-news/detail/detail",
+      "path": "pages/API/get-network-type/get-network-type",
       "style": {
-        "navigationBarTitleText": "详情示例"
+        "navigationBarTitleText": ""
       }
     },
     {
diff --git a/pages/API/action-sheet/action-sheet.uvue b/pages/API/action-sheet/action-sheet.uvue
index 70f398eb1dda4d164f50ed399f01b65b85105904..60e8adc88ee0c1e617c488d0ca8878c0b13ce17d 100644
--- a/pages/API/action-sheet/action-sheet.uvue
+++ b/pages/API/action-sheet/action-sheet.uvue
@@ -1,173 +1,133 @@
 <template>
-    <view>
-        <page-head :title="title"></page-head>
-		<view class="uni-list">
-		    <radio-group @change="radioChange">
-		        <radio class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value"
-		            :class="index < items.length - 1 ? 'uni-list-cell-line': ''" :value="item.value"
-		            :checked="index === current">
-		            {{item.name}}
-		        </radio>
-		    </radio-group>
-		</view>
-		<view class="uni-list">
-		  <view class="uni-list-cell uni-list-cell-pd">
-		    <view class="uni-list-cell-db">自定义itemColor</view>
-		    <switch :checked="itemColorCustom" @change="itemColorChange"/>
-		  </view>
-		  <view class="uni-list-cell uni-list-cell-pd">
-		    <view class="uni-list-cell-db">超长列表文本</view>
-		    <switch :checked="itemContentLarge" @change="itemContentLargeChange"/>
-		  </view>
-		  <view class="uni-list-cell uni-list-cell-pd">
-		    <view class="uni-list-cell-db">大量选项</view>
-		    <switch :checked="itemNumLargeSelect" @change="itemNumLargeChange"/>
-		  </view>
-		</view>
-        <view class="uni-padding-wrap">
-            <view class="uni-btn-v">
-                <button class="uni-btn-v" type="default" @tap="actionSheetTap">弹出action sheet</button>
-            </view>
-        </view>
+  <view>
+    <page-head :title="title"></page-head>
+    <view class="uni-list">
+      <radio-group @change="radioChange">
+        <radio class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value"
+          :class="index < items.length - 1 ? 'uni-list-cell-line': ''" :value="item.value" :checked="index === current">
+          {{item.name}}
+        </radio>
+      </radio-group>
     </view>
+    <view class="uni-list">
+      <view class="uni-list-cell uni-list-cell-pd">
+        <view class="uni-list-cell-db">自定义itemColor</view>
+        <switch :checked="itemColorCustom" @change="itemColorChange" />
+      </view>
+      <view class="uni-list-cell uni-list-cell-pd">
+        <view class="uni-list-cell-db">超长文本和空文本item</view>
+        <switch :checked="itemContentLarge" @change="itemContentLargeChange" />
+      </view>
+      <view class="uni-list-cell uni-list-cell-pd">
+        <view class="uni-list-cell-db">超过6个item</view>
+        <switch :checked="itemNumLargeSelect" @change="itemNumLargeChange" />
+      </view>
+    </view>
+    <view class="uni-padding-wrap">
+      <view class="uni-btn-v">
+        <button class="uni-btn-v" type="default" @tap="actionSheetTap">弹出action sheet</button>
+      </view>
+    </view>
+  </view>
 </template>
 <script lang="uts">
-	type ItemType = {
-	    value : string,
-	    name : string,
-	}
-    export default {
-        data() {
-            return {
-                title: 'action-sheet',
-				itemColorCustom:false,
-				itemContentLarge:false,
-				itemNumLargeSelect:false,
-				items: [{
-				    value: '标题',
-				    name: '有标题'
-				},
-				{
-				    value: '',
-				    name: '无标题'
-				},
-				{
-				    value: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',
-				    name: '超长标题'
-				}
-				] as ItemType[],
-				current: 0,
-                // #ifdef H5
-                buttonRect: {},
-                // #endif
-            }
+  type ItemType = {
+    value : string,
+    name : string,
+  }
+  export default {
+    data() {
+      return {
+        title: 'action-sheet',
+        itemColorCustom: false,
+        itemContentLarge: false,
+        itemNumLargeSelect: false,
+        items: [{
+          value: '标题',
+          name: '有标题'
         },
-        // #ifdef H5
-        onReady() {
-            this.getNodeInfo()
-            window.addEventListener('resize', this.getNodeInfo)
+        {
+          value: '',
+          name: '无标题'
         },
-        beforeDestroy() {
-            window.removeEventListener('resize', this.getNodeInfo)
-        },
-        // #endif
-        methods: {
-			radioChange(e : RadioGroupChangeEvent) {
-			    for (let i = 0; i < this.items.length; i++) {
-			        if (this.items[i].value === e.detail.value) {
-			            this.current = i;
-			            break;
-			        }
-			    }
-			},
-			itemContentLargeChange: function (e : SwitchChangeEvent) {
-				this.itemContentLarge = e.detail.value
-			},
-			itemColorChange: function (e : SwitchChangeEvent) {
-				this.itemColorCustom = e.detail.value
-			},
-			itemNumLargeChange: function (e : SwitchChangeEvent) {
-				this.itemNumLargeSelect = e.detail.value
-			},
-            actionSheetTap() {
-				
-				let itemInfo = ['item1', 'item2', 'item3', 'item4']
-				
-				if(this.itemContentLarge){
-					itemInfo = ['两个黄鹂鸣翠柳，一行白鹭上青天。窗含西岭千秋雪，门泊东吴万里船', '水光潋滟晴方好,山色空蒙雨亦奇。 欲把西湖比西子,淡妆浓抹总相宜', '']
-				}else if(this.itemNumLargeSelect){
-					// 大量选项测试,不能超过6个元素 https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet
-					itemInfo = []
-					for (var i = 1; i <= 10; i++) {
-					    itemInfo.push('两个黄鹂鸣翠柳，一行白鹭上青天');
-					}
-				}
-				
-				const that = this
-				if(this.itemColorCustom){
-					uni.showActionSheet({
-					    title: this.items[this.current].value,
-					    itemList: itemInfo,
-						itemColor:"#ff00ff",
-					    // #ifdef H5
-					    popover: {
-					        // 104: navbar + topwindow 高度，暂时 fix createSelectorQuery 在 pc 上获取 top 不准确的 bug
-					        top: that.buttonRect.top + 104 + that.buttonRect.height,
-					        left: that.buttonRect.left + that.buttonRect.width / 2
-					    },
-					    // #endif
-					    success: (e) => {
-					        console.log(e.tapIndex);
-					        uni.showToast({
-					            title: "点击了第" + e.tapIndex + "个选项",
-					            icon: "none"
-					        })
-					    },
-						fail: (e) => {
-						    console.log(e);
-						}
-					})
-				}else{
-					uni.showActionSheet({
-					    title: this.items[this.current].value,
-					    itemList: itemInfo,
-					    // #ifdef H5
-					    popover: {
-					        // 104: navbar + topwindow 高度，暂时 fix createSelectorQuery 在 pc 上获取 top 不准确的 bug
-					        top: that.buttonRect.top + 104 + that.buttonRect.height,
-					        left: that.buttonRect.left + that.buttonRect.width / 2
-					    },
-					    // #endif
-					    success: (e) => {
-					        console.log(e.tapIndex);
-					        uni.showToast({
-					            title: "点击了第" + e.tapIndex + "个选项",
-					            icon: "none"
-					        })
-					    },
-						fail: (e) => {
-						    console.log(e);
-							uni.showToast({
-							    title: e.errMsg,
-							    icon: "none"
-							})
-						}
-					})
-				}
-                
-                
+        {
+          value: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',
+          name: '超长标题'
+        }
+        ] as ItemType[],
+        current: 0,
+      }
+    },
+    methods: {
+      radioChange(e : RadioGroupChangeEvent) {
+        for (let i = 0; i < this.items.length; i++) {
+          if (this.items[i].value === e.detail.value) {
+            this.current = i;
+            break;
+          }
+        }
+      },
+      itemContentLargeChange: function (e : SwitchChangeEvent) {
+        this.itemContentLarge = e.detail.value
+      },
+      itemColorChange: function (e : SwitchChangeEvent) {
+        this.itemColorCustom = e.detail.value
+      },
+      itemNumLargeChange: function (e : SwitchChangeEvent) {
+        this.itemNumLargeSelect = e.detail.value
+      },
+      actionSheetTap() {
+
+        let itemInfo = ['item1', 'item2', 'item3', 'item4']
+
+        if (this.itemContentLarge) {
+          itemInfo = ['两个黄鹂鸣翠柳，一行白鹭上青天。窗含西岭千秋雪，门泊东吴万里船', '水光潋滟晴方好,山色空蒙雨亦奇。 欲把西湖比西子,淡妆浓抹总相宜', '']
+        } else if (this.itemNumLargeSelect) {
+          // 大量选项测试,不能超过6个元素 https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet
+          itemInfo = []
+          for (var i = 1; i <= 10; i++) {
+            itemInfo.push('两个黄鹂鸣翠柳，一行白鹭上青天');
+          }
+        }
+
+        const that = this
+        if (this.itemColorCustom) {
+          uni.showActionSheet({
+            title: this.items[this.current].value,
+            itemList: itemInfo,
+            itemColor: "#ff00ff",
+            success: (e) => {
+              console.log(e.tapIndex);
+              uni.showToast({
+                title: "点击了第" + e.tapIndex + "个选项",
+                icon: "none"
+              })
+            },
+            fail: (e) => {
+              console.log(e);
+            }
+          })
+        } else {
+          uni.showActionSheet({
+            title: this.items[this.current].value,
+            itemList: itemInfo,
+            success: (e) => {
+              console.log(e.tapIndex);
+              uni.showToast({
+                title: "点击了第" + e.tapIndex + "个选项",
+                icon: "none"
+              })
             },
-			
-            // #ifdef H5
-            getNodeInfo() {
-                uni.createSelectorQuery().select('.target').boundingClientRect().exec((ret) => {
-                    const rect = ret[0]
-                    if (rect) {
-                        this.buttonRect = rect
-                    }
-                });
+            fail: (e) => {
+              console.log(e);
+              uni.showToast({
+                title: e.errMsg,
+                icon: "none"
+              })
             }
-            // #endif
+          })
         }
+      },
     }
-</script>
\ No newline at end of file
+  }
+</script>
diff --git a/pages/component/rich-text/rich-text-complex.uvue b/pages/component/rich-text/rich-text-complex.uvue
index 73b1518c2047afab18c1918f40b8e2ae52c2d257..d48f2cd1babd3d7e07980c2b028f83acb8a9189f 100644
--- a/pages/component/rich-text/rich-text-complex.uvue
+++ b/pages/component/rich-text/rich-text-complex.uvue
@@ -3,7 +3,7 @@
   <scroll-view>
     <!-- #endif -->
     <view>
-      <page-head :title="title"></page-head>
+      <page-head title="rich-text-complex"></page-head>
       <view class="uni-padding-wrap uni-common-mt">
         <rich-text :nodes="htmlString" @itemclick="itemClick"></rich-text>
       </view>
@@ -17,21 +17,21 @@
   export default {
     data() {
       return {
-        title: 'rich-text-complex',
         htmlString: '<p><a href="https://www.dcloud.io/hbuilderx.html">HBuilderX</a><br/><img src="https://web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png"></img><h1>HBuilderX，轻巧、极速，极客编辑器</h1><p style="color:red;"><small>HBuilderX，轻巧、极速，极客编辑器 </small><big>HBuilderX，轻巧、极速，极客编辑器</big><strong>HBuilderX，轻巧、极速，极客编辑器</strong><i>HBuilderX，轻巧、极速，极客编辑器 </i><u>HBuilderX，轻巧、极速，极客编辑器</u><del>HBuilderX，轻巧、极速，极客编辑器</del></p><h2>uni-app x，终极跨平台方案</h2>、<p style="background-color: yellow;"><small>uni-app x，终极跨平台方案 </small><big>uni-app x，终极跨平台方案</big><strong>uni-appx，终极跨平台方案 </strong><i>uni-app x，终极跨平台方案 </i><u>uni-app x，终极跨平台方案 </u><del>uni-appx，终极跨平台方案</del></p><h3>uniCloud，js serverless云服务</h3><p style="text-decoration: line-through;"><small>uniCloud，js serverless云服务 </small><big>uniCloud，jsserverless云服务</big><strong>uniCloud，js serverless云服务 </strong><i>uniCloud，js serverless云服务 </i><u>uniCloud，jsserverless云服务</u><del>uniCloud，js serverless云服务</del></p><h4>uts，大一统语言</h4><p style="text-align: center;"><small>uts，大一统语言 </small><big>uts，大一统语言 </big><strong>uts，大一统语言</strong><i>uts，大一统语言</i><u>uts，大一统语言 </u><del>uts，大一统语言</del></p><h5>uniMPSdk，让你的App具备小程序能力</h5><h6>uni-admin，开源、现成的全端管理后台</h6><ul><li style="color: red; text-align: left;">uni-app x，终极跨平台方案</li><li style="color: green; text-align: center;">uni-app x，终极跨平台方案</li><li style="color: blue; text-align: right;">uni-app x，终极跨平台方案</li></ul><a href="https://uniapp.dcloud.net.cn">uni-app</a><br/><img src="https://web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png"></img></p>'
       }
     },
     methods: {
       itemClick(e : RichTextItemClickEvent) {
         console.log(JSON.stringify(e.detail));
-        let title = '';
+        let clicktext = '';
         if (e.detail.src != null) {
-          title = '点击了图片，src = ' + e.detail.src;
+          clicktext = '点击了图片，src = ' + e.detail.src;
         } else if (e.detail.href != null) {
-          title = '点击了链接，href = ' + e.detail.href;
+          clicktext = '点击了链接，href = ' + e.detail.href;
         }
         uni.showModal({
-          title: title
+          content:clicktext,
+          showCancel:false
         });
       }
     }
diff --git a/pages/component/rich-text/rich-text-tags.uvue b/pages/component/rich-text/rich-text-tags.uvue
index 71221c394bcd291ba9713ca4556b425325ea4024..fbbb30abf2156d8e58fd2499844960db80f86e74 100644
--- a/pages/component/rich-text/rich-text-tags.uvue
+++ b/pages/component/rich-text/rich-text-tags.uvue
@@ -2,7 +2,7 @@
   <!-- #ifdef APP -->
   <scroll-view>
     <!-- #endif -->
-    <page-head :title="title"></page-head>
+    <page-head title="rich-text-tags"></page-head>
     <view class="uni-padding-wrap uni-common-mt">
       <view class="uni-title">
         <text class="uni-title-text">支持的HTML标签</text>
@@ -23,7 +23,6 @@
   export default {
     data() {
       return {
-        title: 'rich-text-tags',
         data: [
           {
             name: '<br/>',
@@ -301,14 +300,15 @@
     methods: {
       itemClick(e : RichTextItemClickEvent) {
         console.log(JSON.stringify(e.detail));
-        let title = '';
+        let clicktext = '';
         if (e.detail.src != null) {
-          title = '点击了图片，src = ' + e.detail.src;
+          clicktext = '点击了图片，src = ' + e.detail.src;
         } else if (e.detail.href != null) {
-          title = '点击了链接，href = ' + e.detail.href;
+          clicktext = '点击了链接，href = ' + e.detail.href;
         }
         uni.showModal({
-          title: title
+          content:clicktext,
+          showCancel:false
         });
       }
     }
diff --git a/pages/tabBar/API.uvue b/pages/tabBar/API.uvue
index 58b5562d3469b0ba89410e1916b8804e6595bf1c..fa231d956c7dead4722a3e103bae1e074b1e9401 100644
--- a/pages/tabBar/API.uvue
+++ b/pages/tabBar/API.uvue
@@ -130,10 +130,9 @@
           {
             id: 'network',
             name: '网络',
-            open: false,
             pages: [
               {
-                name: '发起一个请求',
+                name: '发起请求request',
                 url: 'request',
               },
               {
@@ -158,10 +157,6 @@
                 url: 'websocket-global',
                 api: ["connectSocket", "onSocketOpen", "onSocketError", "sendSocketMessage", "onSocketMessage", "closeSocket", "onSocketClose"]
               },
-              {
-                name: '请求云函数',
-                url: 'call-function',
-              },
             ] as Page[],
           },
           {
@@ -348,7 +343,6 @@
           {
             id: 'location',
             name: '位置',
-            open: false,
             pages: [
               {
                 name: '获取当前位置',
@@ -375,7 +369,6 @@
           {
             id: 'storage',
             name: '数据存储',
-            open: false,
             pages: [
               {
                 name: 'storage（key-value存储）',
@@ -383,6 +376,16 @@
                 api: ["uni.getStorageInfo", "uni.getStorageInfoSync", "uni.getStorage", "uni.getStorageSync", "uni.setStorage", "uni.setStorageSync", "uni.removeStorage", "uni.removeStorageSync", "uni.clearStorage", "uni.clearStorageSync"]
               },
             ] as Page[],
+          },
+          {
+            id: 'unicloud',
+            name: 'uniCloud',
+            pages: [
+              {
+                name: '云函数',
+                url: 'call-function',
+              },
+            ] as Page[],
           },
           /* {
             id: "rewarded-video-ad",
@@ -521,4 +524,4 @@
   .item {
     margin-bottom: 12px;
   }
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/tabBar/component.uvue b/pages/tabBar/component.uvue
index 2a493b24d6c8c35be6c5026096b478a13c9ef3cc..1466446cf946b24387adc214a28b41ac7d19c60d 100644
--- a/pages/tabBar/component.uvue
+++ b/pages/tabBar/component.uvue
@@ -87,14 +87,6 @@ export default {
                 enable: false
               },
               */
-            {
-              name: 'list（新闻）',
-              url: '/pages/component/list-news/list',
-            },
-            // {
-            //   name: 'list',
-            //   url: '/pages/component/long-list/long-list',
-            // },
             {
               name: 'list-view',
             },
diff --git a/pages/tabBar/template.uvue b/pages/tabBar/template.uvue
index 0e832aa2570cf21c9138b42c3b8a146c2e2a94d3..50921bca17c80f03b9b2c717be41dd9cac1ab9ea 100644
--- a/pages/tabBar/template.uvue
+++ b/pages/tabBar/template.uvue
@@ -87,6 +87,13 @@ export default {
           open: false,
           enable: true,
           pages: [] as Page[],
+        },
+        {
+          id: 'list-news',
+          url: 'list-news',
+          name: '列表到详情',
+          open: false,
+          pages: [] as Page[],
         },
         {
           id: 'scroll-fold-nav',
@@ -100,17 +107,17 @@ export default {
           url: 'swiper-list',
           name: 'swiper-list',
           open: false,
-          enable: true,
-          pages: [] as Page[],
+          pages: [
+            {
+              name: '下划线样式',
+              url:'swiper-list'
+            },
+            {
+              name: '字体放大样式',
+              url:'swiper-list2'
+            },
+          ] as Page[],
         },
-        {
-          id: 'swiper-list2',
-          url: 'swiper-list2',
-          name: 'swiper-list2',
-          open: false,
-          enable: true,
-          pages: [] as Page[],
-        },
         {
           id: 'custom-refresher',
           url: 'custom-refresher',
diff --git a/pages/component/list-news/detail/detail.uvue b/pages/template/list-news/detail/detail.uvue
similarity index 95%
rename from pages/component/list-news/detail/detail.uvue
rename to pages/template/list-news/detail/detail.uvue
index 4bff5ea32abbcbb81f52a9e0b60f85d7ad5adc79..09f151e7de0eecaddd97f0dee6ef8e9d36e3dcac 100644
--- a/pages/component/list-news/detail/detail.uvue
+++ b/pages/template/list-news/detail/detail.uvue
@@ -1,81 +1,81 @@
-<template>
-	<!-- #ifdef APP -->
-	<scroll-view style="flex: 1">
-	<!-- #endif -->
-    <view class="banner">
-      <image class="banner-img" :src="cover"></image>
-      <text class="banner-title">{{title}}</text>
-    </view>
-    <rich-text :nodes="htmlNodes" style="padding: 3px"></rich-text>
-	<!-- #ifdef APP -->
-	</scroll-view>
-	<!-- #endif -->
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				htmlNodes: "",
-				title: '',
-				cover: "",
-				post_id: "",
-			}
-		},
+<template>
+	<!-- #ifdef APP -->
+	<scroll-view style="flex: 1">
+	<!-- #endif -->
+    <view class="banner">
+      <image class="banner-img" :src="cover"></image>
+      <text class="banner-title">{{title}}</text>
+    </view>
+    <rich-text :nodes="htmlNodes" style="padding: 3px"></rich-text>
+	<!-- #ifdef APP -->
+	</scroll-view>
+	<!-- #endif -->
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				htmlNodes: "",
+				title: '',
+				cover: "",
+				post_id: "",
+			}
+		},
 		onLoad(event) {
-      // console.log(event);
-			this.post_id = event["post_id"] ?? "";
-			this.cover = event["cover"] ?? "";
-			this.title = event["title"] ?? "";
-			this.getDetail();
-		},
-		methods: {
-			getDetail() {
-				uni.request({
-					url: 'https://unidemo.dcloud.net.cn/api/news/36kr/' + this.post_id,
-					success: (data) => {
-            if (data.statusCode == 200) {
+      // console.log(event);
+			this.post_id = event["post_id"] ?? "";
+			this.cover = event["cover"] ?? "";
+			this.title = event["title"] ?? "";
+			this.getDetail();
+		},
+		methods: {
+			getDetail() {
+				uni.request({
+					url: 'https://unidemo.dcloud.net.cn/api/news/36kr/' + this.post_id,
+					success: (data) => {
+            if (data.statusCode == 200) {
               const result = data.data as UTSJSONObject
-              // console.log(result["content"]);
-              this.htmlNodes = result["content"] as string;
-            }
-					},
-					fail: () => {
-						console.log('fail');
-					}
-				});
-			},
-		}
-	}
-</script>
-
-<style>
-	.banner {
-		height: 360rpx;
-		overflow: hidden;
-		position: relative;
-		background-color: #ccc;
-	}
-
-	.banner-img {
-		width: 100%;
-	}
-
-	.banner-title {
-		max-height: 84rpx;
-		overflow: hidden;
-		position: absolute;
-		left: 30rpx;
-		bottom: 30rpx;
-		width: 90%;
-		font-size: 32rpx;
-		font-weight: 400;
-		line-height: 42rpx;
-		color: white;
-	}
-	.article-content {
-		padding: 0 30rpx;
-		overflow: hidden;
-		margin-bottom: 30rpx;
-	}
+              // console.log(result["content"]);
+              this.htmlNodes = result["content"] as string;
+            }
+					},
+					fail: () => {
+						console.log('fail');
+					}
+				});
+			},
+		}
+	}
+</script>
+
+<style>
+	.banner {
+		height: 360rpx;
+		overflow: hidden;
+		position: relative;
+		background-color: #ccc;
+	}
+
+	.banner-img {
+		width: 100%;
+	}
+
+	.banner-title {
+		max-height: 84rpx;
+		overflow: hidden;
+		position: absolute;
+		left: 30rpx;
+		bottom: 30rpx;
+		width: 90%;
+		font-size: 32rpx;
+		font-weight: 400;
+		line-height: 42rpx;
+		color: white;
+	}
+	.article-content {
+		padding: 0 30rpx;
+		overflow: hidden;
+		margin-bottom: 30rpx;
+	}
 </style>
diff --git a/pages/component/list-news/list.uvue b/pages/template/list-news/list-news.uvue
similarity index 93%
rename from pages/component/list-news/list.uvue
rename to pages/template/list-news/list-news.uvue
index ee7a12c131fa44e6742a711d7ce05f82e04cb442..d839d844440cc5dbbfe28a38193560f872b2c099 100644
--- a/pages/component/list-news/list.uvue
+++ b/pages/template/list-news/list-news.uvue
@@ -1,89 +1,89 @@
-<template>
-	<view style="width: 100%;height: 100%;">
-		<view class="banner" @click="bannerClick(banner)">
-			<image class="banner-img" :src="banner.cover"></image>
-			<text class="banner-title">{{ banner.title }}</text>
-		</view>
-		<list-view class="uni-list-content" refresher-enabled=true @refresherrefresh="onRefresherrefresh"
-			:refresher-triggered="refresherTriggered" scroll-y = true>
+<template>
+	<view style="width: 100%;height: 100%;">
+		<view class="banner" @click="bannerClick(banner)">
+			<image class="banner-img" :src="banner.cover"></image>
+			<text class="banner-title">{{ banner.title }}</text>
+		</view>
+		<list-view class="uni-list-content" refresher-enabled=true @refresherrefresh="onRefresherrefresh"
+			:refresher-triggered="refresherTriggered" scroll-y = true>
 			<list-item v-for="(value, index) in listData" :key="index">
-				<view class="uni-list-cell" hover-class="uni-list-cell-hover" @click="goDetail(value)">
-					<view class="uni-media-list">
-						<image class="uni-media-list-logo" :src="value.cover"></image>
-						<view class="uni-media-list-body">
-							<text class="uni-media-list-text-top">{{ value.title }}</text>
-							<view class="uni-media-list-text-bottom">
-								<text class="uni-media-list-text">{{ value.author_name }}</text>
-								<text class="uni-media-list-text">{{ value.published_at }}</text>
-							</view>
-						</view>
-					</view>
-				</view>
+				<view class="uni-list-cell" hover-class="uni-list-cell-hover" @click="goDetail(value)">
+					<view class="uni-media-list">
+						<image class="uni-media-list-logo" :src="value.cover"></image>
+						<view class="uni-media-list-body">
+							<text class="uni-media-list-text-top">{{ value.title }}</text>
+							<view class="uni-media-list-text-bottom">
+								<text class="uni-media-list-text">{{ value.author_name }}</text>
+								<text class="uni-media-list-text">{{ value.published_at }}</text>
+							</view>
+						</view>
+					</view>
+				</view>
 			</list-item>
-		</list-view>
-	</view>
-</template>
-
+		</list-view>
+	</view>
+</template>
+
 <script>
-	type Banner = {
-		cover: string | null,
+	type Banner = {
+		cover: string | null,
 		title: string | null,
 		post_id: string | null
-	}
-	type Item = {
-		author_name: string,
-		cover: string,
-		id: number,
-		post_id: string,
-		published_at: string,
-		title: string
-	}
+	}
+	type Item = {
+		author_name: string,
+		cover: string,
+		id: number,
+		post_id: string,
+		published_at: string,
+		title: string
+	}
 
-	export default {
-		data() {
-			return {
-				refresherTriggered: false,
-				banner: {} as Banner,
-				listData: [] as Item[],
-				last_id: '',
-				pageVisible: false
-			};
-		},
-		onLoad() {
-			this.pageVisible = true;
-			this.getBanner();
+	export default {
+		data() {
+			return {
+				refresherTriggered: false,
+				banner: {} as Banner,
+				listData: [] as Item[],
+				last_id: '',
+				pageVisible: false
+			};
+		},
+		onLoad() {
+			this.pageVisible = true;
+			this.getBanner();
 			this.getList();
-		},
-		onUnload() {
-			this.pageVisible = false;
-		},
-		methods: {
-			getBanner() {
-				let data = {
-					column: 'id,post_id,title,author_name,cover,published_at' //需要的字段名
-				};
-				uni.request({
-					url: 'https://unidemo.dcloud.net.cn/api/banner/36kr',
-					data: data,
+		},
+		onUnload() {
+			this.pageVisible = false;
+		},
+		methods: {
+			getBanner() {
+				let data = {
+					column: 'id,post_id,title,author_name,cover,published_at' //需要的字段名
+				};
+				uni.request({
+					url: 'https://unidemo.dcloud.net.cn/api/banner/36kr',
+					data: data,
 					success: data => {
 						if(this.pageVisible){
-							this.refresherTriggered = false
-							if (data.statusCode == 200) {
+							this.refresherTriggered = false
+							if (data.statusCode == 200) {
 								let result = data.data as UTSJSONObject;
-								this.banner = {
-									cover: result["cover"] as string,
+								this.banner = {
+									cover: result["cover"] as string,
 									title: result["title"] as string,
-									post_id: result["post_id"] as string
-								} as Banner;
+									post_id: result["post_id"] as string
+								} as Banner;
 							}
-						}
-					},
-					fail: (e) => {
-						console.log('fail', e);
-					}
-				});
-			},
-			getList() {
+						}
+					},
+					fail: (e) => {
+						console.log('fail', e);
+					}
+				});
+			},
+			getList() {
 				let url = "https://unidemo.dcloud.net.cn/api/news?column=id,post_id,title,author_name,cover,published_at";
 				if (this.last_id != "") {
 					const minId = (this.last_id).toInt();
@@ -91,12 +91,12 @@
 					const pageSize = 10;
 					url = url + "&minId=" + minId + "&time=" + time + "&pageSize=" + pageSize;
 				}
-				
-				uni.request({
-					url: url,
-					method:"GET",
+
+				uni.request({
+					url: url,
+					method:"GET",
 					success: (data) => {
-						if(this.pageVisible){
+						if(this.pageVisible){
 							if (data.statusCode == 200) {
 								const result = data.data as UTSJSONObject[]
 								if(result != null){
@@ -106,24 +106,24 @@
 								}
 								this.refresherTriggered = false;
 							}
-						}
-					},
+						}
+					},
 					fail: (res) => {
-						if(this.pageVisible){
+						if(this.pageVisible){
 							console.log('fail', res);
 							this.refresherTriggered = false
-						}
-					}
-				});
-			},
+						}
+					}
+				});
+			},
 			goDetail(e: Item) {
 				const detail = e;
 				const post_id = detail.post_id;
 				const cover = detail.cover;
 				const title = detail.title;
-				uni.navigateTo({
-					url: '/pages/component/list-news/detail/detail?post_id=' + post_id + "&cover=" + cover + "&title=" + title
-				});
+				uni.navigateTo({
+					url: '/pages/template/list-news/detail/detail?post_id=' + post_id + "&cover=" + cover + "&title=" + title
+				});
 			},
 			bannerClick(e:Banner){
 				const detail = e;
@@ -131,9 +131,9 @@
 				const cover = detail.cover;
 				const title = detail.title;
 				uni.navigateTo({
-					url: '/pages/component/list-news/detail/detail?post_id=' + post_id + "&cover=" + cover + "&title=" + title
+					url: '/pages/template/list-news/detail/detail?post_id=' + post_id + "&cover=" + cover + "&title=" + title
 				});
-			},
+			},
 			setTime(items: UTSJSONObject[]): Item[] {
 				let newItems = [] as Item[];
 				for(const item in items){
@@ -147,63 +147,63 @@
 							title: e["title"] as string
 						} as Item);
 				}
-				return newItems;
-			},
+				return newItems;
+			},
 			onRefresherrefresh() {
 				if(this.pageVisible){
-					this.refresherTriggered = true
-					this.getBanner();
+					this.refresherTriggered = true
+					this.getBanner();
 					this.getList();
 				}
-			}
-		}
-	};
-</script>
-
-<style>
-	.banner {
-		height: 360rpx;
-		overflow: hidden;
-		position: relative;
-		background-color: #ccc;
-	}
-
-	.banner-img {
-		width: 100%;
-	}
-
-	.banner-title {
-		max-height: 84rpx;
-		overflow: hidden;
-		position: absolute;
-		left: 30rpx;
-		bottom: 30rpx;
-		width: 90%;
-		font-size: 32rpx;
-		font-weight: 400;
-		line-height: 42rpx;
-		color: white;
-	}
-
-	.uni-media-list {
-		padding: 22rpx 30rpx;
-		box-sizing: border-box;
-		display: flex;
-		width: 100%;
-		flex-direction: row;
-	}
-
-	.uni-media-list-logo {
-		width: 180rpx;
-		height: 140rpx;
-	}
-
+			}
+		}
+	};
+</script>
+
+<style>
+	.banner {
+		height: 360rpx;
+		overflow: hidden;
+		position: relative;
+		background-color: #ccc;
+	}
+
+	.banner-img {
+		width: 100%;
+	}
+
+	.banner-title {
+		max-height: 84rpx;
+		overflow: hidden;
+		position: absolute;
+		left: 30rpx;
+		bottom: 30rpx;
+		width: 90%;
+		font-size: 32rpx;
+		font-weight: 400;
+		line-height: 42rpx;
+		color: white;
+	}
+
+	.uni-media-list {
+		padding: 22rpx 30rpx;
+		box-sizing: border-box;
+		display: flex;
+		width: 100%;
+		flex-direction: row;
+	}
+
+	.uni-media-list-logo {
+		width: 180rpx;
+		height: 140rpx;
+	}
+
 	.uni-media-list-body {
 		flex: 1;
-		padding-left: 15rpx;
-		justify-content: space-around;
+		padding-left: 15rpx;
+		justify-content: space-around;
 	}
-	
+
 	.uni-list-content{
 		background-color: #FFFFFF;
 		position: relative;
@@ -211,23 +211,23 @@
 		flex-direction: column;
 		border-bottom: 1px solid #c8c7cc;
 		flex: 1;
-	}
-
-	.uni-media-list-text-top {
-		/* height: 74rpx; */
+	}
+
+	.uni-media-list-text-top {
+		/* height: 74rpx; */
 		font-size: 28rpx;
 		lines:2;
-		overflow: hidden;
-	}
-
-	.uni-media-list-text-bottom {
-		display: flex;
+		overflow: hidden;
+	}
+
+	.uni-media-list-text-bottom {
+		display: flex;
 		flex-direction: row;
-		justify-content: space-between;
+		justify-content: space-between;
 	}
-	
+
 	.uni-media-list-text {
 		color: #9D9D9F;
 		font-size: 25rpx;
-	}
-</style>
\ No newline at end of file
+	}
+</style>