- playing around with the spotify API

Author: TobiasMue91

tools/spotify_test.html

@@ -177,29 +177,24 @@
         const card = document.createElement('div');
         card.className = 'card';
 
-        const cardInner = document.createElement('div');
-        cardInner.className = 'card-inner';
-
-        const cardFront = document.createElement('div');
-        cardFront.className = 'card-front';
-        cardFront.id = `qr-${track.id}`;
-
-        const cardBack = document.createElement('div');
-        cardBack.className = 'card-back';
-        cardBack.innerHTML = `
-        <div class="p-4">
-            <h3 class="text-xl font-bold">${track.name}</h3>
-            <p class="text-gray-600">${track.artist}</p>
-            <p class="text-gray-500 year">${track.year}</p>
-        </div>
+        // Create a container for the QR code
+        const qrContainer = document.createElement('div');
+        qrContainer.className = 'qr-container';
+        qrContainer.id = `qr-${track.id}`;
+
+        // Create the metadata section
+        const metadata = document.createElement('div');
+        metadata.className = 'metadata';
+        metadata.innerHTML = `
+        <h3 class="title">${track.name}</h3>
+        <p class="artist">${track.artist}</p>
+        <p class="year">${track.year}</p>
     `;
 
-        cardInner.appendChild(cardFront);
-        cardInner.appendChild(cardBack);
-        card.appendChild(cardInner);
+        card.appendChild(qrContainer);
+        card.appendChild(metadata);
 
-        // Create QR code with larger size
-        new QRCode(cardFront, {
+        new QRCode(qrContainer, {
             text: `https://www.gptgames.dev/tools/spotify_test.html?track=${track.id}`,
             width: 220,
             height: 220,