Merge pull request #11319 from dataease/pr@dev-v2_st

fix(数据大屏): 查询组件-icon选中后,hover样式不对
This commit is contained in:
dataeaseShu 2024-08-01 14:44:45 +08:00 committed by GitHub
commit 261a4f21f7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 6 deletions

View File

@ -527,12 +527,15 @@ if (!chart.value.customStyle.component.hasOwnProperty('labelShow')) {
&.dark {
color: #a6a6a6;
&:hover {
background-color: rgba(255, 255, 255, 0.1);
}
&.active {
color: var(--ed-color-primary);
background-color: var(--ed-color-primary-1a, rgba(51, 112, 255, 0.1));
}
&:hover {
background-color: rgba(255, 255, 255, 0.1);
&:hover {
background-color: #3370ff33;
}
}
}

View File

@ -40,7 +40,7 @@
>{{ t('visualization.apply_this_template') }}</el-button
>
<el-divider class="custom-divider-line" direction="vertical" />
<el-icon class="custom-market-icon hover-icon" @click="close"><Close /></el-icon>
<el-icon class="custom-market-icon hover-icon_custom" @click="close"><Close /></el-icon>
</el-row>
</el-row>
<el-row class="template-area">
@ -91,7 +91,7 @@
</el-select>
<template v-if="['branchCreate', 'create'].includes(state.curPosition)">
<el-divider class="custom-divider-line" direction="vertical" />
<el-icon class="custom-market-icon hover-icon" @click="close"><Close /></el-icon>
<el-icon class="custom-market-icon hover-icon_custom" @click="close"><Close /></el-icon>
</template>
</el-row>
</el-row>
@ -697,13 +697,32 @@ defineExpose({
.custom-divider-line {
height: 16px;
margin-top: 6px;
margin: 8px 14px 0 16px !important;
}
.custom-market-icon {
font-size: 20px;
margin-top: 4px;
height: 24px !important;
width: 24px !important;
cursor: pointer;
&.hover-icon_custom {
border-radius: 4px;
color: #646a73;
&[aria-expanded='true'] {
background: rgba(31, 35, 41, 0.1);
}
&:hover {
background: rgba(31, 35, 41, 0.1);
}
&:active {
background: rgba(31, 35, 41, 0.2);
}
}
}
.custom-back-icon {