fix: pin home capsule flow and switch explore panel to white left dock

This commit is contained in:
Ruslan Bakiev
2026-03-12 15:42:56 +07:00
parent 530c97b912
commit c940369c81
8 changed files with 113 additions and 97 deletions

View File

@@ -45,7 +45,8 @@
<!-- Filter by bounds checkbox (LEFT, next to panel when open) - only in selection mode -->
<label
v-if="selectMode !== null"
class="absolute top-[116px] left-[calc(1rem+32rem+1rem)] z-20 hidden lg:flex items-center gap-2 map-chip rounded-full px-3 py-1.5 cursor-pointer text-base-content text-sm hover:bg-base-200 transition-colors"
class="absolute top-[116px] z-20 hidden lg:flex items-center gap-2 map-chip rounded-full px-3 py-1.5 cursor-pointer text-base-content text-sm hover:bg-base-200 transition-colors"
:style="boundsFilterStyle"
>
<input
type="checkbox"
@@ -101,10 +102,10 @@
<Transition name="slide-left">
<div
v-if="isPanelOpen"
class="absolute top-[116px] left-4 bottom-4 z-30 max-w-[calc(100vw-2rem)] hidden lg:block"
class="absolute top-[116px] left-0 bottom-0 z-30 max-w-[calc(100vw-1rem)] hidden lg:block"
:class="panelWidth"
>
<div class="bg-neutral text-neutral-content border border-neutral/70 rounded-[1.1rem] shadow-2xl h-full flex flex-col">
<div class="bg-base-100 text-base-content border border-base-300 border-l-0 rounded-none rounded-tr-[1.1rem] rounded-bl-[1.1rem] shadow-2xl h-full flex flex-col">
<slot name="panel" />
</div>
</div>
@@ -162,7 +163,7 @@
<Transition name="slide-up">
<div
v-if="isPanelOpen"
class="bg-neutral text-neutral-content rounded-t-3xl border-t border-neutral/70 shadow-[0_-8px_40px_rgba(0,0,0,0.35)] transition-all duration-300 h-[60vh]"
class="bg-base-100 text-base-content rounded-t-3xl border-t border-base-300 shadow-[0_-8px_40px_rgba(0,0,0,0.12)] transition-all duration-300 h-[60vh]"
>
<!-- Drag handle / close -->
<div
@@ -212,11 +213,16 @@ const panelWidthPx = computed(() => {
const fitPaddingLeft = computed(() => {
if (!isPanelOpen.value || !isDesktop.value || panelWidthPx.value === 0) return 0
const leftInset = 16
const leftInset = 0
const rightInset = 16
return leftInset + panelWidthPx.value + rightInset
})
const boundsFilterStyle = computed(() => {
if (!isDesktop.value || panelWidthPx.value === 0) return { left: '1rem' }
return { left: `${panelWidthPx.value + 16}px` }
})
// Open panel based on current mapViewMode
const openPanel = () => {
const newSelectMode = mapViewMode.value === 'hubs' ? 'hub'