somethings I don't remember

src/components/AlbumsExplorer/TopAlbums.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="top-albums">
-    <h3 class="heading">TOP ALBUMS</h3>
+    <div class="heading">TOP ALBUMS</div>
     <div class="items">
       <div class="item rounded" v-for="album in albums" :key="album">
         <div class="image rounded"></div>
         <div class="info">
           <div class="name ellip">{{ album.title }}</div>
           <div class="artist ellip">{{ album.artist }}</div>
-          <div class="seperator"></div>
+          <div class="separator"></div>
           <div class="top">
             <div class="play-icon"></div>
             <div class="text ellip">{{ album.top_track }}</div>
@@ -48,10 +48,9 @@ export default {
 
 <style lang="scss">
 .top-albums {
-  height: 13rem;
+  height: 12.5rem;
   border-radius: $small;
-  // background: linear-gradient(to bottom right, #5a1c11 60%, #110000);
-  background-color: rgb(12, 1, 1);
+  background-color: rgb(44, 42, 42);
   padding: $small;
 
   .heading {
@@ -66,7 +65,7 @@ export default {
     .item {
       height: 10rem;
       width: 100%;
-      background-color: rgb(122, 72, 5);
+      background-color: rgb(7, 6, 6);
       display: grid;
       align-items: center;
       grid-template-columns: 7.5rem 1fr;
@@ -74,11 +73,6 @@ export default {
       cursor: pointer;
       transition: all 0.2s ease-in-out;
 
-      &:hover {
-        background-color: rgba(214, 80, 39, 0.76);
-        transition: all 0.2s ease-in-out;
-      }
-
       .image {
         height: 7rem;
         width: 7rem;
@@ -97,7 +91,7 @@ export default {
 
       .info .top {
         height: 2.5rem;
-        background-color: rgb(53, 12, 12);
+        background-color: rgb(20, 46, 129);
         border-radius: $small;
         margin-left: auto;
         display: grid;
@@ -106,8 +100,6 @@ export default {
         transition: all 0.2s ease-in-out;
         user-select: none;
 
-       
-
         .play-icon {
           margin: 0 0 0 $small;
           height: 1.5rem;
@@ -124,7 +116,7 @@ export default {
         }
 
         &:hover {
-          background-color: rgb(112, 29, 29);
+          background-color: rgb(31, 68, 150);
           transition: all 0.2s ease-in-out;
 
           .play-icon {
@@ -133,9 +125,9 @@ export default {
           }
         }
 
-         &:active {
+        &:active {
           transform: scale(0.95);
-          transition: all .1s ease-in-out;
+          transition: all 0.1s ease-in-out;
         }
       }
     }