diff options
| author | Ben Harris <ben@tilde.team> | 2022-02-22 11:33:14 -0500 |
|---|---|---|
| committer | Ben Harris <ben@tilde.team> | 2022-02-22 11:33:14 -0500 |
| commit | bcb37e5883777338c3fe6feae9e2d582d4fe8731 (patch) | |
| tree | 88913c568abac003706825f6c877dd716fbc8876 /index.html | |
init
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 132 |
1 files changed, 132 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..ef842a0 --- /dev/null +++ b/index.html @@ -0,0 +1,132 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta charset="UTF-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> + + <title>Wordle - A daily word game</title> + <meta name="description" content="Guess the hidden word in 6 tries. A new puzzle is available each day."> + + <!-- FB Meta Tags --> + <meta property="og:url" content="https://bhh.sh/pub/wordle/"> + <meta property="og:type" content="website"> + <meta property="og:title" content="Wordle - A daily word game"> + <meta property="og:description" content="Guess the hidden word in 6 tries. A new puzzle is available each day."> + <meta property="og:image" content="images/wordle_og_1200x630.png"> + + <!-- Twitter Meta Tags --> + <meta name="twitter:card" content="summary_large_image"> + <meta property="twitter:domain" content="powerlanguage.co.uk"> + + <meta name="theme-color" content="#6aaa64" /> + <link rel="manifest" href="manifest.json" /> + <link href="images/wordle_logo_32x32.png" rel="icon shortcut" sizes="3232" /> + <link href="images/wordle_logo_192x192.png" rel="apple-touch-icon" /> + + <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; + --blue: #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(--blue); + --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> + <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> + <game-app></game-app> + </body> +</html> |