fix(components)!: properly export html components

packages/components/src/index.ts

@@ -0,0 +1,7 @@
+import navarHtml from "./navbar/navbar.html";
+
+export const HTMLComponents = {
+	navbar: navarHtml,
+};
+
+export default {};

packages/components/src/navbar/navbar.html

@@ -0,0 +1 @@
+<h1>Hello World!</h1>

packages/components/src/navbar/navbar.scss

@@ -0,0 +1,42 @@
+nav {
+  width: 100%;
+}
+
+.navbar-desktop ul {
+  width: fit-content;
+  margin-left: auto;
+
+  .nav-item {
+    margin-bottom: 0;
+  }
+}
+
+ul {
+  padding: 0;
+}
+
+li > a {
+  padding: 0.25rem 0.5rem;
+}
+
+a {
+  --boder-color: transparent;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  text-decoration: none;
+
+  transition:
+    background-color 200ms,
+    color 200ms;
+}
+
+a.active {
+  border: 1px solid var(--prj-accent-bg);
+}
+
+a:hover {
+  --border-color: var(--prj-accent-bg);
+  background-color: var(--prj-accent-bg);
+  color: var(--prj-accent-text);
+  border: 1px solid var(--border-color);
+}