feat: separate discs in album page

+ remove tooltip markup
+ refactor css classnames

src/assets/scss/Global/basic.scss

@@ -1,14 +1,9 @@
+// TEXT
+
 .t-center {
   text-align: center;
 }
 
-.image {
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: cover;
-  transition: transform 0.3s ease-in-out;
-}
-
 .ellip {
   display: -webkit-box;
   -webkit-line-clamp: 1;
@@ -20,6 +15,24 @@
   max-width: 100%;
 }
 
+.heading {
+  font-size: 2rem;
+  font-weight: bold;
+}
+
+a {
+  text-decoration: none;
+  color: #fff;
+}
+
+.image {
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  transition: transform 0.3s ease-in-out;
+}
+
+// BORDERS
 .rounded {
   border-radius: 1rem;
 }
@@ -36,8 +49,8 @@
   border-radius: 10rem;
 }
 
-.flex {
-  display: flex;
+.border {
+  border: 1px solid $gray3;
 }
 
 .bg-primary {
@@ -45,20 +58,7 @@
   box-shadow: 0 0 1rem rgba(0, 0, 0, 0.425);
 }
 
-.border {
-  border: 1px solid $gray3;
-}
-
-.heading {
-  font-size: 2rem;
-  font-weight: bold;
-}
-
-a {
-  text-decoration: none;
-  color: #fff;
-}
-
+// BUTTONS
 button {
   border: none;
   font-size: 0.9rem !important;
@@ -99,6 +99,23 @@ button {
   width: 2.5rem;
 }
 
+
+
+// POSITION
+
+.abs {
+  position: absolute;
+}
+
+// OTHERS
+.grid {
+  display: grid;
+}
+
+.flex {
+  display: flex;
+}
+
 .separator {
   border-top: 1px $separator solid;
   color: transparent;
@@ -106,37 +123,15 @@ button {
   opacity: 0.5;
 }
 
+// NO THIS, NO THAT (OVERRIDES)
 .no-border {
   border: none;
 }
 
-.noscroll {
+.no-scroll {
   overflow: hidden;
 }
 
-.abs {
-  position: absolute;
-}
-
-.grid {
-  display: grid;
-}
-
-.card-dark {
-  background-color: #fff;
-}
-
-#tooltip {
-  background-color: $darkestblue;
-  border-radius: $smaller;
-  padding: $smaller;
-  font-size: 0.85rem;
-  visibility: hidden;
-  position: absolute;
-  z-index: 300;
-}
-
-#tooltip[data-popper-reference-hidden] {
-  visibility: hidden !important;
-  pointer-events: none;
-}
+.no-select {
+  user-select: none;
+}

src/assets/scss/_variables.scss

@@ -14,6 +14,7 @@ $large: 1.5rem;
 $larger: 2rem;
 
 $banner-height: 18rem;
+$song-item-height: 4rem;
 
 // apple human design guideline colors
 $black: #181a1c;
@@ -49,9 +50,6 @@ $playlist-card-bg: $gray4;
 
 // SVG COLORS
 $default: $accent;
-$track-btn-svg: $accent;
 $side-nav-svg: $red;
 
-
 $overshoot: cubic-bezier(0.68, -0.55, 0.265, 1.55);
-