FullscreenDiv 컴포넌트 추가 및 TopBar 컴포넌트 리팩토링

This commit is contained in:
static
2025-01-25 23:39:19 +09:00
parent 7dba1cf4c6
commit 0998d0662e
19 changed files with 188 additions and 171 deletions

View File

@@ -1,7 +1,7 @@
<script lang="ts">
import FileSaver from "file-saver";
import { goto } from "$app/navigation";
import { Button, TextButton, BottomDiv } from "$lib/components/atoms";
import { Button, TextButton, BottomDiv, FullscreenDiv } from "$lib/components/atoms";
import { TitleDiv } from "$lib/components/divs";
import { clientKeyStore } from "$lib/stores";
import BeforeContinueBottomSheet from "./BeforeContinueBottomSheet.svelte";
@@ -89,21 +89,23 @@
<title>암호 키 생성하기</title>
</svelte:head>
<TitleDiv icon={IconKey}>
<div class="space-y-4 break-keep">
<p class="text-3xl font-bold">암호 키를 파일로 내보낼까요?</p>
<div class="space-y-2 text-lg text-gray-800">
<p>
모든 디바이스의 암호 키가 유실되면, 서버에 저장된 데이터를 영원히 복호화할 수 없게 돼요.
</p>
<p>만약의 상황을 위해 암호 키를 파일로 내보낼 수 있어요.</p>
<FullscreenDiv>
<TitleDiv icon={IconKey}>
<div class="space-y-4 break-keep">
<p class="text-3xl font-bold">암호 키를 파일로 내보낼까요?</p>
<div class="space-y-2 text-lg text-gray-800">
<p>
모든 디바이스의 암호 키가 유실되면, 서버에 저장된 데이터를 영원히 복호화할 수 없게 돼요.
</p>
<p>만약의 상황을 위해 암호 키를 파일로 내보낼 수 있어요.</p>
</div>
</div>
</div>
</TitleDiv>
<BottomDiv class="flex flex-col items-center gap-y-2">
<Button onclick={exportClientKeys} class="w-full">암호 키 내보내기</Button>
<TextButton onclick={() => (isBeforeContinueModalOpen = true)}>내보내지 않을래요</TextButton>
</BottomDiv>
</TitleDiv>
<BottomDiv class="flex flex-col items-center gap-y-2">
<Button onclick={exportClientKeys} class="w-full">암호 키 내보내기</Button>
<TextButton onclick={() => (isBeforeContinueModalOpen = true)}>내보내지 않을래요</TextButton>
</BottomDiv>
</FullscreenDiv>
<BeforeContinueModal bind:isOpen={isBeforeContinueModalOpen} onContinueClick={registerPubKeys} />
<BeforeContinueBottomSheet