diff --git a/src/styles/global-popper.scss b/src/styles/global-popper.scss new file mode 100644 index 0000000..b999d38 --- /dev/null +++ b/src/styles/global-popper.scss @@ -0,0 +1,60 @@ +/* === 全局弹层圆角 (按 ui-preview-v2.html 模板: --radius 8px) === + EP 弹层 (select-dropdown / popper / dropdown / menu) 通过 teleport 到 body, + 不在组件 scope 内, 必须全局生效 */ +.el-select-dropdown, +.el-select__popper, +.el-dropdown-menu, +.el-dropdown__popper, +.el-menu--popup, +.el-popper.is-light, +.el-picker__popper, +.el-autocomplete__popper, +.el-autocomplete-suggestion, +.el-popper { + border-radius: var(--radius, 8px) !important; + overflow: hidden; +} + +/* dropdown 项 hover/选中态 */ +.el-select-dropdown__item, +.el-dropdown-menu__item { + border-radius: var(--radius-sm, 6px) !important; + margin: 2px 4px; + padding: 0 12px; + height: 34px; + line-height: 34px; + font-size: 13px; +} +.el-select-dropdown__item.is-hovering, +.el-dropdown-menu__item:not(.is-disabled):hover { + background: var(--brand-soft, rgba(37, 99, 235, 0.08)) !important; + color: var(--brand, #2563EB) !important; +} +.el-select-dropdown__item.is-selected { + font-weight: 600; + color: var(--brand, #2563EB) !important; +} + + +/* 弹层背景跟主题 (避免 dark 下弹层仍是浅色 + 文字看不清) */ +.el-select-dropdown, +.el-dropdown-menu, +.el-popper.is-light { + background: var(--surface, #FFFFFF) !important; + border: 1px solid var(--border, #E2E8F0) !important; +} +.el-select-dropdown__item, +.el-dropdown-menu__item { + color: var(--ink-2, #334155); + background: transparent; +} +.el-select-dropdown__item.is-hovering, +.el-dropdown-menu__item:not(.is-disabled):hover { + background: var(--brand-soft) !important; + color: var(--brand) !important; +} +.el-select-dropdown__item.is-selected { + color: var(--brand) !important; + font-weight: 600; + background: transparent !important; +}