portfolio/index.html

<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="manifest" href="site.webmanifest">

  <link rel="stylesheet" href="css/normalize.css">
  <!--  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css" integrity="sha256-qS+snwBgqr+iFVpBB58C9UCxKFhyL03YHpZfdNUhSEw=" crossorigin="anonymous">-->
  <link rel="stylesheet" href="./css/bulma.css">
  <script src="https://kit.fontawesome.com/655cef0f88.js" crossorigin="anonymous"></script>
  <link rel="stylesheet" href="css/main.css">


  <meta name="theme-color" content="#fafafa">
</head>

<body>
<!--[if IE]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade
  your browser</a> to improve your experience and security.</p>
<![endif]-->
<div class="columns">
  <div class="column is-5 ">
    <header class="outerSpacer backgroundGradient">
      <a href="#">
        <figure class="image is-128x128">
          <img src="img/avatar.png" class="is-rounded">
        </figure>
      </a>
      <h1 class="title">
        <strong>My name is Lucas</strong>, a student <br>
        at Aarhus University with <br>
        passion for development.
      </h1>
      <footer>
        <ul>
          <li><span class="icon"><a href="https://www.linkedin.com/in/lucas-winther/"><i class="fab fa-linkedin"></i></a></span></li>
          <li><span class="icon"><a href="mailto:lucas@lucaswinther.info"><i class="fas fa-envelope"></i></a></span></li>
          <li><span class="icon"><a href="https://github.com/StereotypicalCat"><i class="fab fa-github"></i></a></span></li>

        </ul>
      </footer>
    </header>
  </div>
  <div class="column is-6 content outerSpacer">
    <!--<h1 class="title">Software can be both fun and useful</h1>
    <p>Accumsan orci faucibus id eu lorem semper. Eu ac iaculis ac nunc nisi lorem vulputate lorem neque cubilia ac in
      adipiscing in curae lobortis tortor primis integer massa adipiscing id nisi accumsan pellentesque commodo blandit
      enim arcu non at amet id arcu magna. Accumsan orci faucibus id eu lorem semper nunc nisi lorem vulputate lorem
      neque cubilia.</p>
    <hr>
    -->
    <h1 class="subtitle">My Recent Projects</h1>

    <div class="columns">
      <div class="column is-6">
        <!-- Cards left -->
        <div class="card">
          <div class="card-image">
            <figure class="image">
              <img src="./img/monthly-expenses-header.jpg" alt="Placeholder image">
            </figure>
          </div>
          <div class="card-content">

            <div class="content">
              <h3 class="subtitle">Monthly Expenses Tracker</h3>
              <p> A table program to add monthly expenses, and keep an overview of their monthly costs in dkk. <br>
                <a href="https://en.wikipedia.org/wiki/JavaScript">#javascript</a> <a href="https://en.wikipedia.org/wiki/Web_application">#webapp</a></p>
              <div class="columns links">
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/monthly-expenses-tracker"><button class="button"><span class="icon"><i class="fab fa-github"></i></span></button></a>
                </div>
                <div class="column is-6">
                  <a href="./monthlyexpenses/index.html"><button class="button"><span class="icon"><i class="fas fa-globe"></i></span></button></a>
                </div>
              </div>
            </div>
          </div>
        </div>

      </div>
      <div class="column is-6">

        <div class="card">
          <div class="card-image">
            <figure class="image">
              <img src="./img/unity-rowing-header.jpg" alt="Placeholder image">
            </figure>
          </div>
          <div class="card-content">

            <div class="content">
              <h3 class="subtitle">Mixed-Reality Rowing Game</h3>
              <p> A fun rowing game for two people, that uses an arduino and two real oar's
                to be played<br>
                <a href="https://unity.com/">#unity</a> <a href="https://www.arduino.cc/">#arduino</a></p>
              <div class="columns links">
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/XR-Rowing-Game"><button class="button"><span class="icon"><i class="fab fa-github"></i></span></button></a>
                </div>
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/XR-Rowing-Game"><button class="button"><span class="icon"><i class="fas fa-graduation-cap"></i></span></button></a>
                </div>
              </div>
            </div>
          </div>
        </div>


      </div>
    </div>
    <div class="columns">
      <div class="column is-6">

        <div class="card">
          <div class="card-image">
            <figure class="image">
              <img src="./img/chessswap-header.png" alt="Placeholder image">
            </figure>
          </div>
          <div class="card-content">

            <div class="content">
              <h3 class="subtitle">Chessswap</h3>
              <p> Multiplayer chess, where the chess board swaps every 3 turns. Set a trap for your opponent, and win<br>
                <a href="https://reactjs.org/">#react</a> <a href="https://en.wikipedia.org/wiki/Web_application">#webapp</a></p>
              <div class="columns links">
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/ChessSwap"><button class="button"><span class="icon"><i class="fab fa-github"></i></span></button></a>
                </div>
                <div class="column is-6">
                  <a href="https://chessswap.lucaswinther.info"><button class="button"><span class="icon"><i class="fas fa-globe"></i></span></button></a>
                </div>
              </div>
            </div>
          </div>
        </div>


      </div>
      <div class="column is-6">

        <div class="card">
          <div class="card-image">
            <figure class="image">
              <img src="./img/vr-classroom-website-header.png" alt="Placeholder image">
            </figure>
          </div>
          <div class="card-content">

            <div class="content">
              <h3 class="subtitle">Vr-Classroom</h3>
              <p> A prototype website where you can register yourself, and then create + sign up for classes<br>
                <a href="https://en.wikipedia.org/wiki/JavaScript">#javascript</a> <a href="https://nodejs.org/en/">#nodejs</a></p>
              <div class="columns links">
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/vr-classroom-website-api"><button class="button"><span class="icon"><i class="fab fa-github"></i></span></button></a>
                </div>
                <div class="column is-6">
                  <a href="https://github.com/StereotypicalCat/vr-classroom-website-api"><button class="button" data-tooltip="Tooltip Texttttttttttttttt"><span class="icon"><i class="fas fa-graduation-cap"></i></span></button></a>
                </div>

              </div>
            </div>
          </div>
        </div>


      </div>
    </div>

    <div class="columns">
      <div class="column is-8 is-offset-2">
        <a href="https://github.com/StereotypicalCat" class="no-color"><button class="button block">More projects here</button></a>
      </div>
    </div>

    <div class="spacer"></div>

  </div>


</div>


<script src="js/vendor/modernizr-3.8.0.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>


</body>

</html>