From 620f1f8e31cd69a752e48277570fd30f7b57d1d8 Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期五, 26 二月 2021 10:50:23 +0800 Subject: [PATCH] 朔黄检索页面改版,覆盖了一些公共样式,更新字体包 --- src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue | 52 ++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 40 insertions(+), 12 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue index 67cc64b..090a650 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue @@ -112,6 +112,7 @@ :key="ind" :index="index + '-' + ind" @click="checkOption(config, option)" + class="highlevel-option" >{{ option.name }}</el-menu-item> </el-submenu> </el-menu> @@ -205,7 +206,7 @@ </div> </div> <div class="star" @click="toggleFollow(data)"> - <i :class="[data.IsFollow ? 'follow' : '', 'el-icon-star-off']"></i> + <i class="iconfont" :class="[data.IsFollow ? 'follow' : '', 'iconguanzhu']"></i> </div> </div> </el-col> @@ -683,7 +684,9 @@ <style lang="scss"> .search-for-video-analyze { - padding: 20px 30px; + //padding: 20px 30px; + //鍑烘í鍚戞粴鍔ㄦ潯 + padding: 20px 40px; .flex-box { display: flex; } @@ -746,6 +749,8 @@ width: 100px; text-align: left; background: #f3f3f3; + color: rgb(133, 133, 133); + background: #ecf0fc; } .options-wrap { flex: 1; @@ -777,23 +782,25 @@ justify-content: flex-end; .more { margin-top: 6px; - padding: 0px 12px; + padding: 0px 6px; border: 1px solid #ccc; margin-right: 10px; - width: 48px; + width: 44px; height: 26px; line-height: 26px; + border-radius: 2px; &:hover { color: #6486e7; } } .multCheck { margin-top: 6px; - width: 48px; + width: 44px; height: 26px; line-height: 26px; - padding: 0px 12px; + padding: 0px 6px; border: 1px solid #ccc; + border-radius: 2px; &:hover { color: #7695ec; border-color: #7695ec; @@ -829,6 +836,12 @@ min-width: auto; } } + .highlevel-option { + font-size: 12px; + &:hover { + color: #6486e7; + } + } } } } @@ -839,8 +852,7 @@ .data-list { margin-top: 20px; .header-bar { - padding-bottom: 5px; - border-bottom: 1px solid #ddd; + padding-bottom: 10px; .left { float: left; display: flex; @@ -873,11 +885,20 @@ } } .content { - padding-top: 14px; + //padding-top: 14px; + background: #f5f5f5; + background: #fff; + margin: 0 -30px; + margin-bottom: -30px; + padding: 0; // .el-row { // display: flex; // flex-wrap: wrap; // } + .el-row { + padding-top: 20px; + background: #f5f5f5; + } .el-col { margin-bottom: 10px; } @@ -885,9 +906,14 @@ cursor: pointer; position: relative; text-align: left; + background: #fff; border: 1px solid #dedede; border-radius: 5px; - height: 420px; + height: 360px; + margin-bottom: 10px; + &:hover { + box-shadow: 3px 2px 5px 1px rgba(0, 0, 0, 0.3); + } .video-wrap { border-radius: 3px; width: 100%; @@ -909,7 +935,7 @@ padding: 10px; .base-info { > div { - margin-bottom: 5px; + margin-bottom: 1px; } label { color: #999; @@ -963,7 +989,9 @@ } .pagination-center { text-align: center; - margin: 10px auto; + margin: 0 -10px; + padding: 10px 0 20px; + background: #f5f5f5; } } .dialog-video { -- Gitblit v1.8.0