FIX: bg black on body

assets/css/main.css

@@ -2,6 +2,10 @@
 @tailwind components;
 @tailwind utilities;
 
+body {
+  @apply bg-black;
+}
+
 .button {
   text-decoration: none;
   box-shadow: 0 8px 0 0 black;

pages/about.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-black text-white p-12 text-lg flex flex-col items-center">
+  <div class="text-white p-12 text-lg flex flex-col items-center">
     <a href="/" class="mb-12">
       <img class="logo" src="/logo.svg">
     </a>

pages/compilations/[id].vue

@@ -1,6 +1,7 @@
 <template @keydown.esc="closePlayer()">
-  <div class="bg-black text-white w-full flex items-center flex-col">
+  <div class="text-white w-full flex items-center flex-col">
-    <button class="text-sm md:text-5xl leading-none button button--close m-3 flex justify-center items-center z-50" @click="closePlayer()">
+    <button class="text-sm md:text-5xl leading-none button button--close m-3 flex justify-center items-center z-50"
+      @click="closePlayer()">
     </button>
 
     <video class="mixPlayer w-full" controls ref="mixPlayer">
@@ -42,7 +43,8 @@
 
       <p class="block mt-10">
         see artist page:<br>
-        <a target="_blank" class="underline text-orange-500 hover:text-orange-400" :href="store.getArtistById(currentTrack.artist).url">
+        <a target="_blank" class="underline text-orange-500 hover:text-orange-400"
+          :href="store.getArtistById(currentTrack.artist).url">
           {{ store.getArtistById(currentTrack.artist).name }}
         </a><br>
         purchase the track:<br>
@@ -133,10 +135,12 @@ nav > button:first-child {
 .button--close {
   position: fixed;
   right: 2vw;
+
   &:after {
     content: "\00d7";
   }
 }
+
 .button {
   text-decoration: none;
   box-shadow: 0 8px 0 0 black;

pages/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-black">
+  <div>
     <div class="w-full flex justify-center">
       <nav class="[&>*]:p-2 text-white bottom-0 right-0 fixed flex justify-center z-50">
         <a href="https://www.youtube.com/channel/UCATtFHnOLDCv8qroi2KW3ZA" target="about:blank" class="mt-1">

pages/logo.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="bg-black h-screen w-full flex justify-center p-16">
+    <div class="h-screen w-full flex justify-center p-16">
         <img src="/logo.svg">
     </div>
 </template>