fix(app): entry stage를 위로 재배치

This commit is contained in:
2026-03-16 14:47:54 +09:00
parent c63ddc4e98
commit fb2729193f
2 changed files with 13 additions and 13 deletions

View File

@@ -53,17 +53,17 @@ export const AppAtmosphereEntryShell = ({
onStartSession, onStartSession,
}: AppAtmosphereEntryShellProps) => { }: AppAtmosphereEntryShellProps) => {
return ( return (
<div className="flex h-full flex-col justify-between pt-8 md:pt-16"> <div className="flex flex-1 flex-col justify-between">
{/* Main Focus Entry Ritual */} {/* Main Focus Entry Ritual */}
<div className="flex flex-1 flex-col items-center justify-center px-4 pb-10"> <div className="flex flex-1 flex-col items-center justify-start px-4 pb-14 pt-4 md:pt-10">
{/* Inline Accessories (No overlap guarantee) */} {/* Inline Accessories (No overlap guarantee) */}
<div className="mb-12 flex min-h-[5rem] flex-col items-center justify-end opacity-0 animate-fade-in-up delay-150"> <div className="mb-10 flex min-h-[4rem] flex-col items-center justify-end opacity-0 animate-fade-in-up delay-150 md:mb-11">
{errorAccessory} {errorAccessory}
{!errorAccessory && topAccessory} {!errorAccessory && topAccessory}
</div> </div>
<div className="w-full max-w-4xl text-center opacity-0 animate-fade-in-up delay-150 mb-16"> <div className="mb-14 w-full max-w-4xl text-center opacity-0 animate-fade-in-up delay-150 md:mb-16">
<p className="text-xs font-bold uppercase tracking-[0.3em] text-white/40 drop-shadow-sm mb-6"> <p className="mb-5 text-xs font-bold uppercase tracking-[0.3em] text-white/40 drop-shadow-sm md:mb-6">
What will you focus on? What will you focus on?
</p> </p>
<input <input
@@ -82,7 +82,7 @@ export const AppAtmosphereEntryShell = ({
/> />
</div> </div>
<div className="flex w-full flex-col items-center space-y-10 opacity-0 animate-fade-in-up delay-150"> <div className="flex w-full flex-col items-center space-y-9 opacity-0 animate-fade-in-up delay-150 md:space-y-10">
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
{/* Primary Action: Massive Custom Timer Input */} {/* Primary Action: Massive Custom Timer Input */}

View File

@@ -307,18 +307,18 @@ export const FocusDashboardWidget = () => {
!isCheckingSession && !currentSession && hasEnoughWeeklyData && !isReviewReturn; !isCheckingSession && !currentSession && hasEnoughWeeklyData && !isReviewReturn;
return ( return (
<div className="relative min-h-dvh overflow-hidden bg-black text-white selection:bg-white/20"> <div className="relative min-h-dvh bg-black text-white selection:bg-white/20">
{/* Background Media */} {/* Background Media */}
<div <div
className={cn( className={cn(
'absolute inset-0 bg-cover bg-center transition-transform duration-[1.5s] ease-[cubic-bezier(0.22,1,0.36,1)]', 'fixed inset-0 bg-cover bg-center transition-transform duration-[1.5s] ease-[cubic-bezier(0.22,1,0.36,1)]',
isStartingSession ? 'scale-[1.08] blur-[2px] brightness-75' : 'scale-100 blur-[60px] brightness-50', isStartingSession ? 'scale-[1.08] blur-[2px] brightness-75' : 'scale-100 blur-[60px] brightness-50',
)} )}
style={getSceneStageBackgroundStyle(activeScene, sceneAssetMap?.[activeScene.id])} style={getSceneStageBackgroundStyle(activeScene, sceneAssetMap?.[activeScene.id])}
/> />
{/* Immersive Overlay Gradients */} {/* Immersive Overlay Gradients */}
<div className="absolute inset-0 bg-[radial-gradient(circle_at_center,transparent_0%,rgba(0,0,0,0.85)_100%)] mix-blend-multiply pointer-events-none" /> <div className="fixed inset-0 bg-[radial-gradient(circle_at_center,transparent_0%,rgba(0,0,0,0.85)_100%)] mix-blend-multiply pointer-events-none" />
<div className="absolute inset-0 bg-black/40 pointer-events-none" /> <div className="fixed inset-0 bg-black/40 pointer-events-none" />
{/* Header */} {/* Header */}
<header className="absolute top-0 inset-x-0 z-50 flex items-center justify-between px-8 py-8 md:px-12 md:py-10"> <header className="absolute top-0 inset-x-0 z-50 flex items-center justify-between px-8 py-8 md:px-12 md:py-10">
@@ -345,13 +345,13 @@ export const FocusDashboardWidget = () => {
</header> </header>
{/* Main Content Area */} {/* Main Content Area */}
<main className="relative z-10 flex h-[100dvh] flex-col"> <main className="relative z-10 flex min-h-[100dvh] flex-col pb-8 pt-20 md:pt-24">
{isCheckingSession ? ( {isCheckingSession ? (
<div className="flex h-full items-center justify-center"> <div className="flex flex-1 items-center justify-center">
<p className="text-[15px] font-medium text-white/70 animate-pulse">Loading session...</p> <p className="text-[15px] font-medium text-white/70 animate-pulse">Loading session...</p>
</div> </div>
) : ( ) : (
<div className="flex-1 flex flex-col h-full w-full"> <div className="flex-1 flex flex-col w-full relative">
<AppAtmosphereEntryShell <AppAtmosphereEntryShell
canStart={canStart} canStart={canStart}
durationDraft={durationDraft} durationDraft={durationDraft}