fix: featured version ui shifts (#1191)

This commit is contained in:
Younes 2023-06-12 00:31:18 +01:00 committed by GitHub
parent f4560bd7d8
commit 3036f43b75
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -569,34 +569,36 @@
<ChevronRightIcon class="featured-header-chevron" aria-hidden="true" /> <ChevronRightIcon class="featured-header-chevron" aria-hidden="true" />
</nuxt-link> </nuxt-link>
</div> </div>
<ClientOnly>
<NuxtLink <NuxtLink
v-for="version in featuredVersions" v-for="(version, index) in featuredVersions"
:key="version.id" :key="index"
class="featured-version button-transparent" class="featured-version button-transparent"
:to="`/${project.project_type}/${ :to="`/${project.project_type}/${
project.slug ? project.slug : project.id project.slug ? project.slug : project.id
}/version/${encodeURI(version.displayUrlEnding)}`" }/version/${encodeURI(version.displayUrlEnding)}`"
:ref_key="`featured-version-${index}`"
> >
<a <NuxtLink
v-tooltip=" v-tooltip="
version.primaryFile.filename + ' (' + $formatBytes(version.primaryFile.size) + ')' version.primaryFile.filename + ' (' + $formatBytes(version.primaryFile.size) + ')'
" "
:href="version.primaryFile.url" :to="version.primaryFile.url"
external
class="download square-button brand-button" class="download square-button brand-button"
:aria-label="`Download ${version.name}`" :aria-label="`Download ${version.name}`"
@click.stop="(event) => event.stopPropagation()"
> >
<DownloadIcon aria-hidden="true" /> <DownloadIcon aria-hidden="true" />
</a> </NuxtLink>
<div class="info"> <div class="info">
<nuxt-link <NuxtLink
:to="`/${project.project_type}/${ :to="`/${project.project_type}/${
project.slug ? project.slug : project.id project.slug ? project.slug : project.id
}/version/${encodeURI(version.displayUrlEnding)}`" }/version/${encodeURI(version.displayUrlEnding)}`"
class="top" class="top"
> >
{{ version.name }} {{ version.name }}
</nuxt-link> </NuxtLink>
<div v-if="version.game_versions.length > 0" class="game-version item"> <div v-if="version.game_versions.length > 0" class="game-version item">
{{ version.loaders.map((x) => $formatCategory(x)).join(', ') }} {{ version.loaders.map((x) => $formatCategory(x)).join(', ') }}
{{ $formatVersion(version.game_versions) }} {{ $formatVersion(version.game_versions) }}
@ -606,6 +608,7 @@
<Badge v-else-if="version.version_type === 'alpha'" type="alpha" color="red" /> <Badge v-else-if="version.version_type === 'alpha'" type="alpha" color="red" />
</div> </div>
</NuxtLink> </NuxtLink>
</ClientOnly>
<hr class="card-divider" /> <hr class="card-divider" />
</template> </template>
<h2 class="card-header">Project members</h2> <h2 class="card-header">Project members</h2>