mirror of
https://github.com/vkaelin/LeagueStats.git
synced 2026-03-25 21:07:27 +00:00
268 lines
15 KiB
Vue
268 lines
15 KiB
Vue
<template>
|
|
<div class="mt-3 flex text-center">
|
|
<div class="w-3/12">
|
|
<div class="bg-blue-850 rounded-lg" style="width: 300px; height: 339px;">
|
|
<content-loader
|
|
:height="339"
|
|
:width="300"
|
|
:speed="2"
|
|
primary-color="#17314f"
|
|
secondary-color="#2b6cb0"
|
|
>
|
|
<rect x="94" y="18" rx="3" ry="3" width="111" height="24" />
|
|
<rect x="23" y="76" rx="3" ry="3" width="74" height="12" />
|
|
<rect x="130" y="76" rx="3" ry="3" width="34" height="12" />
|
|
<rect x="185" y="76" rx="3" ry="3" width="48" height="12" />
|
|
<rect x="246" y="76" rx="3" ry="3" width="30" height="12" />
|
|
<circle cx="40" cy="123" r="16" />
|
|
<rect x="60" y="116" rx="3" ry="3" width="49" height="13" />
|
|
<rect x="130" y="116" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="185" y="116" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="246" y="116" rx="3" ry="3" width="42" height="16" />
|
|
<circle cx="40" cy="171" r="16" />
|
|
<rect x="60" y="163" rx="3" ry="3" width="49" height="13" />
|
|
<rect x="130" y="163" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="185" y="163" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="246" y="163" rx="3" ry="3" width="42" height="16" />
|
|
<circle cx="40" cy="219" r="16" />
|
|
<rect x="60" y="212" rx="3" ry="3" width="49" height="13" />
|
|
<rect x="130" y="212" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="185" y="212" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="246" y="212" rx="3" ry="3" width="42" height="16" />
|
|
<circle cx="40" cy="267" r="16" />
|
|
<rect x="60" y="260" rx="3" ry="3" width="49" height="13" />
|
|
<rect x="130" y="260" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="185" y="260" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="246" y="260" rx="3" ry="3" width="42" height="16" />
|
|
<circle cx="40" cy="315" r="16" />
|
|
<rect x="60" y="308" rx="3" ry="3" width="49" height="13" />
|
|
<rect x="130" y="308" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="185" y="308" rx="3" ry="3" width="42" height="16" />
|
|
<rect x="246" y="308" rx="3" ry="3" width="42" height="16" />
|
|
</content-loader>
|
|
</div>
|
|
<div class="mt-4 bg-blue-850 rounded-lg" style="width: 300px; height: 828px;">
|
|
<content-loader
|
|
:height="828"
|
|
:width="300"
|
|
:speed="2"
|
|
primary-color="#17314f"
|
|
secondary-color="#2b6cb0"
|
|
>
|
|
<rect x="122" y="17" rx="3" ry="3" width="55" height="24" />
|
|
<rect x="26" y="72" rx="4" ry="4" width="8" height="51" />
|
|
<rect x="86" y="72" rx="4" ry="4" width="8" height="51" />
|
|
<rect x="146" y="72" rx="4" ry="4" width="8" height="51" />
|
|
<rect x="206" y="72" rx="4" ry="4" width="8" height="51" />
|
|
<rect x="266" y="72" rx="4" ry="4" width="8" height="51" />
|
|
<rect x="22" y="128" rx="3" ry="3" width="16" height="16" />
|
|
<rect x="82" y="128" rx="3" ry="3" width="16" height="16" />
|
|
<rect x="142" y="128" rx="3" ry="3" width="16" height="16" />
|
|
<rect x="202" y="128" rx="3" ry="3" width="16" height="16" />
|
|
<rect x="262" y="128" rx="3" ry="3" width="16" height="16" />
|
|
<rect x="14" y="182" rx="3" ry="3" width="45" height="16" />
|
|
<rect x="93" y="182" rx="3" ry="3" width="45" height="16" />
|
|
<rect x="155" y="182" rx="3" ry="3" width="58" height="16" />
|
|
<rect x="250" y="182" rx="3" ry="3" width="33" height="16" />
|
|
<rect x="14" y="212" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="93" y="212" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="168" y="212" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="212" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="237" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="93" y="237" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="168" y="237" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="237" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="262" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="93" y="262" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="168" y="262" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="262" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="287" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="93" y="287" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="168" y="287" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="287" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="312" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="93" y="312" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="168" y="312" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="312" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="337" rx="3" ry="3" width="105" height="12" />
|
|
<rect x="238" y="337" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="362" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="238" y="362" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="397" rx="3" ry="3" width="115" height="16" />
|
|
<rect x="150" y="397" rx="3" ry="3" width="65" height="16" />
|
|
<rect x="223" y="397" rx="3" ry="3" width="60" height="16" />
|
|
<rect x="14" y="427" rx="3" ry="3" width="95" height="12" />
|
|
<rect x="165" y="427" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="427" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="452" rx="3" ry="3" width="95" height="12" />
|
|
<rect x="165" y="452" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="452" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="487" rx="3" ry="3" width="115" height="16" />
|
|
<rect x="150" y="487" rx="3" ry="3" width="65" height="16" />
|
|
<rect x="223" y="487" rx="3" ry="3" width="60" height="16" />
|
|
<rect x="14" y="517" rx="3" ry="3" width="95" height="12" />
|
|
<rect x="165" y="517" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="517" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="542" rx="3" ry="3" width="95" height="12" />
|
|
<rect x="165" y="542" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="542" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="577" rx="3" ry="3" width="115" height="16" />
|
|
<rect x="150" y="577" rx="3" ry="3" width="65" height="16" />
|
|
<rect x="223" y="577" rx="3" ry="3" width="60" height="16" />
|
|
<rect x="14" y="607" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="607" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="607" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="632" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="632" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="632" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="657" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="657" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="657" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="682" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="682" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="682" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="707" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="707" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="707" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="14" y="732" rx="3" ry="3" width="50" height="12" />
|
|
<rect x="165" y="732" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="238" y="732" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="122" y="762" rx="3" ry="3" width="55" height="20" />
|
|
<rect x="115" y="789" rx="3" ry="3" width="70" height="12" />
|
|
<rect x="110" y="805" rx="3" ry="3" width="80" height="12" />
|
|
</content-loader>
|
|
</div>
|
|
|
|
<div class="mt-4 bg-blue-850 rounded-lg" style="width: 300px; height: 384px;">
|
|
<content-loader
|
|
:height="384"
|
|
:width="300"
|
|
:speed="2"
|
|
primary-color="#17314f"
|
|
secondary-color="#2b6cb0"
|
|
>
|
|
<rect x="112" y="17" rx="3" ry="3" width="75" height="24" />
|
|
<rect x="14" y="70" rx="3" ry="3" width="80" height="16" />
|
|
<rect x="150" y="70" rx="3" ry="3" width="40" height="16" />
|
|
<rect x="217" y="70" rx="3" ry="3" width="59" height="16" />
|
|
<rect x="14" y="100" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="100" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="100" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="121" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="145" y="121" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="121" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="142" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="142" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="142" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="163" rx="3" ry="3" width="115" height="12" />
|
|
<rect x="145" y="163" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="163" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="184" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="184" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="184" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="205" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="205" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="205" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="226" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="145" y="226" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="226" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="247" rx="3" ry="3" width="115" height="12" />
|
|
<rect x="145" y="247" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="247" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="268" rx="3" ry="3" width="115" height="12" />
|
|
<rect x="145" y="268" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="268" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="289" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="289" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="289" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="310" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="145" y="310" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="310" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="331" rx="3" ry="3" width="115" height="12" />
|
|
<rect x="145" y="331" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="331" rx="3" ry="3" width="65" height="12" />
|
|
<rect x="14" y="352" rx="3" ry="3" width="85" height="12" />
|
|
<rect x="145" y="352" rx="3" ry="3" width="45" height="12" />
|
|
<rect x="218" y="352" rx="3" ry="3" width="65" height="12" />
|
|
</content-loader>
|
|
</div>
|
|
</div>
|
|
<div class="w-9/12">
|
|
<div
|
|
v-for="index in 10"
|
|
:key="index"
|
|
:class="{'mt-4': index !== 1}"
|
|
class="ml-4 bg-blue-850 rounded-lg"
|
|
style="width: 884px; height: 144px;"
|
|
>
|
|
<content-loader
|
|
:height="144"
|
|
:width="884"
|
|
:speed="2"
|
|
primary-color="#17314f"
|
|
secondary-color="#2b6cb0"
|
|
>
|
|
<rect x="68" y="36" rx="8" ry="8" width="64" height="64" />
|
|
<rect x="140" y="40" rx="6" ry="6" width="24" height="24" />
|
|
<rect x="140" y="72" rx="6" ry="6" width="24" height="24" />
|
|
<rect x="206" y="46" rx="3" ry="3" width="81" height="22" />
|
|
<rect x="218" y="74" rx="3" ry="3" width="59" height="16" />
|
|
<rect x="305" y="36" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="341" y="36" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="377" y="36" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="305" y="72" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="341" y="72" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="377" y="72" rx="6" ry="6" width="32" height="32" />
|
|
<rect x="430" y="45" rx="3" ry="3" width="50" height="10" />
|
|
<rect x="430" y="60" rx="3" ry="3" width="50" height="10" />
|
|
<rect x="430" y="75" rx="3" ry="3" width="70" height="10" />
|
|
<rect x="430" y="90" rx="3" ry="3" width="70" height="10" />
|
|
<circle cx="608" cy="32" r="12" />
|
|
<circle cx="608" cy="52" r="12" />
|
|
<circle cx="608" cy="72" r="12" />
|
|
<circle cx="608" cy="92" r="12" />
|
|
<circle cx="608" cy="112" r="12" />
|
|
<circle cx="672" cy="32" r="12" />
|
|
<circle cx="672" cy="52" r="12" />
|
|
<circle cx="672" cy="72" r="12" />
|
|
<circle cx="672" cy="92" r="12" />
|
|
<circle cx="672" cy="112" r="12" />
|
|
<rect x="516" y="29" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="516" y="49" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="516" y="69" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="516" y="89" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="516" y="109" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="691" y="29" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="691" y="49" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="691" y="69" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="691" y="89" rx="3" ry="3" width="72" height="9" />
|
|
<rect x="691" y="109" rx="3" ry="3" width="72" height="9" />
|
|
<circle cx="830" cy="50" r="12" />
|
|
<rect x="800" y="66" rx="3" ry="3" width="64" height="17" />
|
|
<rect x="803" y="90" rx="3" ry="3" width="59" height="14" />
|
|
</content-loader>
|
|
</div>
|
|
<div class="mt-4 mx-auto" style="width: 135px; height: 40px;">
|
|
<content-loader
|
|
:height="40"
|
|
:width="135"
|
|
:speed="2"
|
|
primary-color="#17314f"
|
|
secondary-color="#2b6cb0"
|
|
>
|
|
<rect x="0" y="0" rx="6" ry="6" width="135" height="40" />
|
|
</content-loader>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { ContentLoader } from 'vue-content-loader'
|
|
|
|
export default {
|
|
components: {
|
|
ContentLoader
|
|
}
|
|
}
|
|
</script>
|