Commit f7a4bce8b141f75c3c677367624c6b5c8017f8b5
1 parent
025aa0aa
perf(src/packages): 优化图层区域,文本列表展示样式问题
Showing
1 changed file
with
21 additions
and
2 deletions
| ... | ... | @@ -9,11 +9,11 @@ |
| 9 | 9 | :fallback-src="requireErrorImg()" |
| 10 | 10 | ></n-image> |
| 11 | 11 | <n-ellipsis style="margin-right: auto"> |
| 12 | - <span class="list-text"> | |
| 12 | + <span class="list-text" :class="{'list-text-mini': selectText }"> | |
| 13 | 13 | {{ t(props.componentData.chartConfig.title) }} |
| 14 | 14 | </span> |
| 15 | 15 | </n-ellipsis> |
| 16 | - <div class="list-layers"> | |
| 16 | + <div class="list-layers" :class="{'list-layers-mini': selectText }"> | |
| 17 | 17 | <layers-status :isGroup="isGroup" :hover="hover" :status="status"></layers-status> |
| 18 | 18 | </div> |
| 19 | 19 | </div> |
| ... | ... | @@ -157,12 +157,31 @@ $textSize: 10px; |
| 157 | 157 | text-overflow: ellipsis; |
| 158 | 158 | white-space: nowrap; |
| 159 | 159 | } |
| 160 | + .list-text-mini{ | |
| 161 | + position: absolute; | |
| 162 | + z-index: 99; | |
| 163 | + left: 70px; | |
| 164 | + top: 8px; | |
| 165 | + padding-left: 6px; | |
| 166 | + width: 60px; | |
| 167 | + font-size: $textSize; | |
| 168 | + overflow: hidden; | |
| 169 | + text-align: left; | |
| 170 | + text-overflow: ellipsis; | |
| 171 | + white-space: nowrap; | |
| 172 | + } | |
| 160 | 173 | |
| 161 | 174 | .list-layers { |
| 162 | 175 | position: absolute; |
| 163 | 176 | z-index: 99; |
| 164 | 177 | left: 140px; |
| 165 | 178 | top: 15px; |
| 179 | + } | |
| 180 | + .list-layers-mini { | |
| 181 | + position: absolute; | |
| 182 | + z-index: 99; | |
| 183 | + left: 140px; | |
| 184 | + top: 2px; | |
| 166 | 185 | } |
| 167 | 186 | |
| 168 | 187 | /* 选中样式 */ | ... | ... |