-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
49 lines (48 loc) · 3.48 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Starter</title>
</head>
<body id="body" >
<div id="app" class="w-screen h-screen flex justify-center items-center dark:bg-black bg-white bg-opacity-90 backdrop-blur-sm relative">
<div class="dark:bg-[#4A525A] bg-gray-300 rounded-xl shadow-2xl flex items-center justify-center relative">
<div class="flex flex-col">
<div class="p-5">
<button id="icon" class="mr-3 text-white text-2xl"></button>
<input type="password" id="password" placeholder="Password" class="py-1 px-4 h-10 rounded-lg">
<button id="lock-button" class="dark:bg-[#0a3870ee] bg-blue-400 text-gray-50 px-4 h-10 ml-3 rounded-lg font-bold">Lock</button>
</div>
<div id="unlock-region" class="hidden flex flex-row justify-center ">
<div class="text-gray-400 text-sm mb-2 inline-block">
<div id="copy-secret" title="Copy" class="cursor-pointer"><svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline-block" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
</svg> Copy your secret</div>
<div id="replace-secret" title="Replace" class="cursor-pointer"><svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline-block" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<rect x="3" y="3" width="6" height="6" rx="1" />
<rect x="15" y="15" width="6" height="6" rx="1" />
<path d="M21 11v-3a2 2 0 0 0 -2 -2h-6l3 3m0 -6l-3 3" />
<path d="M3 13v3a2 2 0 0 0 2 2h6l-3 -3m0 6l3 -3" />
</svg> Replace into original block</div>
<div id="insert-secret" title="Insert" class="cursor-pointer"><svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 inline-block" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<path d="M20 6v4a1 1 0 0 1 -1 1h-14a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1h14a1 1 0 0 1 1 1z" />
<line x1="12" y1="15" x2="12" y2="19" />
<line x1="14" y1="17" x2="10" y2="17" />
</svg> Insert under original block</div>
</div>
</div>
</div>
<div title="Close" class="absolute -right-2 -top-2 cursor-pointer dark:text-white text-gray-600"><svg id="close-button" xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 " viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" />
</svg></div>
</div>
<div class="mx-auto w-2/3 absolute bottom-10 text-gray-500">CAUTION: Please remember your password. If you forgot your password, you will lose your info forever!!!</div>
</div>
</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>