diff --git a/miniprogram/packageComponent/pages/media/channel-live/channel-live.json b/miniprogram/packageComponent/pages/media/channel-live/channel-live.json
index 405598ce..affa09c0 100644
--- a/miniprogram/packageComponent/pages/media/channel-live/channel-live.json
+++ b/miniprogram/packageComponent/pages/media/channel-live/channel-live.json
@@ -1,5 +1,7 @@
 {
   "usingComponents": {},
   "navigationBarTitleText": "channel-live",
-  "renderer": "webview"
+  "componentFramework": "glass-easel",
+  "renderer": "skyline",
+  "navigationStyle": "custom"
 }
\ No newline at end of file
diff --git a/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxml b/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxml
index eb27651f..1fea24ca 100644
--- a/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxml
+++ b/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxml
@@ -1,6 +1,19 @@
-<view>
-	<channel-live
-		feed-id="export/UzFfAgtgekIEAQAAAAAA7UEOPV-7TQAAAAstQy6ubaLX4KHWvLEZgBPEiYIALRwBBP6BzNPgMIspjeQfphOob7LuGRJz_8UF"
-		finder-user-name="sphiUesg6A9wDtl"
-	></channel-live>
-</view> 
+<import src="../../../../common/head.wxml" />
+<import src="../../../../common/foot.wxml" />
+
+<mp-navigation-bar title="channel-live" back="{{true}}"></mp-navigation-bar>
+<template is="head" data="{{title: 'channel-live'}}"/>
+<scroll-view class="page-scroll-view" scroll-y type="list">
+  <view class="container page" data-weui-theme="{{theme}}">
+    <view class="page-body">
+      <view class="page-section page-section-spacing">
+  	    <channel-live
+          style="width: 300px; height: 500px"
+  	    	feed-id="export/UzFfAgtgekIEAQAAAAAA7UEOPV-7TQAAAAstQy6ubaLX4KHWvLEZgBPEiYIALRwBBP6BzNPgMIspjeQfphOob7LuGRJz_8UF"
+  	    	finder-user-name="sphiUesg6A9wDtl"
+  	    ></channel-live>
+      </view>
+    </view>
+    <template is="foot" />
+  </view> 
+</scroll-view>
diff --git a/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxss b/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxss
index c188f16f..6431d7dd 100644
--- a/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxss
+++ b/miniprogram/packageComponent/pages/media/channel-live/channel-live.wxss
@@ -1,13 +1,12 @@
-.intro {
-  margin: 30px;
-  text-align: center;
+@import "../../../../common/reset.wxss";
+
+.page-section-title{
+  padding: 0;
 }
-button {
-	width: 240px !important;
-	margin-top: 40px;
-	line-height: 40px;
+.page-section-title{
+  margin-top: 30px;
+  position: relative;
 }
-view {
-	text-align: center;
-	margin-top: 50px;
+.page-foot{
+  margin-top: 25px;
 }
diff --git a/miniprogram/packageComponent/pages/media/channel-video/channel-video.json b/miniprogram/packageComponent/pages/media/channel-video/channel-video.json
index 09317c7d..27e68fdd 100644
--- a/miniprogram/packageComponent/pages/media/channel-video/channel-video.json
+++ b/miniprogram/packageComponent/pages/media/channel-video/channel-video.json
@@ -1,5 +1,7 @@
 {
   "usingComponents": {},
   "navigationBarTitleText": "channel-video",
-  "renderer": "webview"
+  "componentFramework": "glass-easel",
+  "renderer": "skyline",
+  "navigationStyle": "custom"
 }
\ No newline at end of file
diff --git a/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxml b/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxml
index 6f5ac0fc..3f272356 100644
--- a/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxml
+++ b/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxml
@@ -1,7 +1,19 @@
-<view>
-	<channel-video
-		feed-id="{{feedId}}"
-		finder-user-name="sphiUesg6A9wDtl"
-		autoplay="{{false}}"
-	></channel-video>
-</view> 
+<import src="../../../../common/head.wxml" />
+<import src="../../../../common/foot.wxml" />
+
+<mp-navigation-bar title="channel-video" back="{{true}}"></mp-navigation-bar>
+<template is="head" data="{{title: 'channel-video'}}"/>
+<scroll-view class="page-scroll-view" scroll-y type="list">
+  <view class="container page" data-weui-theme="{{theme}}">
+    <view class="page-body">
+      <view class="page-section page-section-spacing channel-video">
+        <channel-video
+  	    	feed-id="{{feedId}}"
+  	    	finder-user-name="sphiUesg6A9wDtl"
+  	    	autoplay="{{false}}"
+  	    ></channel-video>
+      </view>
+    </view>
+    <template is="foot"/> 
+  </view>
+</scroll-view>
diff --git a/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxss b/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxss
index 798c9bd4..6431d7dd 100644
--- a/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxss
+++ b/miniprogram/packageComponent/pages/media/channel-video/channel-video.wxss
@@ -1,14 +1,12 @@
-.intro {
-	margin: 30px;
-	text-align: center;
-  }
-  button {
-	  width: 240px !important;
-	  margin-top: 40px;
-	  line-height: 40px;
-  }
-  view {
-	  text-align: center;
-	  margin-top: 50px;
-  }
-  
\ No newline at end of file
+@import "../../../../common/reset.wxss";
+
+.page-section-title{
+  padding: 0;
+}
+.page-section-title{
+  margin-top: 30px;
+  position: relative;
+}
+.page-foot{
+  margin-top: 25px;
+}