diff --git a/static/css/style.css b/static/css/style.css index 8a9c4ff..d6ff621 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -988,23 +988,46 @@ ul { } .floating-result-btn { - bottom: 90px; + bottom: 100px; left: 50%; right: auto; transform: translateX(-50%); - padding: 12px 20px; - font-size: 0.95rem; - box-shadow: 0 6px 24px rgba(245, 158, 11, 0.6); + padding: 12px 16px; + border-radius: 50px; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 20px rgba(245, 158, 11, 0.3); + backdrop-filter: blur(8px); + background: linear-gradient(135deg, rgba(245, 158, 11, 0.95) 0%, rgba(217, 119, 6, 0.95) 100%); + animation: floatPulse 2s ease-in-out infinite; + gap: 8px; } .floating-result-btn::before { - content: '📋 查看结果'; - font-size: 0.95rem; + content: '📋'; + font-size: 1.2rem; + } + + .floating-result-btn::after { + content: none; } .floating-result-btn .result-badge { - padding: 4px 10px; - font-size: 0.85rem; + padding: 4px 12px; + font-size: 0.9rem; + font-weight: 700; + border-radius: 14px; + background: rgba(15, 15, 26, 0.95); + min-width: 24px; + } + + @keyframes floatPulse { + 0%, 100% { + transform: translateX(-50%) translateY(0); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 20px rgba(245, 158, 11, 0.3); + } + 50% { + transform: translateX(-50%) translateY(-4px); + box-shadow: 0 8px 28px rgba(0, 0, 0, 0.3), 0 0 30px rgba(245, 158, 11, 0.5); + } } } @@ -1393,15 +1416,15 @@ ul { /* 侧边栏改为底部弹出面板 */ .sidebar { position: fixed; - bottom: 0; + bottom: 70px; /* 显示在底部操作栏上方 */ left: 0; right: 0; top: auto; width: 100%; min-width: 100%; - max-height: 70vh; + max-height: 60vh; z-index: 100; - transform: translateY(100%); + transform: translateY(calc(100% + 70px)); transition: transform var(--transition-normal); border-radius: var(--radius-xl) var(--radius-xl) 0 0; overflow: hidden; @@ -1413,6 +1436,7 @@ ul { .sidebar-overlay { display: block; + bottom: 70px; /* 不覆盖底部操作栏 */ } /* 地图全屏 */ diff --git a/static/js/app.js b/static/js/app.js index 885c5a7..c9a4d42 100644 --- a/static/js/app.js +++ b/static/js/app.js @@ -876,6 +876,11 @@ function renderResultList(pois) { panel.style.display = 'flex'; filterInput.value = ''; + // 隐藏浮动结果按钮(因为结果面板已显示) + if (window.hideFloatingResultBtn) { + window.hideFloatingResultBtn(); + } + // 移动端隐藏操作栏 if (window.toggleMobileActionBar) { window.toggleMobileActionBar(false); diff --git a/templates/index.html b/templates/index.html index c585e11..eeb0919 100644 --- a/templates/index.html +++ b/templates/index.html @@ -7,7 +7,7 @@ 会面点 - 寻找最佳聚会地点 - + @@ -179,6 +179,6 @@ - +