diff --git a/web/src/components/EmailCardStack.vue b/web/src/components/EmailCardStack.vue index 185b8cd..d20bef5 100644 --- a/web/src/components/EmailCardStack.vue +++ b/web/src/components/EmailCardStack.vue @@ -201,7 +201,7 @@ const cardStyle = computed(() => { 'transparent' return { - transform: `translate(${deltaX.value}px, ${deltaY.value}px) scale(0.35)`, + transform: `translate(${deltaX.value}px, ${deltaY.value - 80}px) scale(0.55)`, borderRadius: '50%', background: aura, transition: 'border-radius 150ms ease, background 150ms ease', diff --git a/web/src/views/LabelView.vue b/web/src/views/LabelView.vue index a84824e..a52f863 100644 --- a/web/src/views/LabelView.vue +++ b/web/src/views/LabelView.vue @@ -314,7 +314,8 @@ onUnmounted(() => { padding: 1rem; max-width: 640px; margin: 0 auto; - min-height: 100dvh; + height: 100dvh; /* hard cap — prevents grid from drifting below fold */ + overflow: hidden; } .queue-status { @@ -418,7 +419,8 @@ onUnmounted(() => { .card-stack-wrapper { flex: 1; - /* Give bottom breathing room so grid doesn't overlap content */ + min-height: 0; /* allow flex child to shrink — default auto prevents this */ + overflow-y: auto; padding-bottom: 0.5rem; } @@ -426,8 +428,6 @@ onUnmounted(() => { can be scrolled freely. "hired" (10th button) may clip on very small screens — that is intentional per design. */ .bucket-grid-footer { - position: sticky; - bottom: 0; background: var(--color-bg, var(--color-surface, #f0f4fc)); padding: 0.5rem 0 0.75rem; z-index: 10;