mirror of
https://github.com/maciejpedzich/spotifyplaylistarchive.com.git
synced 2024-09-19 18:16:19 +02:00
Implement further design tweaks
This commit is contained in:
parent
764f968b2f
commit
36e538a7be
@ -40,7 +40,7 @@ const formatRetentionText = (retention: number) => {
|
|||||||
|
|
||||||
const datatablePropsToEnable = computed(() =>
|
const datatablePropsToEnable = computed(() =>
|
||||||
props.page === 'snapshot'
|
props.page === 'snapshot'
|
||||||
? { scrollable: true, scrollHeight: '500px' }
|
? {}
|
||||||
: {
|
: {
|
||||||
paginator: true,
|
paginator: true,
|
||||||
paginatorTemplate:
|
paginatorTemplate:
|
||||||
|
@ -82,8 +82,8 @@ const openSnapshotsCalendar = async ({
|
|||||||
<template>
|
<template>
|
||||||
<NuxtLayout name="centered-content">
|
<NuxtLayout name="centered-content">
|
||||||
<h1 class="m-0 md:text-5xl text-4xl">Spotify Playlist Archive</h1>
|
<h1 class="m-0 md:text-5xl text-4xl">Spotify Playlist Archive</h1>
|
||||||
<div class="flex flex-column justify-content-center text-center">
|
<div class="md:p-0 p-2 flex flex-column justify-content-center text-center">
|
||||||
<p class="text-xl text-gray-300">
|
<p class="md:mt-3 mt-2 text-lg text-gray-300">
|
||||||
Browse past versions of thousands of playlists saved over time
|
Browse past versions of thousands of playlists saved over time
|
||||||
</p>
|
</p>
|
||||||
<div class="w-full md:px-0 px-3">
|
<div class="w-full md:px-0 px-3">
|
||||||
|
@ -16,13 +16,13 @@ const tabItems = [
|
|||||||
label: 'Show statistics',
|
label: 'Show statistics',
|
||||||
icon: 'pi pi-chart-bar',
|
icon: 'pi pi-chart-bar',
|
||||||
to: `/playlists/${playlistId}/stats`
|
to: `/playlists/${playlistId}/stats`
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Compare snapshots (SOON)',
|
|
||||||
icon: 'pi pi-sort-alt',
|
|
||||||
to: `/playlists/${playlistId}/snapshots/compare`,
|
|
||||||
disabled: true
|
|
||||||
}
|
}
|
||||||
|
// {
|
||||||
|
// label: 'Compare snapshots (SOON)',
|
||||||
|
// icon: 'pi pi-sort-alt',
|
||||||
|
// to: `/playlists/${playlistId}/snapshots/compare`,
|
||||||
|
// disabled: true
|
||||||
|
// }
|
||||||
];
|
];
|
||||||
|
|
||||||
const { error, data: playlist } = await useFetch<Snapshot>(
|
const { error, data: playlist } = await useFetch<Snapshot>(
|
||||||
@ -61,7 +61,7 @@ const isNotFoundError = computed(
|
|||||||
{{ playlist.owner?.name }}
|
{{ playlist.owner?.name }}
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
</h1>
|
</h1>
|
||||||
<TabMenu class="w-full mb-4" :model="tabItems" />
|
<TabMenu class="md:w-10 w-full mb-4" :model="tabItems" />
|
||||||
<NuxtPage />
|
<NuxtPage />
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
@ -69,8 +69,6 @@ const isNotFoundError = computed(
|
|||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
:deep(ul.p-tabmenu-nav) {
|
:deep(ul.p-tabmenu-nav) {
|
||||||
margin-left: 5rem;
|
|
||||||
margin-right: 5rem;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user