vhaudiquet/buildpath
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Better mobile scroll
All checks were successful
pipeline / build-and-push-images (push) Successful in 35s
Details
pipeline / deploy (push) Successful in 7s
Details

Browse Source
This commit is contained in:
Valentin Haudiquet
2024-12-06 22:17:12 +01:00
parent a624ee0134
commit 9f11ba1f52
2 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/components/rune/Selector.vue
View File

@@ -62,14 +62,16 @@ function runeSelect(index: number) {
:secondaryStyleId="runes[currentlySelectedPage].secondaryStyle" :secondaryStyleId="runes[currentlySelectedPage].secondaryStyle"
:selectionIds="runes[currentlySelectedPage].selections" /> :selectionIds="runes[currentlySelectedPage].selections" />
<div style="display: flex; margin-top: 20px; justify-content: center;"> <div style="display: flex; margin-top: 20px; justify-content: center;">
<div v-for="(_, i) in runes" :class="'rune-selector-entry ' + (i == currentlySelectedPage ? 'rune-selector-entry-selected' : '')" @click="runeSelect(i)"> <div v-for="(_, i) in runes" @click="runeSelect(i)">
<div class="rs-styles-container"> <div :class="'rune-selector-entry ' + (i == currentlySelectedPage ? 'rune-selector-entry-selected' : '')">
<NuxtImg class="rs-style-img" v-if="primaryStyles[i] != null && primaryStyles[i] != undefined" <div class="rs-styles-container">
style="margin: auto;" :src="CDRAGON_BASE + mapPath(primaryStyles[i].iconPath)" /> <NuxtImg class="rs-style-img" v-if="primaryStyles[i] != null && primaryStyles[i] != undefined"
<NuxtImg class="rs-style-img" v-if="keystoneIds[i] != null && keystoneIds[i] != undefined" style="margin: auto;" :src="CDRAGON_BASE + mapPath(primaryStyles[i].iconPath)" />
width="34" :src="CDRAGON_BASE + ( mapPath(perks.get(keystoneIds[i]).iconPath))"/> <NuxtImg class="rs-style-img" v-if="keystoneIds[i] != null && keystoneIds[i] != undefined"
<NuxtImg class="rs-style-img" v-if="secondaryStyles[i] != null && secondaryStyles[i] != undefined" width="34" :src="CDRAGON_BASE + ( mapPath(perks.get(keystoneIds[i]).iconPath))"/>
style="margin: auto;" :src="CDRAGON_BASE + mapPath(secondaryStyles[i].iconPath)" /> <NuxtImg class="rs-style-img" v-if="secondaryStyles[i] != null && secondaryStyles[i] != undefined"
style="margin: auto;" :src="CDRAGON_BASE + mapPath(secondaryStyles[i].iconPath)" />
</div>
</div> </div>
<h3 class="rs-pickrate">{{ (runes[i].pickrate * 100).toFixed(2) }}% pick.</h3> <h3 class="rs-pickrate">{{ (runes[i].pickrate * 100).toFixed(2) }}% pick.</h3>
</div> </div>
@@ -100,7 +102,8 @@ function runeSelect(index: number) {
} }
.rs-pickrate { .rs-pickrate {
text-align: center; text-align: center;
margin-top: 10px; margin-top: -40px;
padding-bottom: 40px;
} }
@media only screen and (max-width: 650px) { @media only screen and (max-width: 650px) {
.rune-selector-entry { .rune-selector-entry {
@@ -114,7 +117,8 @@ function runeSelect(index: number) {
margin-top: 17px; margin-top: 17px;
} }
.rs-pickrate { .rs-pickrate {
margin-top: 20px; margin-top: 5px;
padding-bottom: 0px;
} }
.rs-style-img { .rs-style-img {
width: 24px; width: 24px;

5
frontend/pages/champion/[alias].vue
View File

@@ -60,7 +60,7 @@ function updateState(newState : string, newLane : number) {
<style> <style>
#alias-content-wrapper { #alias-content-wrapper {
display: flex; display: flex;
min-height: 100vh; /* min-height: 100vh; */
align-items: stretch; align-items: stretch;
width: 100%; width: 100%;
@@ -83,7 +83,8 @@ function updateState(newState : string, newLane : number) {
@media only screen and (max-width: 1200px) { @media only screen and (max-width: 1200px) {
#alias-content-wrapper { #alias-content-wrapper {
flex-direction: column; flex-direction: column;
margin-bottom: 120px; padding-bottom: 120px;
margin-top: 20px;
} }
} }
</style> </style>