zenn/planner.sori.studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.1.44 - 로그인 화면 모바일 정리

Browse Source
This commit is contained in:
zenn
2026-04-23 13:39:16 +09:00
parent 44932f9724
commit 1f2d9ddc54
3 changed files with 35 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/App.vue
View File

@@ -2011,51 +2011,45 @@ onBeforeUnmount(() => {
<div class="min-w-0 space-y-6" :class="isAuthenticated ? 'xl:h-full xl:overflow-hidden' : 'w-full'">
<section
v-if="!isAuthenticated"
class="scrollbar-hide print-hidden mx-auto w-full max-w-4xl rounded-[28px] border border-white/60 bg-white/65 p-6 shadow-[0_24px_80px_rgba(28,25,23,0.08)] sm:p-8"
class="scrollbar-hide print-hidden mx-auto w-full max-w-3xl rounded-[30px] border border-white/70 bg-white/72 px-5 py-7 shadow-[0_24px_80px_rgba(28,25,23,0.08)] sm:px-8 sm:py-9"
>
<div class="mx-auto flex max-w-3xl flex-col gap-6 text-center">
<div class="space-y-3">
<div class="mx-auto flex max-w-2xl flex-col gap-6 text-center">
<div>
<p class="text-[11px] font-bold uppercase tracking-[0.28em] text-stone-500">회원 전용 플래너</p>
<h2 class="text-3xl font-semibold tracking-[-0.05em] text-stone-900 sm:text-4xl">
<h2 class="mt-3 text-3xl font-semibold tracking-[-0.05em] text-stone-900 sm:text-4xl">
10 Minute Planner
</h2>
<p class="mx-auto max-w-2xl text-sm leading-7 text-stone-600 sm:text-base">
로그인 후 나만의 10분 플래너를 작성하고,<br>날짜별 기록과 통계를 안전하게 이어가세요.
<p class="mx-auto mt-3 max-w-xl text-sm leading-7 text-stone-600 sm:text-base">
로그인하면 날짜별 플래너, 통계, 목표를 내 계정 기준으로 이어서 사용할 수 있습니다.
</p>
</div>
<div class="grid gap-4 rounded-[28px] border border-stone-200 bg-[#fbf7f0] p-5 text-left">
<article class="rounded-2xl border border-stone-200 bg-white px-4 py-5">
<p class="text-[10px] font-bold tracking-[0.18em] text-stone-500">ACCOUNT</p>
<p class="mt-3 text-sm font-semibold leading-6 text-stone-800">
회원가입 후 사용자별 플래너와 통계를 분리해서 관리합니다.
</p>
</article>
<article class="rounded-2xl border border-stone-200 bg-white px-4 py-5">
<p class="text-[10px] font-bold tracking-[0.18em] text-stone-500">CLOUD SAVE</p>
<p class="mt-3 text-sm font-semibold leading-6 text-stone-800">
작성 내용은 날짜별로 서버에 저장되고, 다른 기기에서도 이어볼 수 있습니다.
</p>
</article>
<article class="rounded-2xl border border-stone-200 bg-white px-4 py-5">
<p class="text-[10px] font-bold tracking-[0.18em] text-stone-500">PRINT & STATS</p>
<p class="mt-3 text-sm font-semibold leading-6 text-stone-800">
로그인 기반 데이터로 통계와 출력 흐름을 안정적으로 맞춰갑니다.
</p>
</article>
<div class="mx-auto grid w-full max-w-xl gap-0 border-y border-stone-200 text-left">
<p class="flex items-center justify-between gap-4 border-b border-stone-200 py-3 text-sm font-semibold text-stone-700">
<span>날짜별 기록 저장</span>
<span class="text-[10px] font-bold tracking-[0.18em] text-stone-400">SAVE</span>
</p>
<p class="flex items-center justify-between gap-4 border-b border-stone-200 py-3 text-sm font-semibold text-stone-700">
<span>통계와 목표 관리</span>
<span class="text-[10px] font-bold tracking-[0.18em] text-stone-400">STATS</span>
</p>
<p class="flex items-center justify-between gap-4 py-3 text-sm font-semibold text-stone-700">
<span>출력용 다이어리 유지</span>
<span class="text-[10px] font-bold tracking-[0.18em] text-stone-400">PRINT</span>
</p>
</div>
<div class="flex flex-col items-center justify-center gap-3 sm:flex-row">
<div class="grid w-full gap-3 sm:mx-auto sm:max-w-md sm:grid-cols-2">
<button
type="button"
class="rounded-full border border-stone-300 bg-white px-6 py-3 text-xs font-bold tracking-[0.18em] text-stone-700 transition hover:border-stone-500 hover:text-stone-900"
class="h-12 w-full rounded-full border border-stone-300 bg-white px-6 text-xs font-bold tracking-[0.18em] text-stone-700 transition hover:border-stone-500 hover:text-stone-900"
@click="openAuthDialog('login')"
>
LOGIN
</button>
<button
type="button"
class="rounded-full bg-stone-900 px-6 py-3 text-xs font-bold tracking-[0.18em] text-white transition hover:bg-stone-700"
class="h-12 w-full rounded-full border border-stone-900 bg-stone-900 px-6 text-xs font-bold tracking-[0.18em] text-white transition hover:bg-stone-700"
@click="openAuthDialog('signup')"
>
SIGN UP