From a2ae5f78a7e7c16207379dff6a6554d0c0668c71 Mon Sep 17 00:00:00 2001
From: Daniel Miller <daniel@matv.io>
Date: Wed, 11 Dec 2024 04:54:15 +0000
Subject: [PATCH] Adjusted units, redundant prefixes, and other things

---
 style/song_list.scss | 199 +++++++++++++++++++++----------------------
 1 file changed, 95 insertions(+), 104 deletions(-)

diff --git a/style/song_list.scss b/style/song_list.scss
index 88904ab..6f79371 100644
--- a/style/song_list.scss
+++ b/style/song_list.scss
@@ -1,124 +1,115 @@
 table.song-list {
 	width: 100%;
 	border-collapse: collapse;
-
+  
 	tr.song-list-item {
-		border: solid;
-		border-width: 1px 0;
-		border-color: #303030;
-		position: relative;
-
-		td {
-			color: $text-controls-color;
-			white-space: nowrap;
-			padding-left: 10px;
-			padding-right: 10px;
-			
-			a {
-				text-decoration: none;
-				color: $text-controls-color;
-			}
+	  border: 1px solid #303030; /* Simplified border shorthand */
+	  position: relative;
+  
+	  td {
+		color: $text-controls-color;
+		white-space: nowrap;
+		padding: 0.6rem; /* Adjusted padding for consistency */
+  
+		a {
+		  text-decoration: none;
+		  color: $text-controls-color;
 		}
-
-		a:hover {
-			text-decoration: underline $controls-hover-color;
+	  }
+  
+	  a:hover {
+		text-decoration: underline $controls-hover-color;
+	  }
+  
+	  td.song-image {
+		width: 2.2rem; /* Replaced static px with rem */
+		display: flex;
+  
+		img.song-image {
+		  position: absolute;
+		  top: 50%;
+		  transform: translateY(-50%);
+		  width: 2.2rem; /* Adjusted to rem */
+		  height: 2.2rem; /* Adjusted to rem */
+		  border-radius: 0.3rem; /* Adjusted radius */
 		}
-		
-		td.song-image {
-			width: 35px;
-			display: flex;
-
-			img.song-image {
-				position: absolute;
-				top: 50%;
-				-ms-transform: translateY(-50%);
-				transform: translateY(-50%);
-				width: 35px;
-				height: 35px;
-				border-radius: 5px;
-			}
-
-			svg.song-image-overlay {
-				position: absolute;
-				top: 50%;
-				-ms-transform: translateY(-50%);
-				transform: translateY(-50%);
-				width: 35px;
-				height: 35px;
-				border-radius: 5px;
-				fill: $text-controls-color;
-			}
-
-			svg.song-image-overlay:hover {
-				fill: $controls-hover-color;
-			}
-
-			svg.song-image-overlay:active {
-				fill: $controls-click-color;
-			}
+  
+		svg.song-image-overlay {
+		  position: absolute;
+		  top: 50%;
+		  transform: translateY(-50%);
+		  width: 2.2rem; /* Adjusted to rem */
+		  height: 2.2rem; /* Adjusted to rem */
+		  border-radius: 0.3rem; /* Adjusted radius */
+		  fill: $text-controls-color;
 		}
-
-		td.song-list-spacer {
-			width: 20%;
+  
+		svg.song-image-overlay:hover {
+		  fill: $controls-hover-color;
 		}
-
-		td.song-list-spacer-big {
-			width: 40%;
+  
+		svg.song-image-overlay:active {
+		  fill: $controls-click-color;
 		}
-
-		button {
-			svg.hmirror {
-				-moz-transform: scale(-1, 1);
-				-webkit-transform: scale(-1, 1);
-				-o-transform: scale(-1, 1);
-				-ms-transform: scale(-1, 1);
-				transform: scale(-1, 1);
-			}
-	
-			.controlbtn {
-				color: $text-controls-color;
-			}
-	
-			.controlbtn:hover {
-				color: $controls-hover-color;
-			}
-	
-			.controlbtn:active {
-				color: $controls-click-color;
-			}
-	
-			background-color: transparent;
-			border: transparent;
+	  }
+  
+	  td.song-list-spacer {
+		width: 20%;
+	  }
+  
+	  td.song-list-spacer-big {
+		width: 40%;
+	  }
+  
+	  button {
+		svg.hmirror {
+		  transform: scale(-1, 1); /* Removed redundant prefixes */
 		}
-
-		.hide-until-hover {
-			visibility: hidden;
+  
+		.controlbtn {
+		  color: $text-controls-color;
 		}
-
-		.song-playing-overlay {
-			background-color: rgba(0, 0, 0, 0.8);
+  
+		.controlbtn:hover {
+		  color: $controls-hover-color;
 		}
+  
+		.controlbtn:active {
+		  color: $controls-click-color;
+		}
+  
+		background-color: transparent;
+		border: none; /* Simplified border */
+	  }
+  
+	  .hide-until-hover {
+		visibility: hidden;
+	  }
+  
+	  .song-playing-overlay {
+		background-color: rgba(0, 0, 0, 0.8);
+	  }
 	}
-
+  
 	tr.song-list-item:first-child {
-		border-top: none;
+	  border-top: none;
 	}
-
+  
 	tr.song-list-item:last-child {
-		border-bottom: none;
+	  border-bottom: none;
 	}
-
+  
 	tr.song-list-item:hover {
-		background-color: #303030;
-
-		.hide-until-hover {
-			visibility: visible;
-		}
-
-		td.song-image {
-			svg.song-image-overlay {
-				background-color: rgba(0, 0, 0, 0.8);
-			}
+	  background-color: #303030;
+  
+	  .hide-until-hover {
+		visibility: visible;
+	  }
+  
+	  td.song-image {
+		svg.song-image-overlay {
+		  background-color: rgba(0, 0, 0, 0.8);
 		}
+	  }
 	}
-}
+  }
\ No newline at end of file