aboutsummaryrefslogtreecommitdiff
path: root/src/_includes/partials/header.njk
blob: bf9170530d7db785daccf4a097b18cd5d9e6e022 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<header class="w-full bg-black text-yellow-500 flex flex-row md:flex-col justify-between items-center px-6 py-4">
    <nav class="w-full">
        <ul class="flex flex-col md:flex-row gap-3 md:gap-10 font-supply-regular w-full items-center text-lg md:text-xl">
            <li>
                <a href="/" class="text-lg md:text-3xl">{ indrajith.dev } </a>
            </li>
            <li class="hover:text-white"><a href="/about" id="about" class="links">About</a></li>
            <li class="hover:text-white"><a href="/posts" id="posts" class="links">Posts</a></li>
            <li class="hover:text-white"><a href="/cv" id="cv" class="links">CV</a></li>
        </ul>
        <ul class="hidden md:flex flex-row gap-10 font-supply-regular right-0 -my-8 mx-6 absolute">
            <li class="hover:text-white"><a title="Twitter" target="_blank" href="https://twitter.com/indrajithKLIS" class="links">{% feather "twitter" %}</a></li>
            <li class="hover:text-white"><a title="Github" target="_blank" href="https://github.com/cooljith91112" class="links">{% feather "github" %}</a></li>
            <li class="hover:text-white"><a title="Sourcehut" target="_blank" href="https://sr.ht/~cooljith91112/" class="links">{% feather "circle" %}</a></li>
            <li class="hover:text-white"><a title="LinkedIn" target="_blank" href="https://www.linkedin.com/in/indrajithklis/" class="links">{% feather "linkedin" %}</a></li>
            <li class="hover:text-white"><a title="Ko-Fi" target="_blank" href="https://ko-fi.com/indrajith" class="links">{% feather "coffee" %}</a></li>
            <li class="hover:text-white"><a title="RSS" target="_blank" href="/feed.xml" class="links">{% feather "rss" %}</a></li>
        </ul>
    </nav>
</header>

<script>
(function(){
    const currentLocation = location.pathname;
    const navs = ["about","posts","cv"];
    const currentNav = navs.find(nav=>currentLocation.includes(nav));
    if (currentNav) {
        document.getElementById(currentNav).parentElement.classList.add("text-white");
    }
})();
</script>