diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 76 |
1 files changed, 76 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..fa499e6 --- /dev/null +++ b/index.html @@ -0,0 +1,76 @@ +<!doctype html> +<html> + <head> + <meta charset='utf-8' lang='en'/> + <title>Interactive Tiers</title> + <link rel="stylesheet" href="/styles.css"> + <script src="/index.js" defer></script> + </head> + <body> + <div class='title'> + <label class='title-label' for='title-input'>My TierList</label> + <input type='text' id='title-input' /> + </div> + <a href='https://github.com/silverweed/tiers' class='gh-link'>GitHub</a> + <section class='main-content'> + <div class='tierlist'> + </div> + <div class='toggleable-container'> + <div class='bottom-container'> + <div class='buttons-container'> + <div class='button'> + <label for='load-img-input'> + <img src='/img/plus-circle.svg' title='Add images'/> + </label> + <input id='load-img-input' type='file' accept='image/*' multiple/> + </div> + <div class='button'> + <label for='reset-list-input'> + <img src='/img/x-circle.svg' title='Reset list'> + </label> + <input id='reset-list-input' type='button' /> + </div> + <div class='button'> + <label for='export-input'> + <img src='/img/upload.svg' title='Export'> + </label> + <input id='export-input' type='button' /> + </div> + <div class='button'> + <label for='import-input'> + <img src='/img/download.svg' title='Import Existing List'/> + </label> + <input id='import-input' type='file' accept='.json' multiple/> + </div> + <div class='button'> + <label for='export-input-html'> + <img src='/img/globe.svg' title='Export HTML'> + </label> + <input id='export-input-html' type='button' /> + </div> + </div> + <section class='images'></section> + </div> + <p class='hint'>Hint: you can paste an image into this page to have it show up in the image list.</p> + </div> + </section> + <div class="top-container"> + <img id='trash' src='/img/trash.svg' title='Delete image (drag it over here)'> + <div class='button'> + <label for='toggle-layout'> + <img src='/img/layout.svg' title='Toggle Layout'/> + </label> + <input id='toggle-layout' type='button'/> + </div> + </div> + <div id="image-modal" class="modal"> + <div class="modal-content"> + <span class="close"></span> + <img id="modal-img" src="" alt="Image preview" /> + <input id="modal-title" type="text" placeholder="Enter title here" /> + <textarea id="modal-description" placeholder="Enter description here"></textarea> + <button id="modal-save">Save</button> + </div> + </div> + </body> +</html>
\ No newline at end of file |