1 files changed, 26 insertions, 15 deletions
diff --git a/assets/css/default.css b/assets/css/default.css
index 4ec6f720..9788e9f7 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -491,30 +491,27 @@ hr {
 
 /* Description Expansion Styling*/
 #descexpansionbutton,
-#musicdescexpansionbutton {
-  display: none
+#music-desc-expansion {
+  display: none;
 }
 
-#descexpansionbutton ~ div,
-#musicdescexpansionbutton ~ div {
+#descexpansionbutton ~ div {
   overflow: hidden;
   height: 8.3em;
 }
 
-#descexpansionbutton:checked ~ div,
-#musicdescexpansionbutton:checked ~ div {
+#descexpansionbutton:checked ~ div {
   overflow: unset;
   height: 100%;
 }
 
-#descexpansionbutton ~ label,
-#musicdescexpansionbutton ~ label {
+#descexpansionbutton ~ label {
   order: 1;
   margin-top: 20px;
 }
 
 label[for="descexpansionbutton"]:hover,
-label[for="musicdescexpansionbutton"]:hover {
+label[for="music-desc-expansion"]:hover {
   cursor: pointer;
 }
 
@@ -527,8 +524,7 @@ h5,
 p,
 #descriptionWrapper,
 #description-box,
-#music-description-box,
-#musicDescriptionWrapper {
+#music-description-box {
   unicode-bidi: plaintext;
   text-align: start;
 }
@@ -538,12 +534,27 @@ p,
   white-space: pre-wrap;
 }
 
-#musicDescriptionWrapper {
-  max-width: 600px;
+#music-description-box {
+  display: none;
+}
+
+#music-desc-expansion:checked ~ #music-description-box {
+  display: block;
+}
+
+#music-desc-expansion ~ label > h3 > .ion-ios-arrow-up,
+#music-desc-expansion:checked ~ label > h3 > .ion-ios-arrow-down {
+  display: none;
+}
+
+#music-desc-expansion:checked ~ label > h3 > .ion-ios-arrow-up,
+#music-desc-expansion ~ label > h3 > .ion-ios-arrow-down {
+  display: inline;
 }
 
-#music-description-title {
-  margin-bottom: 0px;
+/* Select all the music items except the first one */
+.music-item + .music-item {
+  border-top: 1px solid #ffffff;
 }
 
 /* Center the "invidious" logo on the search page */