Mobile tierlists :) (sort of)
Some checks failed
pipeline / build-and-push-images (push) Failing after 42s
pipeline / deploy (push) Has been skipped

This commit is contained in:
2024-12-21 15:26:35 +01:00
parent 59ceb24c84
commit db80ba9fe4
2 changed files with 38 additions and 6 deletions

View File

@@ -64,24 +64,42 @@ tiers.push({title: "F", data: tierFromScaledPickrate(0, 0.1)})
<div style="display: flex; min-height: 100vh; align-items: stretch; width: 100%;">
<NavBar :tierlist-list="true" />
<div style="margin-left: 10px; width: 100%; overflow-y: scroll;">
<div id="tierlist-container" style="margin-left: 10px; width: 100%; overflow-y: scroll;">
<div style="margin-left: 0px; margin-top: 20px; display: flex; margin-bottom: 30px; align-items: center">
<h1 style="margin-left: 10px; font-size: 45px; font-weight: 300;">Tierlist for</h1>
<h1 style="margin-left: 10px; font-size: 2.8rem; font-weight: 300;">Tierlist for</h1>
<NuxtImg format="webp" style="margin-left: 10px;"
width="50" height="50"
:src="LANE_IMAGES[lanePositionToIndex(lane)]" />
<h1 style="margin-left: 10px; font-size: 45px; font-weight: 300;">{{ POSITIONS_STR[lanePositionToIndex(lane)] }}</h1>
<h1 style="margin-left: 10px; font-size: 2.8rem; font-weight: 300;">{{ POSITIONS_STR[lanePositionToIndex(lane)] }}</h1>
</div>
<TierlistTier v-for="tier in tiers" :title="tier.title" :tier="tier.data" />
<TierlistChart style="margin-left: 100px; margin-right: 100px; margin-bottom: 100px; margin-top: 40px" :data="tiers" />
<TierlistChart id="chart" :data="tiers" />
</div>
</div>
</template>
<style>
<style scoped>
#chart {
margin-left: 100px;
margin-right: 100px;
margin-bottom: 100px;
margin-top: 40px
}
@media only screen and (max-width: 450px) {
#chart {
margin-left: 2px;
margin-right: 12px;
margin-bottom: 40px;
margin-top: 40px;
}
#tierlist-container {
padding-bottom: 120px;
}
}
</style>