diff --git a/xian_favor/api.py b/xian_favor/api.py index 6752a3e..23861b3 100644 --- a/xian_favor/api.py +++ b/xian_favor/api.py @@ -873,6 +873,8 @@ INDEX_TEMPLATE = ''' margin-left: 200px; padding: 20px; padding-top: 0; /* 顶部按钮栏有 sticky,这里去掉顶部 padding */ + width: -webkit-fill-available; + width: fill-available; } /* 顶部操作栏固定在主内容区顶部 */ @@ -1036,22 +1038,36 @@ INDEX_TEMPLATE = ''' /* 卡片内容自适应布局 */ .item-card .card-content { display: flex; - flex-wrap: wrap; + align-items: flex-start; gap: 8px; } .item-card .card-main { flex: 1; - min-width: 150px; + min-width: 0; } .item-card .card-actions { display: flex; align-items: center; gap: 2px; - flex-wrap: wrap; + flex-shrink: 0; } .item-card .card-actions .btn { white-space: nowrap; } + /* 单行显示模式 */ + .item-card.compact .card-content { + align-items: center; + } + .item-card.compact .card-main h6 { + margin-bottom: 0; + } + .item-card.compact .card-main p { + display: none; + } + /* 双行显示模式(默认) */ + .item-card.double-line .card-main p { + display: block; + } .type-text { border-left: 4px solid #17a2b8; } .type-link { border-left: 4px solid #28a745; } .type-column { border-left: 4px solid #6f42c1; } @@ -1202,6 +1218,9 @@ INDEX_TEMPLATE = ''' + @@ -1926,6 +1945,9 @@ document.addEventListener('DOMContentLoaded', async () => { // 启动连接状态检测 startConnectionCheck(); + // 初始化显示模式 + updateDisplayMode(); + // 确保初始状态清空 document.getElementById('searchInput').value = ''; document.getElementById('typeFilter').value = ''; @@ -2023,8 +2045,10 @@ function renderItems(items) { return; } + const modeClass = displayMode === 'single' ? 'compact' : 'double-line'; + container.innerHTML = items.map(item => ` -