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

This commit is contained in:
2024-12-06 22:17:12 +01:00
parent a624ee0134
commit 9f11ba1f52
2 changed files with 17 additions and 12 deletions

View File

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