|
@@ -10,11 +10,11 @@
|
|
|
<slot name="sidebar" />
|
|
<slot name="sidebar" />
|
|
|
</template>
|
|
</template>
|
|
|
<template #body>
|
|
<template #body>
|
|
|
- <div v-if="!songId">
|
|
|
|
|
- <h1>No song has been selected</h1>
|
|
|
|
|
|
|
+ <div v-if="!songId" class="notice-container">
|
|
|
|
|
+ <h4>No song has been selected</h4>
|
|
|
</div>
|
|
</div>
|
|
|
- <div v-if="songId && !songDataLoaded">
|
|
|
|
|
- <h1>Song hasn't loaded yet</h1>
|
|
|
|
|
|
|
+ <div v-if="songId && !songDataLoaded" class="notice-container">
|
|
|
|
|
+ <h4>Song hasn't loaded yet</h4>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="left-section" v-show="songDataLoaded">
|
|
<div class="left-section" v-show="songDataLoaded">
|
|
|
<div class="top-section">
|
|
<div class="top-section">
|
|
@@ -1677,6 +1677,16 @@ export default {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.notice-container {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+
|
|
|
|
|
+ h4 {
|
|
|
|
|
+ margin: auto;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.left-section {
|
|
.left-section {
|
|
|
flex-basis: unset !important;
|
|
flex-basis: unset !important;
|
|
|
height: 100%;
|
|
height: 100%;
|
