makin look nice
This commit is contained in:
@@ -230,6 +230,7 @@ button {
|
|||||||
.center-content {
|
.center-content {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-row {
|
.flex-row {
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ onMounted(() => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div v-if="fetched">
|
<div v-if="fetched" class="center-content">
|
||||||
<h2>{{ post.title }}</h2>
|
<h2>{{ post.title }}</h2>
|
||||||
<p>By: {{ post.author.username }}</p>
|
<p>By: {{ post.author.username }}</p>
|
||||||
<div>{{ post.content }}</div>
|
<div>{{ post.content }}</div>
|
||||||
|
|||||||
@@ -33,12 +33,17 @@ onMounted(() => {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<Transition name="fade" mode="out-in">
|
<Transition name="fade" mode="out-in">
|
||||||
<div v-if="fetched" :key="song" v-on:click="nextSong" class="flex-row">
|
<div
|
||||||
|
v-if="fetched"
|
||||||
|
:key="song"
|
||||||
|
v-on:click="nextSong"
|
||||||
|
class="flex-row center-content"
|
||||||
|
>
|
||||||
<img :src="song.track.album.images[0].url" />
|
<img :src="song.track.album.images[0].url" />
|
||||||
<p><strong>Song:</strong> {{ song.track.name }}</p>
|
<p><strong>Song:</strong> {{ song.track.name }}</p>
|
||||||
<p><strong>Artist:</strong> {{ song.track.artists[0].name }}</p>
|
<p><strong>Artist:</strong> {{ song.track.artists[0].name }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="flex-row">
|
<div v-else class="flex-row center-content">
|
||||||
<img src="/img/Untitled.png" />
|
<img src="/img/Untitled.png" />
|
||||||
<p>I ain't listenin to nofin rn :/</p>
|
<p>I ain't listenin to nofin rn :/</p>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user