{% macro about() %}
 <div class="user-details">
  <h1> My Expertise </h1>
  <p> {{ config.extra.user_description }} </p>
</div>
  <div class="user">
    <div class="tech">
      <h2>Design</h2>
      <i class="devicon-html5-plain-wordmark"></i>
      <i class="devicon-bootstrap-plain-wordmark colored"></i>
      <i class="devicon-sass-original colored"></i>
      <p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
        Vinyl XOXO lumbersexual</p>
    </div>
    <div class="tech">
      <h2>Code</h2>
      <i class="devicon-javascript-plain colored"></i>
      <i class="devicon-react-original-wordmark colored"></i>
      <i class="devicon-nodejs-plain-wordmark"></i>
      <p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
        Vinyl XOXO lumbersexual</p>
    </div>
    <div class="tech">
      <h2>Tools</h2>
      <i class="devicon-git-plain"></i>
      <i class="devicon-gulp-plain colored"></i>
      <i class="devicon-atom-original-wordmark"></i>
      <p>Mumblecore hexagon kombucha, pitchfork four loko raclette intelligentsia master cleanse.
        Vinyl XOXO lumbersexual</p>
    </div>
</div>
{% endmacro about %}

{% macro projects() %}
<div class="user-details">
  <h1> Featured Projects </h1>
</div>
<div class="user-projects">
  <div class="images-right">
    <img alt="mountains" src="{{ config.base_url ~ "/img/mountains.jpg" }}" />
  </div>
  <div class="contents">
    <h3> Project Title </h3>
    <ul>
      <li> Featured Skills</li>
    </ul>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
    <a class="project-link" href="#">Check it out</a>
  </div>
</div>
<div class="user-projects">
  <div class="images-left">
    <img alt="mountains" src="{{ config.base_url ~ "/img/skate.jpg" }}" />
  </div>
  <div class="contents-right">
    <h3> Project Title </h3>
    <ul>
      <li> Featured Skills</li>
    </ul>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
    <a class="project-link" href="#">Check it out</a>
  </div>
</div>
{% endmacro projects %}