-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
139 lines (126 loc) · 7.81 KB
/
index.html
File metadata and controls
139 lines (126 loc) · 7.81 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Charcopy: Get your special characters</title>
<meta name="description" content="How can you get this shrug emoticon on your keyboard? Or this backslash thing? Look no further, this site got you covered."/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="manifest" href="/manifest.json">
<link rel="shortcut icon" type="image/ico" href="favicon.ico?20230412">
<meta property="og:type" content="website">
<meta property="og:url" content="https://charcopy.com/" />
<meta property="og:title" content="Charcopy: Get your special characters">
<meta property="og:description" content="How can you get this shrug emoticon on your keyboard? Or this backslash thing? Look no further, this site got you covered.">
<meta property="og:image" content="https://charcopy.com/shruggy-cover.png?20230412" />
<link rel="apple-touch-icon" href="https://charcopy.com/shruggy-icon.png?20230412" />
<link rel="icon" href="https://charcopy.com/shruggy-icon.png?20230412">
<meta name="theme-color" content="#000" />
<link rel="stylesheet" href="styles.css?20230412" />
</head>
<body class="dark-mode color-scheme-yellow">
<header class="app-header">
<h1>Charcopy</h1>
</header>
<div class="char-search">
<button class="reset-search"><span class="screen-reader-text">Reset</span></button>
<label for="search-term" class="screen-reader-text">Search</label>
<input type="search" id="search-term" placeholder="Search for Character, e.g. copyright">
</div>
<div class="char-cards-wrap">
<div class="char-cards loading" id="characters-container">
</div>
<div id="loading-message">
Loading Characters
</div>
</div>
<div class="copy-confirmation" id="confirmation-message">
<div class="copy-confirmation-inner"></div>
</div>
<footer class="site-footer">
<div class="credits">
<p>
Privacy policy, Terms and conditions? Not needed; nothing you do here is neither tracked nor shared.<br>
Basically, this site is just for <a href="https://velthy.net/">Stefan Velthuys</a> and his inability to remember certain characters and its keyboard combinations on different systems.<br>
¯\_(ツ)_/¯ wasn't the only reason. ¯\_(ツ)_/¯
</p>
<button id="clear-cache-button" style="display: none;">Clear cache</button>
</div>
<div class="settings">
<div class="dark-mode-toggle">
<input type="checkbox" id="dark-mode-toggle" />
<label for="dark-mode-toggle">
<span class="screen-reader-text">Dark / Light Mode</span>
<span class="moon">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.86973 0.870696C7.98748 0.679144 7.98194 0.436344 7.8556 0.250351C7.72926 0.0643583 7.50558 -0.0302513 7.28412 0.00862731C5.31248 0.354754 3.5403 1.42243 2.31279 3.00367C1.08527 4.58491 0.490334 6.56648 0.643863 8.56237C0.797393 10.5583 1.6884 12.4255 3.1433 13.8005C4.59822 15.1753 6.51285 15.9594 8.51421 15.9999L8.52432 16C9.89493 16.0035 11.2432 15.6528 12.4384 14.9818C13.6336 14.311 14.635 13.3425 15.3458 12.1706C15.4616 11.9798 15.4556 11.7391 15.3306 11.5542C15.2054 11.3693 14.9843 11.2741 14.7641 11.3105C14.4161 11.368 14.0643 11.3998 13.7116 11.4057C12.4875 11.3971 11.2876 11.0637 10.2345 10.4395C9.17958 9.81417 8.30996 8.91958 7.71478 7.84741C7.11961 6.77523 6.82029 5.56406 6.84752 4.33807C6.87474 3.11208 7.22754 1.91539 7.86973 0.870696Z" fill="currentColor" />
</svg>
</span>
<span class="sun">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 0C8.47338 0 8.85714 0.383755 8.85714 0.857143V2C8.85714 2.47338 8.47338 2.85714 8 2.85714C7.52662 2.85714 7.14286 2.47338 7.14286 2V0.857143C7.14286 0.383755 7.52662 0 8 0ZM11.7143 8C11.7143 10.0513 10.0513 11.7143 8 11.7143C5.94865 11.7143 4.28571 10.0513 4.28571 8C4.28571 5.94865 5.94865 4.28571 8 4.28571C10.0513 4.28571 11.7143 5.94865 11.7143 8ZM8.85714 14C8.85714 13.5266 8.47338 13.1429 8 13.1429C7.52662 13.1429 7.14286 13.5266 7.14286 14V15.1429C7.14286 15.6162 7.52662 16 8 16C8.47338 16 8.85714 15.6162 8.85714 15.1429V14ZM13.1429 8C13.1429 7.52662 13.5266 7.14286 14 7.14286H15.1429C15.6162 7.14286 16 7.52662 16 8C16 8.47338 15.6162 8.85714 15.1429 8.85714H14C13.5266 8.85714 13.1429 8.47338 13.1429 8ZM0.857143 7.14286C0.383755 7.14286 0 7.52662 0 8C0 8.47338 0.383755 8.85714 0.857143 8.85714H2C2.47338 8.85714 2.85714 8.47338 2.85714 8C2.85714 7.52662 2.47338 7.14286 2 7.14286H0.857143ZM2.34313 2.34313C2.67786 2.00839 3.22057 2.00839 3.55531 2.34313L4.53893 3.32674C4.87366 3.66147 4.87366 4.20418 4.53893 4.53893C4.20418 4.87366 3.66147 4.87366 3.32674 4.53893L2.34313 3.55531C2.00839 3.22057 2.00839 2.67786 2.34313 2.34313ZM12.6733 11.4609C12.3385 11.1261 11.7958 11.1261 11.461 11.4609C11.1263 11.7957 11.1263 12.3383 11.461 12.673L12.4447 13.6567C12.7794 13.9914 13.3222 13.9914 13.6569 13.6567C13.9917 13.3219 13.9917 12.7792 13.6569 12.4445L12.6733 11.4609ZM13.6569 2.34313C13.9917 2.67786 13.9917 3.22057 13.6569 3.55531L12.6733 4.53893C12.3385 4.87366 11.7958 4.87366 11.461 4.53893C11.1263 4.20418 11.1263 3.66147 11.461 3.32674L12.4447 2.34313C12.7794 2.00839 13.3222 2.00839 13.6569 2.34313ZM4.53893 12.673C4.87366 12.3383 4.87366 11.7957 4.53893 11.4609C4.20418 11.1261 3.66147 11.1261 3.32674 11.4609L2.34313 12.4445C2.00839 12.7792 2.00839 13.3219 2.34313 13.6567C2.67786 13.9914 3.22057 13.9914 3.55531 13.6567L4.53893 12.673Z" fill="currentColor" />
</svg>
</span>
</label>
</div>
<ul id="theme-toggle" class="color-scheme-selector">
<li>
<button id="yellow-button" data-color-scheme="color-scheme-yellow" class="current color-yellow">
<span class="color-scheme-selector-swatch"></span>
<span class="color-scheme-selector-name">Yellow</span>
</button>
</li>
<li>
<button id="green-button" data-color-scheme="color-scheme-green" class="color-green">
<span class="color-scheme-selector-swatch"></span>
<span class="color-scheme-selector-name">Green</span>
</button>
</li>
<li>
<button id="blue-button" data-color-scheme="color-scheme-blue" class="color-blue">
<span class="color-scheme-selector-swatch"></span>
<span class="color-scheme-selector-name">Blue</span>
</button>
</li>
<li>
<button id="purple-button" data-color-scheme="color-scheme-purple" class="color-purple">
<span class="color-scheme-selector-swatch"></span>
<span class="color-scheme-selector-name">Purple</span>
</button>
</li>
<li>
<button id="pink-button" data-color-scheme="color-scheme-pink" class="color-pink">
<span class="color-scheme-selector-swatch"></span>
<span class="color-scheme-selector-name">Pink</span>
</button>
</li>
</ul>
</div>
<div class="color-line">
<span class="color-line-yellow"></span>
<span class="color-line-green"></span>
<span class="color-line-blue"></span>
<span class="color-line-purple"></span>
<span class="color-line-pink"></span>
</div>
</footer>
<div class="mode-switcher-overlay">
<div class="mode-switcher-overlay-bg"></div>
</div>
<script src="functions.js?20230412"></script>
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('service-worker.js?20230412')
.then((registration) => {
console.log('Service Worker registered with scope:', registration.scope);
})
.catch((error) => {
console.log('Service Worker registration failed:', error);
});
});
}
</script>
<script src="https://required.com/content/plugins/iframe-resizer-for-html-block/assets/dist/iframe-resizer-child.js?ver=0c7b7e5d83be067dc884" async></script>
</body>
</html>