-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
298828b
commit 0901ce9
Showing
2 changed files
with
111 additions
and
106 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,95 +1,97 @@ | ||
| body { | ||
| width: 90vw; | ||
| margin: auto; | ||
| /* background-color: #f5f5dc; */ | ||
| background-color: #708090; | ||
| color: white; | ||
| margin-bottom: 150px; | ||
| margin: auto; | ||
| background-color: #708090; | ||
| color: white; | ||
| margin-bottom: 150px; | ||
| } | ||
|
|
||
| footer { | ||
| position: absolute; | ||
| bottom: 0; | ||
| width: 90vw; | ||
| margin: auto; | ||
| text-align: center; | ||
| position: fixed; | ||
| bottom: 0; | ||
| width: 100vw; | ||
| margin: auto; | ||
| text-align: center; | ||
| background-color: #708090; | ||
| padding-top: 5px; | ||
| border-top: 1px solid white; | ||
| } | ||
|
|
||
| input { | ||
| margin-bottom: 15px; | ||
| margin-bottom: 15px; | ||
| } | ||
|
|
||
| button { | ||
| /* Disable double tap to zoom on buttons */ | ||
| touch-action: manipulation; | ||
| /* Disable double tap to zoom on buttons */ | ||
| touch-action: manipulation; | ||
| } | ||
|
|
||
| a { | ||
| color: #00008b; | ||
| color: #00008b; | ||
| } | ||
|
|
||
| a:hover { | ||
| text-decoration: underline; | ||
| text-decoration: underline; | ||
| } | ||
|
|
||
| a#header { | ||
| color: white; | ||
| color: white; | ||
| } | ||
|
|
||
| .icon > img { | ||
| margin-bottom: 10px; | ||
| margin-right: 15px; | ||
| margin-bottom: 10px; | ||
| margin-right: 15px; | ||
| } | ||
|
|
||
| #link { | ||
| white-space: initial; | ||
| word-wrap: break-word | ||
| white-space: initial; | ||
| word-wrap: break-word; | ||
| } | ||
|
|
||
| .container { | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
| align-items: center; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
| align-items: center; | ||
| width: 90vw; | ||
| } | ||
|
|
||
| #flash { | ||
| padding: 15px; | ||
| font-size: 1.2em; | ||
| margin-bottom: 15px; | ||
| width: 80vw; | ||
| padding: 15px; | ||
| font-size: 1.2em; | ||
| margin-bottom: 15px; | ||
| width: 80vw; | ||
| } | ||
|
|
||
| .flash-error { | ||
| background-color: #fb6565; | ||
| color: white; | ||
| background-color: #fb6565; | ||
| color: white; | ||
| } | ||
|
|
||
| .flash-warning { | ||
| background-color: #ffac05; | ||
| color: white; | ||
| background-color: #ffac05; | ||
| color: white; | ||
| } | ||
|
|
||
| .flash-success { | ||
| background-color: #387b54; | ||
| color: white; | ||
| background-color: #387b54; | ||
| color: white; | ||
| } | ||
|
|
||
| .green { | ||
| background-color: green; | ||
| color: white; | ||
| background-color: green; | ||
| color: white; | ||
| } | ||
|
|
||
| .orange { | ||
| background-color: orange; | ||
| color: white; | ||
| background-color: orange; | ||
| color: white; | ||
| } | ||
|
|
||
| .gray { | ||
| background-color: #696969; | ||
| color: white; | ||
| background-color: #696969; | ||
| color: white; | ||
| } | ||
|
|
||
| .is-italic { | ||
| font-style: italic; | ||
| font-style: italic; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,82 +1,85 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> | ||
| <meta name="description" content="" /> | ||
| <meta name="keywords" content="" /> | ||
| <meta name="author" content="Dan Stewart" /> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> | ||
| <meta name="description" content="" /> | ||
| <meta name="keywords" content="" /> | ||
| <meta name="author" content="Dan Stewart" /> | ||
|
|
||
| <title>Custom Wordle</title> | ||
| <title>Custom Wordle</title> | ||
|
|
||
| <link rel="apple-touch-icon" sizes="180x180" href="image/apple-touch-icon.png"> | ||
| <link rel="icon" type="image/png" sizes="32x32" href="image/favicon-32x32.png"> | ||
| <link rel="icon" type="image/png" sizes="16x16" href="image/favicon-16x16.png"> | ||
| <link rel="apple-touch-icon" sizes="180x180" href="image/apple-touch-icon.png" /> | ||
| <link rel="icon" type="image/png" sizes="32x32" href="image/favicon-32x32.png" /> | ||
| <link rel="icon" type="image/png" sizes="16x16" href="image/favicon-16x16.png" /> | ||
|
|
||
| <link rel="stylesheet" href="https://unpkg.com/chota@latest"> | ||
| <link rel="stylesheet" href="./css/main.css"> | ||
| <link rel="stylesheet" href="https://unpkg.com/chota@latest" /> | ||
| <link rel="stylesheet" href="./css/main.css" /> | ||
|
|
||
| <script type="module" src="./build/js/index.js"></script> | ||
| <script type="module" src="./build/js/index.js"></script> | ||
|
|
||
| <script defer data-domain="wordle.danstewart.xyz" src="https://stats.danstewart.xyz/js/plausible.js"></script> | ||
| </head> | ||
| <script defer data-domain="wordle.danstewart.xyz" src="https://stats.danstewart.xyz/js/plausible.js"></script> | ||
| </head> | ||
|
|
||
| <body> | ||
| <div class="container"> | ||
| <div class="text-center"> | ||
| <h1><a id="header" href="/">Custom Wordle</a></h1> | ||
| <a class="icon" href="https://github.com/danstewart/custom-wordle"> | ||
| <img src="https://icongr.am/entypo/github.svg?size=32&color=ffffff"> | ||
| </a> | ||
| <a class="icon" href="https://twitter.com/danstewart_/"> | ||
| <img src="https://icongr.am/entypo/twitter.svg?size=32&color=ffffff"> | ||
| </a> | ||
| <body> | ||
| <div class="container"> | ||
| <div class="text-center"> | ||
| <h1><a id="header" href="/">Custom Wordle</a></h1> | ||
| <a class="icon" href="https://github.com/danstewart/custom-wordle"> | ||
| <img src="https://icongr.am/entypo/github.svg?size=32&color=ffffff" /> | ||
| </a> | ||
| <a class="icon" href="https://twitter.com/danstewart_/"> | ||
| <img src="https://icongr.am/entypo/twitter.svg?size=32&color=ffffff" /> | ||
| </a> | ||
|
|
||
| <p>Welcome to Custom Wordle!</p> | ||
| <p>A clone of <a href="https://powerlanguage.co.uk/wordle/">Wordle</a> that lets you make your own games for others</p> | ||
| </div> | ||
| <p>Welcome to Custom Wordle!</p> | ||
| <p> | ||
| A clone of <a href="https://powerlanguage.co.uk/wordle/">Wordle</a> that lets you make your own games for | ||
| others | ||
| </p> | ||
| </div> | ||
|
|
||
| <div id="form" style="width: 400px; max-width: 90vw; margin-bottom: 15px;"> | ||
| <label for="word"> | ||
| Word | ||
| <input type="text" id="word" /> | ||
| </label> | ||
| <div id="form" style="width: 400px; max-width: 90vw; margin-bottom: 15px"> | ||
| <label for="word"> | ||
| Word | ||
| <input type="text" id="word" /> | ||
| </label> | ||
|
|
||
| <label for="max-tries"> | ||
| Max Tries <small>(optional)</small> | ||
| <input type="text" id="max-tries" value="6" /> | ||
| </label> | ||
| <label for="max-tries"> | ||
| Max Tries <small>(optional)</small> | ||
| <input type="text" id="max-tries" value="6" /> | ||
| </label> | ||
|
|
||
| <label for="hint"> | ||
| Hint <small>(optional)</small> | ||
| <input type="text" id="hint" /> | ||
| </label> | ||
| <label for="hint"> | ||
| Hint <small>(optional)</small> | ||
| <input type="text" id="hint" /> | ||
| </label> | ||
|
|
||
| <label for="show-answer"> | ||
| Show answer on failure | ||
| <input type="checkbox" id="show-answer" /> | ||
| </label> | ||
| <label for="show-answer"> | ||
| Show answer on failure | ||
| <input type="checkbox" id="show-answer" /> | ||
| </label> | ||
|
|
||
| <div class="is-center" style="margin-top: 10px"> | ||
| <button id="create">Create Game</button> | ||
| </div> | ||
| <div class="is-center" style="margin-top: 10px"> | ||
| <button id="create">Create Game</button> | ||
| </div> | ||
|
|
||
| <div id="result" class="is-hidden" style="margin-top: 30px"> | ||
| <hr /> | ||
| <p class="text-center">OK, your game has been created!</p> | ||
| <p> | ||
| <a id="link" href="#"></a> | ||
| </p> | ||
| <div id="result" class="is-hidden" style="margin-top: 30px"> | ||
| <hr /> | ||
| <p class="text-center">OK, your game has been created!</p> | ||
| <p> | ||
| <a id="link" href="#"></a> | ||
| </p> | ||
|
|
||
| <div class="is-center"> | ||
| <button id="copy-link">Share</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="is-center"> | ||
| <button id="copy-link">Share</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <footer> | ||
| <p>Built by <a href="https://danstewart.dev">Dan Stewart</a></p> | ||
| </footer> | ||
| </body> | ||
| <footer> | ||
| <p>Built by <a href="https://danstewart.dev">Dan Stewart</a></p> | ||
| </footer> | ||
| </body> | ||
| </html> |