fix(app): entry stage를 위로 재배치
This commit is contained in:
@@ -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 */}
|
||||||
|
|||||||
@@ -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}
|
||||||
|
|||||||
Reference in New Issue
Block a user