Make CSS modular

2026-04-20 12:07:55 -05:00
parent 0cec181ec3
commit 874ec4c434
19 changed files with 734 additions and 1 deletions
--- a/public/css/audio-player.css
+++ b/public/css/audio-player.css
@@ -0,0 +1,48 @@
+.albumCover {
+	object-fit: cover;
+}
+
+.albumCover,
+.coverContainer {
+	width: var(--space-4xl);
+	height: var(--space-4xl);
+	border-radius: var(--border-radius);
+}
+
+.artist {
+	font-size: var(--meta-font-size);
+	margin-bottom: var(--space-s);
+}
+
+.captionAndPlayer {
+	display: flex;
+	flex-flow: column nowrap;
+	justify-content: space-between;
+	width: 100%;
+}
+
+.mplayer {
+	background-color: var(--card-color);
+	border-radius: var(--border-radius);
+	box-shadow: var(--box-shadow);
+	display: flex;
+	gap: var(--space-s);
+	margin: 0 0 var(--space-s) 0;
+	padding: var(--space-m);
+	width: 100%;
+}
+
+.player {
+	align-self: flex-end;
+	border-radius: var(--border-radius);
+	width: 100%;
+}
+
+.songTitle {
+	font-size: var(--step-1);
+	font-variation-settings:
+		"opsz" 50,
+		"wght" 350,
+		"SOFT" 20,
+		"WONK" 1;
+}