From b9aa1e3bc9b70df68967b3a37ece51ae1729f5b2 Mon Sep 17 00:00:00 2001 From: chenyabin <Chenab123!> Date: 星期三, 07 四月 2021 11:39:14 +0800 Subject: [PATCH] 统一样式-图层组件样式修改 --- src/components/panel/ToolBoxPanel.vue | 114 +++++++++++++++++++++++++++++--------------------------- 1 files changed, 59 insertions(+), 55 deletions(-) diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index 3808d49..6c0ed6f 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -1,10 +1,11 @@ <template> <div class="left-top-toolbox-panel"> <div class="specific-tools"> - <el-button :class="selectGroup === true ?'active-button':''" class="el-button-choice" @mouseover.enter.native="changeSelectMouse"> + <el-button :class="selectGroup === true ?'active-button':''" class="el-button-choice" @click.enter.native="changeSelectMouse"> <img src="@assets/images/map-pages/icon/toolbox/Selecd/tool.png" alt="" class="icon" /> <span class="span-default">宸ュ叿</span> </el-button> + <transition name="animationChange"> <el-row v-show="selectGroup" class="specific-tools-group"> <el-popover @@ -427,16 +428,15 @@ .specific-tools { display: flex; - - .el-button { + overflow: hidden; + .el-button { z-index: 999; padding: 0; margin: 0 0.015rem; - width: 45px; - height: 45px; + width: 0.2725rem; + height: 0.2725rem; background: @background-color; vertical-align: middle !important; - .base-map-img { position: absolute; } @@ -455,6 +455,10 @@ span { display: block; font-size: 10px; + } + } + .specific-tools-group .el-button{ + span{ color: #0B89B5; } } @@ -465,8 +469,8 @@ padding: 0; margin: 0; margin-right:0.015rem; - width: 45px; - height: 45px; + width: 0.2725rem; + height: 0.2725rem; background: @background-color; border: 0.00521rem solid @color-shadow; } @@ -478,51 +482,6 @@ .specific-tools-group { z-index: 1; - - .base-map-inner-panel { - display: flex; - justify-content: center; - align-items: center; - - .base-map-img { - position: absolute; - } - - .base-map-img-Tool:hover { - cursor: pointer; - } - - .base-map-anno-Tool { - position: absolute; - margin-left: 2px; - background-color: rgba(0, 0, 0, .5); - color: @color-over; - - .el-checkbox__label { - padding-left: 5px !important; - } - } - - .basemap-layer-item { - display: flex; - width: 50px; - height: 50px; - margin: 10px; - border: 2px solid white; - - input { - position: relative; - left: 0; - top: -53px; - } - - .basemap-layer-item-name { - position: relative; - left: 0; - top: -53px; - } - } - } .tools-panel-choose { border: none; @@ -545,11 +504,56 @@ } .special-button { - width: 22px; - height: 45px; + width: 0.1362rem; + height: 0.2725rem; color: @color-over; } } } } +.base-map-inner-panel { + display: flex; + justify-content: center; + align-items: center; + + .base-map-img { + position: absolute; + } + + .base-map-img-Tool:hover { + cursor: pointer; + } + + .base-map-anno-Tool { + position: absolute; + margin-left: 2px; + background-color: rgba(0, 0, 0, .5); + color: @color-over; + + .el-checkbox__label { + padding-left: 5px !important; + } + } + + .basemap-layer-item { + display: flex; + width: 50px; + height: 50px; + margin: 10px; + border: 2px solid white; + + input { + position: relative; + left: 0; + top: -53px; + } + + .basemap-layer-item-name { + position: relative; + left: 0; + top: -53px; + } + } +} + </style> -- Gitblit v1.8.0