content.html

<div class="box" id="links">
  <h2 style="margin-bottom: 15px; margin-top: 2px; color: rgb(117, 177, 255)">
    Links
  </h2>
  <a class="navlink" href="/" id="home-link">📁 Home</a>
  <br />
  <a class="navlink" href="/About/about.html" id="about-link">📁 About me</a>
  <br />
</div>
<div class="box" style="margin-top: 10px; margin-bottom: 10px">
  <b>Latest Release:</b>
  <br />
  <br />
  <a href="https://open.spotify.com/track/6owxwBYb2JUq8kW9m0IckI?si=6e7480710f9d46fb" id="songlink" target="_blank">
    <div id="musicbox">
      <img src="./images/findingadventure.jpg" alt="finding adventure album art" width="50" height="50"
        id="albumcover" />
      <span id="songname">Adventure <br />
        Awaits</span>
      <span id="artist" style="display: block">
        <small>mtch.</small>
      </span>
    </div>
  </a>
  <span style="color: gray; display: inline-block">Released 29th May</span>
  <span style="color: gray; display: inline-block">
    <small>The Jazz Hop Cafe</small>
  </span>
</div>
<div class="box centerbox" style="margin-top: 10px">
  <img src="./images/duolingo.png" class="duoicon" alt="duolingo streak fire icon" />
  <p style="display: inline" class="gradient-text">Duolingo Streak:</p>
  <br />
  <div class="boxcounter">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
  <p style="display: inline">
    days &nbsp;<img src="./images/fr.png" alt="french flag" style="
        height: 14px;
        width: 15px;
        object-position: 0px 2px;
        overflow: visible;
      " />
  </p>
</div>