feat(widget): improve search history popup

This commit is contained in:
kate522 committed 2026-08-15 17:01:51 +08:00
1 parent 2992f7e22b
commit 389ab4f19a
3 files changed
+155 -71

No files matched your search

+34 -6
View File
@@ -410,8 +410,23 @@
/* Search keywords + history */
.aksrt-search-widget__keywords,
.aksrt-search-widget__history { margin-top: 10px; }
.aksrt-search-widget__keywords { margin-top: 10px; }
.aksrt-search-widget__field { position: relative; }
.aksrt-search-widget__history {
position: absolute;
z-index: 20;
top: calc(100% + 6px);
right: 0;
left: 0;
max-height: 240px;
overflow-y: auto;
padding: 10px;
border: 1px solid var(--border-color, rgba(0, 0, 0, .08));
border-radius: var(--main-radius, 8px);
background: var(--main-bg-color, #fff);
box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.aksrt-search-widget__history[hidden] { display: none; }
.aksrt-search-widget__kw-head {
display: flex;
align-items: center;
@@ -453,10 +468,8 @@
.aksrt-search-widget__kw-refresh:focus-visible { color: var(--color-primary, #3b82f6); opacity: 1; }
.aksrt-search-widget__kw-refresh.is-refreshing i { animation: aksrt-search-keyword-refresh .2s linear; }
@keyframes aksrt-search-keyword-refresh { to { transform: rotate(360deg); } }
.aksrt-search-widget__kw-list,
.aksrt-search-widget__history-list { display: flex; flex-wrap: wrap; gap: 6px; }
.aksrt-search-widget__kw,
.aksrt-search-widget__history-item {
.aksrt-search-widget__kw-list { display: flex; flex-wrap: wrap; gap: 6px; }
.aksrt-search-widget__kw {
display: inline-block;
padding: 3px 10px;
border-radius: 999px;
@@ -465,6 +478,21 @@
text-decoration: none;
font-size: 12px;
}
.aksrt-search-widget__history-list { display: grid; gap: 2px; }
.aksrt-search-widget__history-item {
display: block;
padding: 7px 8px;
border-radius: 6px;
color: inherit;
font-size: 13px;
line-height: 1.35;
text-decoration: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.aksrt-search-widget__history-item:hover,
.aksrt-search-widget__history-item:focus-visible { background: var(--surface-2, #f3f4f6); color: var(--color-primary, #3b82f6); }
.aksrt-search-widget__history-empty {
font-size: 12px;
color: var(--muted-2-color, #999);