- revert createQRCard code

Author: TobiasMue91

tools/spotify_music_quiz_cards.html

@@ -216,11 +216,10 @@ <h2 class="text-xl font-bold mb-4 text-black dark:text-white">
 
     function createQRCard(track, isQRSide) {
         const card = document.createElement('div');
-        card.className = 'w-[6cm] h-[6cm] border border-gray-200 rounded-lg bg-white p-2.5 m-2.5 break-inside-avoid';
-
+        card.className = 'card';
         if (isQRSide) {
             const qrContainer = document.createElement('div');
-            qrContainer.className = 'flex justify-center items-center h-full';
+            qrContainer.className = 'qr-container';
             qrContainer.id = `qr-${track.id}`;
             card.appendChild(qrContainer);
             new QRCode(qrContainer, {
@@ -233,12 +232,8 @@ <h2 class="text-xl font-bold mb-4 text-black dark:text-white">
             });
         } else {
             const metadata = document.createElement('div');
-            metadata.className = 'text-center h-full flex flex-col justify-center text-black';
-            metadata.innerHTML = `
-            <h3 class="text-lg font-semibold">${track.name}</h3>
-            <p class="text-gray-600">${track.artist}</p>
-            <p class="text-2xl mt-2">${track.year}</p>
-        `;
+            metadata.className = 'metadata';
+            metadata.innerHTML = `<h3 class="title">${track.name}</h3><p class="artist">${track.artist}</p><p class="year">${track.year}</p>`;
             card.appendChild(metadata);
         }
         return card;