-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
106 lines (87 loc) · 9.22 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
<html>
<head>
<meta charset="utf-8">
<title>Clocks x 96</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name=viewport content="width=700, initial-scale=2">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<!-- basic -->
<meta name="description" content="96 mini clocks, 1 time.">
<link rel="author" href="https://github.com/catc" />
<!-- fb -->
<meta property="og:url" content="https://catc.github.io/96-clocks/">
<meta property="og:image" content="https://i.imgur.com/ujxab9D.png">
<meta property="og:image:type" content="image/png">
<meta property="og:description" content="96 mini clocks, 1 time.">
<meta property="og:title" content="96 clocks">
<meta property="og:site_name" content="96 clocks">
<meta property="og:see_also" content="https://github.com/catc/96-clocks">
<!-- google other -->
<meta itemprop="name" content="96 clocks">
<meta itemprop="description" content="96 mini clocks, 1 time.">
<meta itemprop="image" content="https://i.imgur.com/ujxab9D.png">
<meta itemprop="url" content="https://catc.github.io/96-clocks">
<!-- BUNDLE_CSS -->
</head>
<body>
<!-- icons -->
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="clock">
<path d="M10 0.4c-5.303 0-9.601 4.298-9.601 9.6 0 5.303 4.298 9.601 9.601 9.601 5.301 0 9.6-4.298 9.6-9.601s-4.299-9.6-9.6-9.6zM9.999 17.6c-4.197 0-7.6-3.402-7.6-7.6 0-4.197 3.402-7.6 7.6-7.6 4.197 0 7.601 3.402 7.601 7.6 0 4.197-3.404 7.6-7.601 7.6zM11 9.33v-5.33h-2v6.245l-3.546 2.048 1 1.732 4.115-2.377c0.238-0.137 0.431-0.473 0.431-0.748v-0.168l4.24-4.166c-0.198-0.271-0.411-0.529-0.647-0.766l-3.593 3.53z"></path>
<symbol/>
<symbol id="dialpad">
<path d="M6 0h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM11 0h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM16 0h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM6 5h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM11 5h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM16 5h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM6 10h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM11 10h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM11 16h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1zM16 10h-2c-0.552 0-1 0.448-1 1v2c0 0.552 0.448 1 1 1h2c0.552 0 1-0.448 1-1v-2c0-0.552-0.448-1-1-1z"></path>
</symbol>
<symbol id="random">
<path d="M15.093 6.694h0.92v2.862l3.987-4.024-3.988-4.025v2.387h-0.92c-3.694 0-5.776 2.738-7.614 5.152-1.652 2.172-3.080 4.049-5.386 4.049h-2.092v2.799h2.093c3.694 0 5.776-2.736 7.614-5.152 1.652-2.173 3.080-4.048 5.386-4.048zM5.41 8.458c0.158-0.203 0.316-0.412 0.477-0.623 0.39-0.514 0.804-1.055 1.252-1.596-1.322-1.234-2.915-2.144-5.046-2.144h-2.093v2.799h2.093c1.327 0 2.362 0.623 3.317 1.564zM16.012 13.294h-0.92c-1.407 0-2.487-0.701-3.491-1.738-0.1 0.131-0.201 0.264-0.303 0.397-0.441 0.58-0.915 1.201-1.439 1.818 1.356 1.324 3 2.324 5.232 2.324h0.92v2.398l3.989-4.025-3.988-4.025v2.851z"></path>
</symbol>
<symbol id="fullscreen">
<path d="M6.987 10.987l-2.931 3.031-2.056-2.429v6.411h6.387l-2.43-2.081 3.030-2.932-2-2zM11.613 2l2.43 2.081-3.030 2.932 2 2 2.931-3.031 2.056 2.429v-6.411h-6.387z"></path>
</symbol>
<symbol id="day">
<path d="M19 9.199c-0.182 0-0.799 0-0.98 0-0.553 0-1 0.359-1 0.801s0.447 0.799 1 0.799c0.182 0 0.799 0 0.98 0 0.552 0 1-0.357 1-0.799 0-0.441-0.449-0.801-1-0.801zM10 4.5c-3.051 0-5.5 2.449-5.5 5.5s2.449 5.5 5.5 5.5c3.050 0 5.5-2.449 5.5-5.5s-2.451-5.5-5.5-5.5zM10 14c-2.211 0-4-1.791-4-4 0-2.211 1.789-4 4-4v8zM3 10c0-0.441-0.449-0.801-1-0.801-0.185 0-0.816 0-1 0-0.553 0-1 0.359-1 0.801s0.447 0.799 1 0.799c0.184 0 0.815 0 1 0 0.551 0 1-0.358 1-0.799zM10 3c0.441 0 0.799-0.447 0.799-1 0-0.184 0-0.816 0-1 0-0.553-0.358-1-0.799-1s-0.801 0.447-0.801 1c0 0.184 0 0.816 0 1 0 0.553 0.359 1 0.801 1zM10 17c-0.442 0-0.801 0.447-0.801 1 0 0.184 0 0.816 0 1 0 0.553 0.359 1 0.801 1s0.799-0.447 0.799-1c0-0.184 0-0.816 0-1 0-0.553-0.358-1-0.799-1zM17.365 3.766c0.391-0.391 0.454-0.961 0.142-1.273s-0.883-0.248-1.272 0.143c-0.108 0.107-0.593 0.592-0.7 0.699-0.391 0.391-0.454 0.961-0.142 1.273s0.883 0.248 1.273-0.143c0.107-0.108 0.591-0.592 0.699-0.699zM3.334 15.533c-0.108 0.109-0.593 0.594-0.7 0.701-0.391 0.391-0.454 0.959-0.142 1.271s0.883 0.25 1.272-0.141c0.108-0.107 0.593-0.592 0.7-0.699 0.391-0.391 0.454-0.961 0.142-1.274s-0.883-0.247-1.272 0.142zM3.765 2.635c-0.39-0.391-0.961-0.455-1.273-0.143s-0.248 0.883 0.141 1.274c0.108 0.107 0.593 0.592 0.7 0.699 0.391 0.391 0.96 0.455 1.272 0.143s0.249-0.883-0.141-1.273c-0.107-0.108-0.591-0.593-0.699-0.7zM15.534 16.666c0.108 0.107 0.593 0.592 0.7 0.699 0.391 0.391 0.96 0.453 1.272 0.143 0.312-0.312 0.249-0.883-0.142-1.273-0.107-0.107-0.592-0.592-0.699-0.699-0.391-0.391-0.961-0.455-1.274-0.143s-0.248 0.882 0.143 1.273z"></path>
</symbol>
<symbol id="sun">
<path d="M10 6.797c-1.775 0-3.2 1.426-3.2 3.201 0 1.773 1.425 3.199 3.2 3.199s3.199-1.426 3.199-3.199c0-1.775-1.425-3.201-3.199-3.201zM10 12.047c-1.133 0-2.051-0.916-2.051-2.049s0.918-2.051 2.051-2.051c1.132 0 2.050 0.918 2.050 2.051s-0.919 2.049-2.050 2.049zM15 5c-0.312-0.312-0.883-0.248-1.273 0.142s-0.453 0.959-0.141 1.272 0.882 0.25 1.273-0.141c0.39-0.39 0.453-0.961 0.141-1.273zM5.142 13.729c-0.391 0.39-0.454 0.959-0.142 1.271s0.882 0.25 1.273-0.141c0.391-0.391 0.454-0.961 0.142-1.273s-0.883-0.248-1.273 0.143zM5 5c-0.312 0.312-0.249 0.883 0.141 1.273s0.961 0.453 1.273 0.141 0.249-0.883-0.142-1.273c-0.389-0.389-0.96-0.453-1.272-0.141zM13.727 14.857c0.39 0.391 0.96 0.455 1.273 0.143s0.249-0.883-0.142-1.274c-0.391-0.391-0.96-0.453-1.273-0.141s-0.248 0.882 0.142 1.272zM10 4.998c0.441 0 0.8-0.447 0.8-1s-0.359-0.998-0.8-0.998c-0.442 0-0.801 0.445-0.801 0.998s0.358 1 0.801 1zM10 17c0.441 0 0.8-0.447 0.8-1s-0.358-0.998-0.799-0.998c-0.442 0-0.801 0.445-0.801 0.998s0.357 1 0.8 1zM5 10c0-0.441-0.45-0.8-1.003-0.8s-0.997 0.359-0.997 0.8c0 0.442 0.444 0.8 0.997 0.8s1.003-0.358 1.003-0.8zM17 10c0-0.441-0.448-0.8-1.001-0.8s-0.999 0.359-0.999 0.8c0 0.442 0.446 0.8 0.999 0.8s1.001-0.358 1.001-0.8z"></path>
</symbol>
<symbol id="github">
<path d="M13.18 11.309c-0.718 0-1.3 0.807-1.3 1.799 0 0.994 0.582 1.801 1.3 1.801s1.3-0.807 1.3-1.801c-0.001-0.992-0.582-1.799-1.3-1.799zM17.706 6.626c0.149-0.365 0.155-2.439-0.635-4.426 0 0-1.811 0.199-4.551 2.080-0.575-0.16-1.548-0.238-2.519-0.238-0.973 0-1.945 0.078-2.52 0.238-2.741-1.881-4.552-2.080-4.552-2.080-0.789 1.987-0.781 4.061-0.634 4.426-0.928 1.008-1.495 2.219-1.495 3.871 0 7.186 5.963 7.301 7.467 7.301 0.342 0 1.018 0.002 1.734 0.002s1.392-0.002 1.732-0.002c1.506 0 7.467-0.115 7.467-7.301 0-1.652-0.566-2.863-1.494-3.871zM10.028 16.915h-0.056c-3.771 0-6.709-0.449-6.709-4.115 0-0.879 0.31-1.693 1.047-2.369 1.227-1.127 3.305-0.531 5.662-0.531 0.010 0 0.020 0 0.029 0s0.018 0 0.027 0c2.357 0 4.436-0.596 5.664 0.531 0.735 0.676 1.045 1.49 1.045 2.369 0 3.666-2.937 4.115-6.709 4.115zM6.821 11.309c-0.718 0-1.3 0.807-1.3 1.799 0 0.994 0.582 1.801 1.3 1.801s1.301-0.807 1.301-1.801c0-0.992-0.582-1.799-1.301-1.799z"></path>
</symbol>
</svg>
<!-- numbers -->
<div class="clock-number-wrapper">
<div class="clock-number-wrapper__row one"></div>
<div class="clock-number-wrapper__row two"></div>
</div>
<!-- controls -->
<div class="controls">
<a href="https://github.com/catc/96-clocks" class="controls__button">
<svg><use href="#github" /></svg>
</a>
<div class="controls__right-bar">
<button class="controls__button type_clock hint-bottom-right-t-clock hint-anim-d-short" data-hint="Follow time"><svg><use href="#clock" /></svg></button>
<button class="controls__button type_random type_clock hint-bottom-right-t-clock hint-anim-d-short" data-hint="Shuffle"><svg><use href="#random" /></svg></button>
<button class="controls__button type_select type_clock hint-bottom-right-t-clock hint-anim-d-short" data-hint="Select numbers"><svg><use href="#dialpad" /></svg></button>
<button class="controls__button type_color-mode type_clock hint-bottom-right-t-clock hint-anim-d-short" data-hint="Toggle night/day mode"><svg><use href="#day" /></svg></button>
<button class="controls__button type_fullscreen type_clock hint-bottom-right-t-clock hint-anim-d-short" data-hint="Fullscreen"><svg><use href="#fullscreen" /></svg></button>
</div>
</div>
<!-- custom number select modal -->
<div class="cns">
<div class="cns__bg"></div>
<div class="cns__content">
<div class="cns__grids">
<ul class="cns__number-grid"><span class="cns__selected-number"></span></ul><ul class="cns__number-grid"><span class="cns__selected-number"></span></ul><ul class="cns__number-grid"><span class="cns__selected-number"></span></ul><ul class="cns__number-grid"><span class="cns__selected-number"></span></ul>
</div>
<div class="cns__options">
<button class="cns__select">Select</button>
<button class="cns__cancel">Cancel</button>
</div>
</div>
</div>
<script defer src="/assets/bundle.js"></script>
<!-- VENDOR_JS -->
<!-- BUNDLE_JS -->
</body>
</html>