<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/static/css/style.css" />
<link rel="stylesheet" id="theme-target" href="{}" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="/static/js/htmx.min.js"></script>
<script src="/static/js/jquery-3.7.1.min.js"></script>
<script src="/static/js/scripts.js"></script>
</head>
<body>
<div id="root-head">
<ul class="navbar">
<li class="visually-hidden"><a href="#main-content">Skip to main content</a></li>
<li><button hx-get="/" hx-target="#main-content" hx-push-url="/">Projects</button></li>
<li><button hx-get="/contact" hx-target="#main-content" hx-push-url="/contact">Contact</button></li>
<li><button hx-get="/about" hx-target="#main-content" hx-push-url="/about">About</button></li>
<li class="right"><button id="theme-button" class="button-emoji"></button></li>
</ul>
<div id="root-body">
<div id="main-content">
{}
</div>
</div>
</div>
</body>
</html>