<template>

    <nav class="navbar">
        <div class="navbar_title">
            <h1>Project List</h1>
        </div>

        <ul class="navbar_icons">
            <li><i class="fas fa-plus"></i></li>
            <li><a target="_blank" href="./index.html"><i class="fas fa-home"></i></a></li>
        </ul>

    </nav>

</template>

<script>
import Header from '@/components/Header.vue';

export default {
  components: {
    Header,
  },
}
</script>

<style>
    .navbar{
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #448ccb;
        padding-left: 40px;
        padding-right: 40px;
        
    }

    .navbar_title{
        color: #fff;
        
    }

    .navbar_icons{
        list-style: none;
        color:#fff;
        display: flex;

    }

    .navbar_icons li{
        padding: 8px 12px;
    }


</style>