diff --git a/sass/_theme.scss b/sass/_theme.scss
index 48324a5..3e59492 100644
--- a/sass/_theme.scss
+++ b/sass/_theme.scss
@@ -1,5 +1,6 @@
@use 'colors/catppuccin-macchiato' as dark;
@use 'colors/catppuccin-latte' as light;
+@use 'fonts';
:root {
--pink: #{light.$pink};
@@ -27,6 +28,7 @@
--mantle: #{light.$mantle};
--crust: #{light.$crust};
+ --main-width: min(700px, 95%);
--standard-border-radius: .8rem;
--text-font: "Ubuntu Nerd Font", Helvetica, sans-serif;
--title-font: "Ubuntu Nerd Font", Helvetica, sans-serif;
diff --git a/sass/parts/_navbar.scss b/sass/parts/_navbar.scss
new file mode 100644
index 0000000..c2f1af0
--- /dev/null
+++ b/sass/parts/_navbar.scss
@@ -0,0 +1,88 @@
+header {
+ background-color: var(--crust);
+ margin-bottom: 3rem;
+ ;
+}
+
+nav {
+ display: flex;
+ max-width: var(--main-width);
+ margin-left: auto;
+ margin-right: auto;
+ align-items: center;
+ justify-content: space-between;
+
+ &>div {
+ vertical-align: middle;
+
+ a {
+ text-decoration: none;
+ }
+
+ ul {
+ list-style-type: none;
+ padding: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+
+ &.nav-title,
+ &.nav-menus,
+ &.nav-widgets,
+ &>ul>li {
+ display: inline-block;
+ }
+
+ &.nav-title {
+ font-size: 2rem;
+ font-weight: 100;
+ text-transform: uppercase;
+
+ a {
+ color: var(--text);
+
+ &:visited {
+ color: var(--text);
+ }
+
+ &:hover {
+ color: var(--text);
+ }
+ }
+ }
+
+
+ &.nav-menus {
+ a {
+ color: var(--text);
+
+ &:visited {
+ color: var(--text);
+ }
+
+ &:hover {
+ color: var(--subtext0);
+ }
+ }
+
+ li {
+ list-style-type: none;
+ padding: 0;
+ margin-left: .5rem;
+ margin-right: .5rem;
+
+ }
+ }
+
+ &.nav-widgets {
+ color: var(--text);
+ font-size: 1.5rem;
+
+ li {
+ margin-left: .5rem;
+ margin-right: .5rem;
+ }
+
+ }
+ }
+}
\ No newline at end of file
diff --git a/sass/styles.scss b/sass/styles.scss
index 3e018c9..edf8206 100644
--- a/sass/styles.scss
+++ b/sass/styles.scss
@@ -4,6 +4,7 @@
@use 'parts/code';
@use 'parts/footnote';
@use 'parts/misc';
+@use 'parts/navbar';
@use 'parts/page_title';
@use 'parts/table';
@@ -24,10 +25,11 @@ body {
background-color: var(--base);
font-size: 1rem;
line-height: 1.75;
+ margin: 0;
}
article {
- max-width: min(700px, 95%);
+ max-width: var(--main-width);
margin-left: auto;
margin-right: auto;
}
@@ -88,13 +90,14 @@ a {
text-decoration-thickness: 0.01rem;
text-underline-offset: 0.3rem;
+ &:visited {
+ color: var(--lavender);
+ }
+
&:hover {
color: var(--sky);
}
- &:visited {
- color: var(--lavender);
- }
}
li {
diff --git a/templates/base.html b/templates/base.html
index c17e296..a352e12 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -12,8 +12,7 @@
-
-
+ {% include "navbar.html" %}
{% block content %} {% endblock %}
diff --git a/templates/navbar.html b/templates/navbar.html
new file mode 100644
index 0000000..8730a4e
--- /dev/null
+++ b/templates/navbar.html
@@ -0,0 +1,31 @@
+
\ No newline at end of file