diff options
| author | Patrick Schönberger | 2018-11-23 21:09:11 +0100 |
|---|---|---|
| committer | Patrick Schönberger | 2018-11-23 21:09:11 +0100 |
| commit | c2916cca3182c9d0d69b0c4ffc6f5fb11e9dab34 (patch) | |
| tree | 14c88ba63b06055c1da70d87e351ba4e91ea5d11 /index.html | |
| download | lolstats-c2916cca3182c9d0d69b0c4ffc6f5fb11e9dab34.tar.gz lolstats-c2916cca3182c9d0d69b0c4ffc6f5fb11e9dab34.zip | |
Initial commit
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..4543974 --- /dev/null +++ b/index.html @@ -0,0 +1,51 @@ +<!DOCTYPE html5> +<html> + <head> + <meta charset="utf-8" /> + <title>hello</title> + <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> + <link href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:700" rel="stylesheet"> + <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous"> + <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js"></script> + </head> + <body style="font-family: 'Noto Sans SC', sans-serif; overflow: hidden; background-color: black"> + <!-- Background image --> + <!-- + <img id="background" class="w3-mobile" style="transform: scale(1.1); width: 100%; height: 100%; object-fit: contain; filter: blur(10px) contrast(110%) saturate(140%)" :src="image" /> + --> + <div id="background" :style="{ + backgroundImage: 'url(' + image + ')', + transform: mobile ? 'scale(1.2)' : 'scale(1.05)', + width: '100%', + height: '100%', + filter: 'blur(10px) contrast(110%) saturate(140%)', + backgroundSize: 'cover', + backgroundPosition: 'center' + }"> + </div> + <!-- Start Screen --> + <div id="start" v-if="visible" class="w3-display-middle w3-threequarter"> + <!-- Main panel --> + <div class="w3-jumbo" style="padding: 10px; width: 100%; height: 100%; text-align: center; background-color: transparent"> + <span style="width: 100%; color: white; text-shadow: 1px 1px 40px black">Enter Your Summoner Name</span> + <div class="w3-xlarge" style="border-radius: 5px; width: 100%; background-color: white; padding: 10px; box-shadow: 1px 1px 40px black"> + <div class="w3-cell-row"> + <select class="w3-select w3-cell" style="width: 100px; height: 50px; position: relative; top: 0px; padding: 0px 0px 0px 10px; margin: 5px; text-align: center; background-color: rgb(200, 50, 50); color: white; border-radius: 5px; border: none; outline: none;"> + <option value="euw">EUW</option> + <option value="na">NA</option> + <option value="kr">KR</option> + </select> + <input v-on:keyup.enter="showNextPanel()" class="w3-input w3-cell" style="text-align: center; outline: none; margin: 5px; width: calc(100% - 230px);" type="text"> + <button v-on:click="showNextPanel()" class="w3-button w3-cell" style="position: relative; bottom:1px; vertical-align: baseline; margin: 5px; width: 100px; height: 50px; background-color: rgb(200, 50, 50); color: white; border-radius: 5px; outline: none;"><span class="fas fa-arrow-right"></span></button> + </div> + </div> + </div> + </div> + + <!-- Vue.js Script --> + <script src="script.js"></script> + <!-- Live Reload --> + <script id="reloadscript" src="{{ reload_url }}"></script> + </body> +</html> |