-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
127 lines (119 loc) · 5.02 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">
<meta name="HandheldFriendly" content="true">
<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes" >
<meta name="description" content="Draw with Emoji">
<meta name="author" content="Christian Montoya">
<link rel="shortcut icon" href="favicon.ico">
<link rel="apple-touch-icon" href="apple-touch.png">
<meta property="og:url" content="https://homerow.club/notawordle/">
<meta property="og:type" content="website">
<meta property="og:description" content="Make your own Wordle-style emoji art with this handy drawing app.">
<meta property="og:image" content="https://homerow.club/notawordle/share-image.png">
<title>Not a Wordle</title>
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre.min.css">
<link rel="stylesheet" href="css/icomoon.css">
<link rel="stylesheet" href="css/pixemoji.css?v=5">
<link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet">
<style type="text/css">
#logo {
display:inline-block;
position:fixed;
bottom:16px;
left:50%;
margin-left:-174px;
z-index:100;
-webkit-filter: drop-shadow( 0 0 3px rgba(255, 255, 255, .7));
filter: drop-shadow( 0 0 3px rgba(255, 255, 255, .7));
}
#logo-cite {
margin-bottom:7px;
}
#logo img {
vertical-align:bottom;
}
</style>
</head>
<body>
<div id="logo">
<div id="logo-cite">Brought to you by</div>
<a href="http://homerow.club">
<img src="homerow.png" width="348" height="43" alt="HOME ROW">
</a>
</div>
<div id="interface-wrapper">
<div id="interface">
<div id="canvas-wrapper">
<div id="canvas-header">Not a Wordle, Just Art</div>
<div id="canvas"></div>
<div id="canvas-footer">
<span id="paint-set-black" class="icon-color">⬛</span>
<span id="paint-set-white" class="icon-color">⬜</span>
<span id="paint-set-red" class="icon-color">🟥</span>
<span id="paint-set-orange" class="icon-color">🟧</span>
<span id="paint-set-yellow" class="icon-color">🟨</span>
<span id="paint-set-green" class="icon-color">🟩</span>
<span id="paint-set-blue" class="icon-color">🟦</span>
<span id="paint-set-purple" class="icon-color">🟪</span>
<span id="paint-set-brown" class="icon-color">🟫</span>
<br>
<i id="control-set-paint" class="icon-edit"></i>
<i id="control-set-fill" class="icon-fill inactive"></i>
<i id="control-toggle-erase" class="icon-delete inactive"></i>
<i id="control-toggle-grid" class="icon-grid_on"></i>
<a id="share-button" href="#" class="btn btn-primary">
Share
</a>
</div>
</div>
</div>
</div>
<div id="hidden-text">
</div>
<div class="modal" id="share-modal">
<a href="#close" class="modal-overlay modal-close share-modal-close" aria-label="Close"></a>
<div class="modal-container">
<div class="modal-header">
<a href="#close" class="btn btn-clear float-right modal-close share-modal-close" aria-label="Close"></a>
<div class="modal-title h5">Share Your Creation</div>
</div>
<div class="modal-body">
<div class="content" id="share-modal-content">
</div>
</div>
<div class="modal-footer" id="share-modal-footer">
<a href="#close" class="btn btn-link float-right modal-close share-modal-close" aria-label="Close">Close</a>
<a href="#copy" class="btn btn-primary float-right tooltip" id="copy-to-clipboard" aria-label="Copy" data-clipboard-target="#hidden-textarea" data-tooltip="Copy to clipboard">Copy</a>
<!-- <a id="facebook-share" class="btn btn-primary float-right" href="#fbshare" aria-label="Share to Facebook">Share to Facebook</a> -->
<span id="twitter-share" class="btn btn-link"></span>
<textarea id="hidden-textarea" style="position:absolute;top:-1000px;left:-1000px;"></textarea>
</div>
</div>
</div>
<script src="https://unpkg.com/[email protected]/dist/clipboard.min.js"></script>
<script src="if-emoji/index.js"></script>
<script src="js/getElementsByClassNamePolyfill.js"></script>
<script src="js/utils.js"></script>
<script src="js/pixemoji.js?v=5"></script>
<script>
window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));
</script>
</body>
</html>