-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
310 lines (282 loc) · 18.4 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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
<!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" />
<link rel="stylesheet" href="./css/reset.css" />
<link rel="stylesheet" href="./css/styles.css" />
<link rel="stylesheet" href="./css/fade-setting.css" />
<script src="./lib/leon.js"></script>
<title>Tab Manager - improve your browsing</title>
</head>
<body>
<nav id="navbar">
<div>
<a href="#home">
<svg
class="favicon"
width="171"
height="24"
viewBox="0 0 171 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.615 18V7.56H40.97V18H38.615ZM35.3 9.465V7.41H44.285V9.465H35.3ZM42.7514 18L46.9514 7.41H49.0814L53.2364 18H50.7464L47.5664 9.21H48.4214L45.1964 18H42.7514ZM45.1364 16.08V14.16H50.9114V16.08H45.1364ZM55.4069 18V16.17H57.8969C58.3569 16.17 58.7169 16.035 58.9769 15.765C59.2369 15.495 59.3669 15.165 59.3669 14.775C59.3669 14.505 59.3069 14.265 59.1869 14.055C59.0669 13.845 58.8969 13.68 58.6769 13.56C58.4669 13.44 58.2069 13.38 57.8969 13.38H55.4069V11.595H57.7019C58.0919 11.595 58.4069 11.5 58.6469 11.31C58.8869 11.11 59.0069 10.81 59.0069 10.41C59.0069 10.02 58.8869 9.73 58.6469 9.54C58.4069 9.34 58.0919 9.24 57.7019 9.24H55.4069V7.41H58.1519C58.8319 7.41 59.4069 7.535 59.8769 7.785C60.3569 8.035 60.7219 8.37 60.9719 8.79C61.2219 9.21 61.3469 9.675 61.3469 10.185C61.3469 10.835 61.1369 11.385 60.7169 11.835C60.2969 12.285 59.6769 12.595 58.8569 12.765L58.9169 11.97C59.8069 12.14 60.4919 12.485 60.9719 13.005C61.4619 13.525 61.7069 14.165 61.7069 14.925C61.7069 15.505 61.5619 16.03 61.2719 16.5C60.9919 16.96 60.5819 17.325 60.0419 17.595C59.5119 17.865 58.8719 18 58.1219 18H55.4069ZM53.6069 18V7.41H55.9319V18H53.6069ZM66.6792 18V7.41H68.3592L72.5292 13.905H71.6742L75.8292 7.41H77.5242V18H75.1692V11.385L75.5892 11.49L72.8742 15.72H71.3142L68.6142 11.49L69.0192 11.385V18H66.6792ZM78.0102 18L82.2102 7.41H84.3402L88.4952 18H86.0052L82.8252 9.21H83.6802L80.4552 18H78.0102ZM80.3952 16.08V14.16H86.1702V16.08H80.3952ZM88.8657 18V7.41H90.5157L91.2207 9.525V18H88.8657ZM96.1707 18L89.9307 10.005L90.5157 7.41L96.7557 15.405L96.1707 18ZM96.1707 18L95.5407 15.885V7.41H97.8957V18H96.1707ZM98.3949 18L102.595 7.41H104.725L108.88 18H106.39L103.21 9.21H104.065L100.84 18H98.3949ZM100.78 16.08V14.16H106.555V16.08H100.78ZM113.674 18.165C112.904 18.165 112.179 18.025 111.499 17.745C110.829 17.465 110.244 17.08 109.744 16.59C109.244 16.09 108.849 15.51 108.559 14.85C108.279 14.18 108.139 13.46 108.139 12.69C108.139 11.92 108.284 11.205 108.574 10.545C108.864 9.885 109.264 9.31 109.774 8.82C110.294 8.32 110.899 7.935 111.589 7.665C112.279 7.385 113.019 7.245 113.809 7.245C114.719 7.245 115.544 7.41 116.284 7.74C117.034 8.07 117.654 8.525 118.144 9.105L116.539 10.71C116.199 10.27 115.799 9.94 115.339 9.72C114.879 9.5 114.359 9.39 113.779 9.39C113.159 9.39 112.604 9.53 112.114 9.81C111.624 10.08 111.239 10.465 110.959 10.965C110.689 11.455 110.554 12.03 110.554 12.69C110.554 13.35 110.689 13.93 110.959 14.43C111.229 14.93 111.599 15.32 112.069 15.6C112.539 15.88 113.079 16.02 113.689 16.02C114.309 16.02 114.834 15.905 115.264 15.675C115.704 15.435 116.039 15.095 116.269 14.655C116.509 14.205 116.629 13.66 116.629 13.02L118.189 14.07L113.464 13.995V12H119.029V12.345C119.029 13.615 118.799 14.685 118.339 15.555C117.889 16.415 117.259 17.065 116.449 17.505C115.649 17.945 114.724 18.165 113.674 18.165ZM119.707 18V7.41H122.062V18H119.707ZM121.507 18V15.96H127.312V18H121.507ZM121.507 13.575V11.61H126.787V13.575H121.507ZM121.507 9.435V7.41H127.237V9.435H121.507ZM129.985 13.635V11.895H132.22C132.69 11.895 133.05 11.775 133.3 11.535C133.56 11.295 133.69 10.97 133.69 10.56C133.69 10.18 133.565 9.865 133.315 9.615C133.065 9.365 132.705 9.24 132.235 9.24H129.985V7.41H132.505C133.205 7.41 133.82 7.545 134.35 7.815C134.88 8.075 135.295 8.44 135.595 8.91C135.895 9.38 136.045 9.92 136.045 10.53C136.045 11.15 135.895 11.695 135.595 12.165C135.295 12.625 134.875 12.985 134.335 13.245C133.795 13.505 133.16 13.635 132.43 13.635H129.985ZM128.185 18V7.41H130.54V18H128.185ZM133.945 18L130.645 13.44L132.805 12.855L136.735 18H133.945Z"
/>
<rect width="7.49999" height="6.42856" />
<rect x="22.5" y="8.57129" width="7.49999" height="6.42856" />
<rect x="10.7144" width="19.2857" height="6.42856" />
<rect y="8.57129" width="19.2857" height="6.42856" />
<rect y="17.1428" width="29.9999" height="6.42856" />
</svg>
</a>
<ul class="items-list">
<a href="#about"> about </a>
<a href="#features"> features </a>
<a href="#cost"> cost </a>
<a href="#keepgo"> keepgo </a>
<a
target="_blank"
href="https://chrome.google.com/webstore/detail/tab-manager/fcjlfbcjannhplildiamopijamcbpjlg?hl=ko"
>
<button class="btn-style-s">download</button>
</a>
<div class="current"></div>
</ul>
<div class="mb-icon">
<span></span>
</div>
</div>
</nav>
<section id="home">
<div class="header-text-container" fadeIn delay="0.3s">
<h1>TAB MANAGER</h1>
<p>v1.0 available in chrome<img src="./img/chrome-favicon.png" /></p>
</div>
<div class="hero" fadeIn delay="0.5s">
<img src="./img/home-hero1.png" alt="home's hero" />
</div>
<div class="body-text-container" fadeIn>
<h2>Tab manager will make your browsing more simple and easy</h2>
</div>
</section>
<section id="about">
<header fadeIn>
<img src="./img/megaphone.png" alt="megaphone image" />
<h3>
<span class="bold">version 2 </span>will be update as soon as possible
</h3>
</header>
<main>
<div class="header-text-container" fadeIn>
The tab manager will increase your computer speed by removing tabs
that occupied your memory and cause low performance
<img class="quotation" src="./img/quotation.png" />
</div>
<div class="main-container"> <!-- for fade -->
<ul class="features-container">
<li class="i1">
<p>saving<br />memory</p>
<svg
width="125"
height="125"
viewBox="0 0 125 125"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M58.3333 50.5H41.6667C39.375 50.5 37.5 52.375 37.5 54.6667V71.3333C37.5 73.625 39.375 75.5 41.6667 75.5H58.3333C60.625 75.5 62.5 73.625 62.5 71.3333V54.6667C62.5 52.375 60.625 50.5 58.3333 50.5ZM54.1667 67.1667H45.8333V58.8333H54.1667V67.1667ZM87.5 54.6667C87.5 52.375 85.625 50.5 83.3333 50.5H79.1667V42.1667C79.1667 37.5833 75.4167 33.8333 70.8333 33.8333H62.5V29.6667C62.5 27.375 60.625 25.5 58.3333 25.5C56.0417 25.5 54.1667 27.375 54.1667 29.6667V33.8333H45.8333V29.6667C45.8333 27.375 43.9583 25.5 41.6667 25.5C39.375 25.5 37.5 27.375 37.5 29.6667V33.8333H29.1667C24.5833 33.8333 20.8333 37.5833 20.8333 42.1667V50.5H16.6667C14.375 50.5 12.5 52.375 12.5 54.6667C12.5 56.9583 14.375 58.8333 16.6667 58.8333H20.8333V67.1667H16.6667C14.375 67.1667 12.5 69.0417 12.5 71.3333C12.5 73.625 14.375 75.5 16.6667 75.5H20.8333V83.8333C20.8333 88.4167 24.5833 92.1667 29.1667 92.1667H37.5V96.3333C37.5 98.625 39.375 100.5 41.6667 100.5C43.9583 100.5 45.8333 98.625 45.8333 96.3333V92.1667H54.1667V96.3333C54.1667 98.625 56.0417 100.5 58.3333 100.5C60.625 100.5 62.5 98.625 62.5 96.3333V92.1667H70.8333C75.4167 92.1667 79.1667 88.4167 79.1667 83.8333V75.5H83.3333C85.625 75.5 87.5 73.625 87.5 71.3333C87.5 69.0417 85.625 67.1667 83.3333 67.1667H79.1667V58.8333H83.3333C85.625 58.8333 87.5 56.9583 87.5 54.6667ZM66.6667 83.8333H33.3333C31.0417 83.8333 29.1667 81.9583 29.1667 79.6667V46.3333C29.1667 44.0417 31.0417 42.1667 33.3333 42.1667H66.6667C68.9583 42.1667 70.8333 44.0417 70.8333 46.3333V79.6667C70.8333 81.9583 68.9583 83.8333 66.6667 83.8333Z"
/>
<path
d="M114.583 44.7708V35.3958L99.9999 45.8125L85.4166 35.3958V44.7708L99.9999 55.1875L114.583 44.7708Z"
fill="#4299FF"
/>
<path
d="M114.583 30.1875V20.8125L99.9999 31.2292L85.4166 20.8125V30.1875L99.9999 40.6042L114.583 30.1875Z"
fill="#4299FF"
/>
</svg>
</li>
<li class="i2">
<p>powerful<br />searching</p>
<svg
width="125"
height="125"
viewBox="0 0 125 125"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M78.6458 71.3958H75.3542L74.1875 70.2708C78.2708 65.5208 80.7292 59.3542 80.7292 52.6458C80.7292 37.6875 68.6042 25.5625 53.6458 25.5625C38.6875 25.5625 26.5625 37.6875 26.5625 52.6458C26.5625 67.6042 38.6875 79.7292 53.6458 79.7292C60.3542 79.7292 66.5208 77.2708 71.2708 73.1875L72.3958 74.3542V77.6458L93.2292 98.4375L99.4375 92.2292L78.6458 71.3958ZM53.6458 71.3958C43.2708 71.3958 34.8958 63.0208 34.8958 52.6458C34.8958 42.2708 43.2708 33.8958 53.6458 33.8958C64.0208 33.8958 72.3958 42.2708 72.3958 52.6458C72.3958 63.0208 64.0208 71.3958 53.6458 71.3958Z"
/>
</svg>
</li>
<li class="i3">
<p>easy<br />managing</p>
<svg
width="125"
height="125"
viewBox="0 0 125 125"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M25.5 66.1667H58.8333V24.5H25.5V66.1667ZM25.5 99.5H58.8333V74.5H25.5V99.5ZM67.1667 99.5H100.5V57.8333H67.1667V99.5ZM67.1667 24.5V49.5H100.5V24.5H67.1667Z"
/>
</svg>
</li>
</ul>
<div class="video-container" >
<!-- js will occur -->
</div>
</div>
</main>
</section>
<section id="features">
<header fadeInOut>
More features<br />
in future
</header>
<main>
<div class="f1">
<h2 fadeInOut>Sync tabs</h2>
<div class="wrapper" fadeInOut>
<img src="./img/features-hero1.png" alt="" />
</div>
<div class="text" fadeInOut>
<p>will update at version 3.0!</p>
<p>
you can manage your current tabs and saved tabs with cloud in
future!
</p>
</div>
</div>
<div class="f2">
<h2 fadeInOut>Categorized</h2>
<div class="wrapper" fadeInOut>
<img src="./img/features-hero2.png" alt="" />
</div>
<div class="text" fadeInOut>
<p>will update at version 3.0!</p>
<p>
categorized saved tabs so you can handle them more concisely and
cleanly!
</p>
</div>
</div>
</main>
</section>
<section id="cost" fadeIn>
<div class="container">
<h1>Cost</h1>
<div class="card">
<p>All of these are available for</p>
<h1>FREE</h1>
</div>
<p>but some features have to pay in late future</p>
</div>
<p class="notice"></p>
</section>
<section id="keepgo">
<section class="news">
<div class="notes-container" fadeIn>
<h1>Update notes</h1>
<ul class="notes-list">
<li>
<a href="https://calico-kiwi-a51.notion.site/tab-manager-2-0-11c863d3c87f4889adc2f649141529fa" target="_blank">
<img
class="thumbnail"
src="https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F9238e79e-cc6b-46be-9fde-cd64d25bf22f%2Fdum.png?table=block&id=11c863d3-c87f-4889-adc2-f649141529fa&spaceId=60e3d051-dcf7-4ad9-b1f3-b7cd6f853dfa&width=2000&userId=4074aa06-148a-45dd-8822-b749a6e56c0e&cache=v2"
alt=""
/>
<div class="text">
<h3>version 2.0 plans</h3>
<p>our studio is going to established</p>
</div>
</a>
</li>
</ul>
</div>
</section>
<section class="ending">
<div fadeInOut class="container">
<h1>Enjoy our extension</h1>
<canvas class="keepgo-studio-logo"></canvas>
<div class="card-container">
<div class="text">
<h1>Get started</h1>
<p>
go download the extension at chrome web store<img
src="./img/chrome-web-store-favicon.png"
alt=""
/>
</p>
</div>
<a
target="_blank"
href="https://chrome.google.com/webstore/detail/tab-manager/fcjlfbcjannhplildiamopijamcbpjlg?hl=ko"
>
<button class="btn-style-xl">download</button>
</a>
</div>
</div>
</section>
</section>
<footer id="footer">
<div>
<svg
class="favicon"
width="171"
height="24"
viewBox="0 0 171 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.615 18V7.56H40.97V18H38.615ZM35.3 9.465V7.41H44.285V9.465H35.3ZM42.7514 18L46.9514 7.41H49.0814L53.2364 18H50.7464L47.5664 9.21H48.4214L45.1964 18H42.7514ZM45.1364 16.08V14.16H50.9114V16.08H45.1364ZM55.4069 18V16.17H57.8969C58.3569 16.17 58.7169 16.035 58.9769 15.765C59.2369 15.495 59.3669 15.165 59.3669 14.775C59.3669 14.505 59.3069 14.265 59.1869 14.055C59.0669 13.845 58.8969 13.68 58.6769 13.56C58.4669 13.44 58.2069 13.38 57.8969 13.38H55.4069V11.595H57.7019C58.0919 11.595 58.4069 11.5 58.6469 11.31C58.8869 11.11 59.0069 10.81 59.0069 10.41C59.0069 10.02 58.8869 9.73 58.6469 9.54C58.4069 9.34 58.0919 9.24 57.7019 9.24H55.4069V7.41H58.1519C58.8319 7.41 59.4069 7.535 59.8769 7.785C60.3569 8.035 60.7219 8.37 60.9719 8.79C61.2219 9.21 61.3469 9.675 61.3469 10.185C61.3469 10.835 61.1369 11.385 60.7169 11.835C60.2969 12.285 59.6769 12.595 58.8569 12.765L58.9169 11.97C59.8069 12.14 60.4919 12.485 60.9719 13.005C61.4619 13.525 61.7069 14.165 61.7069 14.925C61.7069 15.505 61.5619 16.03 61.2719 16.5C60.9919 16.96 60.5819 17.325 60.0419 17.595C59.5119 17.865 58.8719 18 58.1219 18H55.4069ZM53.6069 18V7.41H55.9319V18H53.6069ZM66.6792 18V7.41H68.3592L72.5292 13.905H71.6742L75.8292 7.41H77.5242V18H75.1692V11.385L75.5892 11.49L72.8742 15.72H71.3142L68.6142 11.49L69.0192 11.385V18H66.6792ZM78.0102 18L82.2102 7.41H84.3402L88.4952 18H86.0052L82.8252 9.21H83.6802L80.4552 18H78.0102ZM80.3952 16.08V14.16H86.1702V16.08H80.3952ZM88.8657 18V7.41H90.5157L91.2207 9.525V18H88.8657ZM96.1707 18L89.9307 10.005L90.5157 7.41L96.7557 15.405L96.1707 18ZM96.1707 18L95.5407 15.885V7.41H97.8957V18H96.1707ZM98.3949 18L102.595 7.41H104.725L108.88 18H106.39L103.21 9.21H104.065L100.84 18H98.3949ZM100.78 16.08V14.16H106.555V16.08H100.78ZM113.674 18.165C112.904 18.165 112.179 18.025 111.499 17.745C110.829 17.465 110.244 17.08 109.744 16.59C109.244 16.09 108.849 15.51 108.559 14.85C108.279 14.18 108.139 13.46 108.139 12.69C108.139 11.92 108.284 11.205 108.574 10.545C108.864 9.885 109.264 9.31 109.774 8.82C110.294 8.32 110.899 7.935 111.589 7.665C112.279 7.385 113.019 7.245 113.809 7.245C114.719 7.245 115.544 7.41 116.284 7.74C117.034 8.07 117.654 8.525 118.144 9.105L116.539 10.71C116.199 10.27 115.799 9.94 115.339 9.72C114.879 9.5 114.359 9.39 113.779 9.39C113.159 9.39 112.604 9.53 112.114 9.81C111.624 10.08 111.239 10.465 110.959 10.965C110.689 11.455 110.554 12.03 110.554 12.69C110.554 13.35 110.689 13.93 110.959 14.43C111.229 14.93 111.599 15.32 112.069 15.6C112.539 15.88 113.079 16.02 113.689 16.02C114.309 16.02 114.834 15.905 115.264 15.675C115.704 15.435 116.039 15.095 116.269 14.655C116.509 14.205 116.629 13.66 116.629 13.02L118.189 14.07L113.464 13.995V12H119.029V12.345C119.029 13.615 118.799 14.685 118.339 15.555C117.889 16.415 117.259 17.065 116.449 17.505C115.649 17.945 114.724 18.165 113.674 18.165ZM119.707 18V7.41H122.062V18H119.707ZM121.507 18V15.96H127.312V18H121.507ZM121.507 13.575V11.61H126.787V13.575H121.507ZM121.507 9.435V7.41H127.237V9.435H121.507ZM129.985 13.635V11.895H132.22C132.69 11.895 133.05 11.775 133.3 11.535C133.56 11.295 133.69 10.97 133.69 10.56C133.69 10.18 133.565 9.865 133.315 9.615C133.065 9.365 132.705 9.24 132.235 9.24H129.985V7.41H132.505C133.205 7.41 133.82 7.545 134.35 7.815C134.88 8.075 135.295 8.44 135.595 8.91C135.895 9.38 136.045 9.92 136.045 10.53C136.045 11.15 135.895 11.695 135.595 12.165C135.295 12.625 134.875 12.985 134.335 13.245C133.795 13.505 133.16 13.635 132.43 13.635H129.985ZM128.185 18V7.41H130.54V18H128.185ZM133.945 18L130.645 13.44L132.805 12.855L136.735 18H133.945Z"
fill="black"
/>
<rect width="7.49999" height="6.42856" fill="black" />
<rect
x="22.5"
y="8.57129"
width="7.49999"
height="6.42856"
fill="black"
/>
<rect x="10.7144" width="19.2857" height="6.42856" fill="black" />
<rect y="8.57129" width="19.2857" height="6.42856" fill="black" />
<rect y="17.1428" width="29.9999" height="6.42856" fill="black" />
</svg>
<div class="container">
<ul class="wrapper">
<li>
<p>
<canvas class="keepgo-studio-logo-s"></canvas>
</p>
<!-- <a href="" target="_blank"></a> -->
<a href=""></a>
</li>
<li>
<p>github<img /></p>
<a href="https://github.com/keepgo-studio" target="_blank">keepgo-studio</a>
</li>
</ul>
<ul class="wrapper">
<li>
<p>email</p>
<a href="mailto:[email protected]" target="_blank">[email protected]</a>
</li>
<li>
<p>instagram<img /></p>
<a href="https://www.instagram.com/keepgo.studio.official/" target="_blank">keepgo.studio.official</a>
</li>
</ul>
</div>
</div>
</footer>
<script type="module" src="./js/main.js"></script>
</body>
</html>