-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
129 lines (123 loc) · 4.43 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
<html lang="en"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>AOS Wordle</title>
<link rel="icon" type="image/png" href="https://i.pinimg.com/originals/9c/88/d1/9c88d167fbe4409252c9c1ad92adbe98.png">
<meta name="description" content="Guess the hidden Agents of S.H.I.E.L.D. word in 6 tries.">
<!-- FB Meta Tags -->
<meta property="og:type" content="website">
<meta property="og:title" content="AOS Wordle">
<meta property="og:description" content="Guess the hidden Agents of S.H.I.E.L.D. word in 6 tries.">
<meta property="og:image" content="https://i.pinimg.com/originals/9c/88/d1/9c88d167fbe4409252c9c1ad92adbe98.png">
<meta name="theme-color" content="#000042">
<link rel="manifest" href="manifest.json">
<style>
/* Global Styles & Colors */
:root {
--green: #6aaa64;
--darkendGreen: #538d4e;
--yellow: #c9b458;
--darkendYellow: #b59f3b;
--lightGray: #d8d8d8;
--gray: #86888a;
--darkGray: #939598;
--white: #fff;
--black: #212121;
/* Colorblind colors */
--orange: #f5793a;
--cbblue: #85c0f9;
font-family: 'Clear Sans', 'Helvetica Neue', Arial, sans-serif;
font-size: 16px;
--header-height: 50px;
--keyboard-height: 200px;
--game-max-width: 500px;
}
/* Light theme colors */
:root {
--color-tone-1: #1a1a1b;
--color-tone-2: #787c7e;
--color-tone-3: #878a8c;
--color-tone-4: #d3d6da;
--color-tone-5: #edeff1;
--color-tone-6: #f6f7f8;
--color-tone-7: #ffffff;
--opacity-50: rgba(255, 255, 255, 0.5);
}
/* Dark Theme Colors */
.nightmode {
--color-tone-1: #d7dadc;
--color-tone-2: #818384;
--color-tone-3: #565758;
--color-tone-4: #3a3a3c;
--color-tone-5: #272729;
--color-tone-6: #1a1a1b;
--color-tone-7: #121213;
--opacity-50: rgba(0, 0, 0, 0.5);
}
/* Constant colors and colors derived from theme */
:root,
.nightmode {
--color-background: var(--color-tone-7);
}
:root {
--color-present: var(--yellow);
--color-correct: var(--green);
--color-absent: var(--color-tone-2);
--tile-text-color: var(--color-tone-7);
--key-text-color: var(--color-tone-1);
--key-evaluated-text-color: var(--color-tone-7);
--key-bg: var(--color-tone-4);
--key-bg-present: var(--color-present);
--key-bg-correct: var(--color-correct);
--key-bg-absent: var(--color-absent);
--modal-content-bg: var(--color-tone-7);
}
.nightmode {
--color-present: var(--darkendYellow);
--color-correct: var(--darkendGreen);
--color-absent: var(--color-tone-4);
--tile-text-color: var(--color-tone-1);
--key-text-color: var(--color-tone-1);
--key-evaluated-text-color: var(--color-tone-1);
--key-bg: var(--color-tone-2);
--key-bg-present: var(--color-present);
--key-bg-correct: var(--color-correct);
--key-bg-absent: var(--color-absent);
--modal-content-bg: var(--color-tone-7);
}
.colorblind {
--color-correct: var(--orange);
--color-present: var(--cbblue);
--tile-text-color: var(--white);
--key-bg-present: var(--color-present);
--key-bg-correct: var(--color-correct);
--key-bg-absent: var(--color-absent);
}
html {
height: 100%;
}
body {
height: 100%;
background-color: var(--color-background);
margin: 0;
padding: 0;
/* Prevent scrollbar appearing on page transition */
overflow-y: hidden;
}
</style>
</head>
<body data-new-gr-c-s-check-loaded="14.1007.0" data-gr-ext-installed="">
<script async="" src="https://www.googletagmanager.com/gtag/js?id=G-2SSGMHY3NP"></script>
<script>
(function () {
// Defining the hash before the main bundle allows the bundle access window.hash
window.wordle = window.wordle || {};
window.wordle.hash = 'e65ce0a5';
})();
</script>
<script src="main.e65ce0a5.js"></script>
<div style="background: url(https://bit.ly/3tp3TCo); background-repeat: no-repeat; background-size: 100%;">
<game-app></game-app>
</div>
</body>
</html>