hugo-toha/layouts/partials/projects.html

  <!-- PROJECTS START -->
  <div class="container-fluid projects bg-dimmed anchor pb-5" id="projects">
    <h1 class="text-center">Projects</h1>

    <div class="container ml-auto text-center">
      <div class="btn-group flex-wrap" role="group" id="project-filter-buttons">
        <button type="button" class="btn btn-dark" data-filter="all">All</button>
        <button type="button" class="btn btn-dark" data-filter="professional">Professional</button>
        <button type="button" class="btn btn-dark" data-filter="academic">Academic</button>
        <button type="button" class="btn btn-dark" data-filter="hobby">Hobby</button>
      </div>
    </div>
    <div class="container filtr-projects">
      <div class="row">

        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,profess">
          <div class="card mt-1">
            <div class="card">
              <div class="card-header">
                <div class="d-flex">
                  <img class="card-img-xs" src="assets/images/logos/stash.png" alt="Card image cap" />
                  <h5 class="card-title mb-0">Stash</h5>
                </div>
                <div class="sub-title">
                  <span>Team Lead</span>
                  <span>March 2018 - Present</span>
                </div>
              </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                A tool to backup Kubernetes volumes, StatefulSet application,
                databases etc.
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,professional">
          <div class="card mt-1" data-category="professional">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/kubedb.png" alt="Card image cap" />
                <h5 class="card-title mb-0">KubeDB</h5>
              </div>
              <div class="sub-title">
                <span>Developer</span>
                <span>Jan 2019 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>KubeDB by AppsCode simplifies and automates routine database tasks such as provisioning, patching,
                backup, recovery, failure detection, and repair for various popular databases on private and public
                clouds.</p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/kubedb/cli" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star kubedb/cli">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,professional">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/kubed.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Kubed</h5>
              </div>
              <div class="sub-title">
                <span>Developer</span>
                <span>Oct 2018 - Dec 2018</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>A tool to sync Kubernetes ConfigMap, Secret across namespaces and clusters.</p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/appscode/kubed" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star appscode/kubed">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,academic">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <h5 class="card-title  mb-0">Riverine Vehicle Tracking System with Overload Detection</h5>
              </div>
              <div class="sub-title">
                <span>Owner</span>
                <span>Jan 2017 - Nov 2017</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                This project aims to develop a monitoring and overload detection system for riverine vehicles.
                Here, we have built an Ardunio based GPS tracking system, an ultrasonic sensor based overload
                detector. We have also built a mobile based user application as well as an emergency notification
                system.
              </p>
              <span class="float-right">
                <a class="btn btn-outline-info btn-sm mb-2"
                  href="https://drive.google.com/open?id=0BwCjE-AXb1mjT1ExczBuMjk1aTQ" target="#">Details</a>
              </span>
            </div>
    
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 1</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                Lorem ipsum dolor sit amet consectetur adipisicing elit. Libero velit soluta vitae rem nihil neque,
                similique repellendus, recusandae in harum rerum nisi doloremque eius debitis ex atque alias voluptatem
                ratione?
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 2</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                This is a placeholder card.
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 3</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                Yet another placeholder card.
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 4</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                This is in flex 4.
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 5</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                Lorem ipsum dolor sit, amet consectetur adipisicing elit. Expedita provident vero accusantium sed error,
                modi nisi illo commodi repellat dolor quisquam obcaecati quae enim eveniet nostrum autem ipsum qui
                molestiae!
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
  
        <div class="col-md-6 col-lg-4 p-2 filtr-item" data-category="all,hobby">
          <div class="card mt-1">
            <div class="card-header pb-1">
              <div class="d-flex">
                <img class="card-img-xs" src="assets/images/logos/project-default.png" alt="Card image cap" />
                <h5 class="card-title mb-0">Project 6</h5>
              </div>
              <div class="sub-title">
                <span>Team Lead</span>
                <span>March 2018 - Present</span>
              </div>
            </div>
            <div class="card-body text-justify pt-1 pb-1">
              <p>
                This suppose to be last card.
              </p>
              <span class="float-right">
                <a class="github-button-inactive" href="https://github.com/stashed/stash" data-icon="octicon-standard"
                  data-show-count="true" aria-label="Star stahsed/stash">Star</a>
              </span>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>
  <!-- PROJECTS END -->