From 9be3c4c4436549b097b93667f3febd592e55480f Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期四, 14 十月 2021 13:51:12 +0800 Subject: [PATCH] 显示有几个算法单元 --- src/pages/settings/views/generalSettings.vue | 83 ++++++++++++++++++++++------------------- 1 files changed, 44 insertions(+), 39 deletions(-) diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue index fa4e6d4..738019d 100644 --- a/src/pages/settings/views/generalSettings.vue +++ b/src/pages/settings/views/generalSettings.vue @@ -139,7 +139,7 @@ </div> <div class="bar-group"> <div - class="bar" + class="general-bar" v-for="(item, i) in soundList" :key="i" @click="clickSound(item, i)" @@ -148,7 +148,7 @@ <div class="left-part"> <span class="name">{{ item.name }}</span> </div> - <div class="btns"> + <div class="sound-btns"> <span @click="togglePlay(item, i)"> <span class="iconfont" @@ -216,13 +216,13 @@ > <div class="color-option" v-if="universalColor != index" - :style="{cursor: pointer,backgroundColor:item.color}" + :style="{cursor: 'pointer',backgroundColor:item.color}" @click="colorCard(item.color,index)" /> <div class="color-option color-option-active" v-else - :style="{cursor: pointer,border:`2px solid ${item.color}`}" + :style="{cursor: 'pointer',border:`2px solid ${item.color}`}" @click="colorCard(item.color,index)"> <div :style="{backgroundColor:item.color}" @@ -556,6 +556,7 @@ this.universalColor = index document.documentElement.style.setProperty('--colorCard',`${color}`) localStorage.setItem('--colorCard',`${color}`) + window.parent.postMessage({msg:'changeColor',color},'*') } }, }; @@ -573,13 +574,16 @@ flex: 1; flex-basis: auto; box-sizing: border-box; + .el-input__inner { + height: 24px !important; +} .general-center { height: 100%; width: 300px; overflow: auto; box-sizing: border-box; flex-shrink: 0; - padding: 24px 10px; + padding: 10px 10px; border-right: 4px solid #f2f2f7; background-color: #fbfaff; @@ -659,35 +663,36 @@ text-align: left; margin-bottom: 5px; } - .voice-title { + .bar.title.voice-title { justify-content: center !important; + text-align: center; font-weight: 700; + border: none; } .bar-group { overflow: auto; - height: 400px; - } - .bar { - height: 48px; - background-color: #f8f8f8; - border-radius: 10px; - line-height: 48px; - box-sizing: border-box; - padding: 0 20px 0 20px; - font-weight: 700; - display: flex; - justify-content: space-between; - margin-bottom: 2px; - border: 2px solid #fff; - .name { - font-size: 14px; - } - .btns { - width: 52px; + height: calc(100% - 100px); + .general-bar { + height: 48px; + background-color: #f8f8f8; + border-radius: 10px; + line-height: 48px; + box-sizing: border-box; + padding: 0 20px 0 20px; + font-weight: 700; display: flex; justify-content: space-between; - color: rgba(191, 191, 191, 1); - /* .el-icon-video-pause { + margin-bottom: 2px; + border: 2px solid #f8f8f8; + .name { + font-size: 14px; + } + .sound-btns { + width: 52px; + display: flex; + justify-content: space-between; + color: rgba(191, 191, 191, 1); + /* .el-icon-video-pause { cursor: pointer; font-size: 23px; vertical-align: middle; @@ -699,18 +704,20 @@ vertical-align: middle; color: #409eff; } */ - span { - color: #333; + span { + color: #333; + } + .del:hover { + color: #fc4958; + } } - .del:hover { - color: #fc4958; + .desc { + font-size: 14px; + color: rgba(134, 134, 134, 1); } - } - .desc { - font-size: 14px; - color: rgba(134, 134, 134, 1); } } + /* .bar:hover { border: 2px solid #4E94FF !important; } */ @@ -856,7 +863,7 @@ height: 30px; border-radius:50% ; background-color: #fff; - padding: 3px; + padding: 4px; .color-option-content { width: 100%; height: 100%; @@ -1144,9 +1151,7 @@ color: #4E94FF; } -.el-input__inner { - height: 24px !important; -} + /* .el-tooltip__popper { -- Gitblit v1.8.0