Add new music

SuveenE · Nov 9, 2024 · 4d04aba · 4d04aba
1 parent 2b50318
commit 4d04aba
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 2 deletions.
diff --git a/public/audio/Riptide.mp3 b/public/audio/Riptide.mp3
diff --git a/public/audio/end-of-beginning.mp3 b/public/audio/end-of-beginning.mp3
diff --git a/src/components/audioSelector.tsx b/src/components/audioSelector.tsx
@@ -8,6 +8,8 @@ interface AudioSelectorProps {
 
 const audioTracks = [
   { id: "evergeen", name: "Evergreen", file: "/audio/evergreen.mp3" },
+  { id: "riptide", name: "Riptide", file: "/audio/riptide.mp3" },
+  { id: "endofbeginning", name: "End of Beginning", file: "/audio/end-of-beginning.mp3" },
 ];
 
 export default function AudioSelector({
@@ -46,7 +48,7 @@ export default function AudioSelector({
         {audioTracks.map((track) => (
           <div
             key={track.id}
-            className={`flex flex-row gap-2 border w-[130px] mx-auto rounded-lg p-3 ${
+            className={`flex flex-row justify-between gap-2 border w-full mx-auto rounded-lg p-3 ${
               selectedAudio === track.file
                 ? "border-2 border-indigo-600 bg-indigo-50"
                 : "border-gray-200"
@@ -60,7 +62,7 @@ export default function AudioSelector({
             </button>
             <button
               onClick={() => togglePlay(track.file)}
-              className="text-sm text-indigo-600 hover:text-indigo-800"
+              className="text-sm text-indigo-600 hover:text-indigo-800 w-max"
             >
               {playingAudio === track.file ? (
                 <PauseCircleIcon />