Fix glass theme shadows and slider overflow

This commit is contained in:
jxxghp
2026-07-22 20:25:12 +08:00
parent 19e93edca0
commit ca955b48e2
5 changed files with 46 additions and 11 deletions
+11 -1
View File
@@ -835,6 +835,8 @@ onMounted(() => {
--permission-editor-hover-bg: rgba(var(--v-theme-primary), 0.04);
--permission-editor-active-bg: rgba(var(--v-theme-primary), 0.1);
--permission-editor-selected-bg: rgba(var(--v-theme-primary), 0.08);
--permission-editor-backdrop-filter: none;
--permission-editor-shadow: none;
display: flex;
flex-direction: column;
@@ -854,6 +856,14 @@ onMounted(() => {
gap: 0.75rem;
}
.permission-category-option,
.permission-feature-item,
.permission-feature-panel {
-webkit-backdrop-filter: var(--permission-editor-backdrop-filter);
backdrop-filter: var(--permission-editor-backdrop-filter);
box-shadow: var(--permission-editor-shadow);
}
.permission-category-option,
.permission-feature-item {
border: var(--permission-editor-muted-border);
@@ -973,7 +983,7 @@ onMounted(() => {
overflow: hidden;
border: var(--permission-editor-border);
border-radius: var(--permission-editor-radius);
background: rgb(var(--v-theme-surface));
background: var(--permission-editor-panel-bg);
}
.permission-feature-panel__header {
+3 -1
View File
@@ -300,6 +300,7 @@ watch(
</template>
<style lang="scss" scoped>
/* stylelint-disable selector-pseudo-class-no-unknown */
.slider-container {
position: relative;
isolation: isolate;
@@ -307,6 +308,7 @@ watch(
--slider-shadow-bleed-start: 28px;
--slider-shadow-bleed-end: 56px;
--slider-shadow-bleed-inline: 12px;
}
.slider-header {
@@ -337,7 +339,7 @@ watch(
font-size: 0.85rem;
font-weight: 500;
padding-block: 5px;
padding-inline: 12px;
padding-inline: var(--slider-shadow-bleed-inline);
text-decoration: none;
transition: all 0.25s ease;