text

Kalabasa · Dec 30, 2023 · a468382 · a468382
1 parent b62bda6
commit a468382
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/src/site/music/conversations/art.jpg b/src/site/music/conversations/art.jpg
diff --git a/src/site/music/index.html b/src/site/music/index.html
@@ -22,6 +22,9 @@ <h2 class="section-title">Visualisations</h2>
     </section>
     <section class="section">
       <h2 class="section-title">Conversations EP (2017)</h2>
+      <responsive-img class="song-image" :src="url('conversations/art.jpg')" spec="195" />
+      <p><strong>Conversations</strong> is a four-piece composition of mellow beats, jazz harmony, and mild piano improvisations. Made with <text-link href="https://lmms.io/">LMMS</text-link> and Audacity.</p>
+      <p>Here are two of them:</p>
       <div class="song-card-grid">
         <song-card
           :audiosrc="url('conversations/Just wanted to know.mp3')"
@@ -109,9 +112,22 @@ <h2 class="section-title">Leftovers from the past</h2>
   }
 
   .song-card-grid {
+    clear: both;
     margin: 30px 0 0;
     display: grid;
     grid-template-columns: repeat(auto-fit, calc(min(585px, 100%)));
     gap: 30px;
   }
+
+  .song-image {
+    margin: 0 30px 30px 0;
+    border-radius: 12px;
+    width: 100%;
+    max-width: 195px;
+  }
+  @media (min-width: 600px) {
+    .song-image {
+      float: left;
+    }
+  }
 </style>