mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-08-10 16:13:28 +08:00
fix(glass): 捷径卡片补齐玻璃描边与高光
弹层内嵌套卡片被通用折叠规则抹平 border 与 box-shadow,只补回背景会显得与其它玻璃卡片不一致,这里补齐完整表面并加上 hover 态。同时带上搜索弹窗的空状态间距与样式顺序整理。
This commit is contained in:
@@ -209,7 +209,7 @@ function loadRecentSearches() {
|
||||
|
||||
/** 获取可参与全局搜索的导航菜单和设置入口。 */
|
||||
function getMenus(): NavMenu[] {
|
||||
let menus: NavMenu[] = []
|
||||
const menus: NavMenu[] = []
|
||||
// 导航菜单
|
||||
getNavMenus(t).forEach(
|
||||
item =>
|
||||
@@ -829,7 +829,7 @@ onMounted(() => {
|
||||
</div>
|
||||
|
||||
<!-- 空状态提示 -->
|
||||
<div v-else class="empty-hint">
|
||||
<div v-else class="empty-hint pt-3">
|
||||
<span class="text-body-1 text-medium-emphasis">{{ t('dialog.searchBar.emptySearchHint') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -967,8 +967,8 @@ html[data-theme='transparent'] .search-desktop-activator .search-input-wrapper,
|
||||
.search-content {
|
||||
max-block-size: 600px;
|
||||
min-block-size: 150px;
|
||||
overscroll-behavior-y: contain;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior-y: contain;
|
||||
}
|
||||
|
||||
.search-dialog--dropdown .search-content {
|
||||
@@ -981,12 +981,12 @@ html[data-theme='transparent'] .search-desktop-activator .search-input-wrapper,
|
||||
|
||||
.search-item-source-row {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
align-items: center;
|
||||
block-size: 0;
|
||||
inline-size: 100%;
|
||||
margin-block-start: 0;
|
||||
min-inline-size: 0;
|
||||
overflow: hidden;
|
||||
transition:
|
||||
block-size 0.15s ease,
|
||||
margin-block-start 0.15s ease;
|
||||
@@ -999,6 +999,7 @@ html[data-theme='transparent'] .search-desktop-activator .search-input-wrapper,
|
||||
}
|
||||
|
||||
.search-item-source-toggle {
|
||||
overflow: auto hidden;
|
||||
border: var(--app-grouped-list-border);
|
||||
border-radius: var(--app-control-radius);
|
||||
backdrop-filter: var(--app-grouped-list-backdrop-filter);
|
||||
@@ -1006,8 +1007,6 @@ html[data-theme='transparent'] .search-desktop-activator .search-input-wrapper,
|
||||
block-size: 28px;
|
||||
max-inline-size: 100%;
|
||||
opacity: 0;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
pointer-events: none;
|
||||
transform: scale(0.98);
|
||||
transform-origin: center left;
|
||||
|
||||
@@ -835,12 +835,21 @@ html[data-theme='glass'] {
|
||||
);
|
||||
}
|
||||
|
||||
// 捷径菜单的嵌套卡片会被通用弹层模糊覆盖,需要显式跟随玻璃材质。
|
||||
// 捷径菜单的嵌套卡片会被通用弹层折叠规则抹平描边与高光,需要完整补齐标准玻璃表面。
|
||||
.shortcut-card-hover-area > .v-card {
|
||||
border-color: var(--glass-border) !important;
|
||||
-webkit-backdrop-filter: var(--glass-surface-backdrop-filter) !important;
|
||||
backdrop-filter: var(--glass-surface-backdrop-filter) !important;
|
||||
background-color: var(--glass-surface) !important;
|
||||
background-image: var(--glass-sheen) !important;
|
||||
box-shadow: var(--glass-shadow) !important;
|
||||
}
|
||||
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.shortcut-card-hover-area:hover > .v-card {
|
||||
border-color: var(--glass-border-hover) !important;
|
||||
box-shadow: var(--glass-shadow-hover) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// “更多”应用列表的分组卡片存在局部固定模糊,需要在完整小屏区间跟随玻璃材质。
|
||||
|
||||
Reference in New Issue
Block a user