<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- CSS - Local -->
    <link rel="stylesheet" href="{{ .Site.BaseURL }}/css/index.css" />
    <link rel="stylesheet" href="{{ .Site.BaseURL }}/css/navbar.css" />
    <link rel="stylesheet" href="{{ .Site.BaseURL }}/css/tailwind.min.css" />

    {{if eq $.Site.Params.enableFontAwesome "true" }}
        <link rel="stylesheet" href="{{ .Site.BaseURL }}/fontawesome/css/all.min.css" >
    {{end}}

    <!-- CSS - Remote -->
    {{if eq $.Site.Params.enableDevicon "true" }}
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css">
    {{end}}

    <!-- Favicon -->
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

    <!-- Navbar scrolling script -->
    <script type="text/javascript">
    window.addEventListener('scroll', ()=>{
        const nav = document.querySelector('nav')
        nav.classList.toggle('onscroll', window.scrollY > 0)
    })
    </script>

    <!-- Title attribute: "Page Title | Site Title" -->
    <title>{{.Title}} | {{ $.Site.Title }}</title>
</head>
