diff --git a/default_environment/stylesheet/main.css b/default_environment/stylesheet/main.css
index 77e69ec..8fb44b0 100644
--- a/default_environment/stylesheet/main.css
+++ b/default_environment/stylesheet/main.css
@@ -22,6 +22,11 @@
--table-border-color: #6a687a;
--table-odd-background-color: #0a0a0a;
--table-even-background-color: #141414;
+
+ --header-nav-regular-font-color: var(--site-text-color);
+ --header-nav-regular-background-color: var(--site-background-color);
+ --header-nav-hover-font-color: var(--site-background-color);
+ --header-nav-hover-background-color: var(--site-text-color);
}
@media (prefers-color-scheme: light) {
@@ -45,6 +50,11 @@
--table-border-color: #959785;
--table-odd-background-color: #f5f5f5;
--table-even-background-color: #ebebeb;
+
+ --header-nav-regular-font-color: var(--site-text-color);
+ --header-nav-regular-background-color: var(--site-background-color);
+ --header-nav-hover-font-color: var(--site-background-color);
+ --header-nav-hover-background-color: var(--site-text-color);
}
}
@@ -72,11 +82,16 @@ body {
}
.page_header {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: stretch;
width: 100%;
max-width: var(--main-max-width);
border-bottom: 0.1rem solid var(--header-divider-color);
.home_link {
+ display: block;
font-size: 2rem;
font-weight: 600;
text-decoration: none;
@@ -86,6 +101,32 @@ body {
color: var(--site-text-color);
}
}
+
+ .header_nav_bar {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: end;
+ align-items: stretch;
+ column-gap: 1rem;
+
+ .nav_link {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-around;
+ color: var(--header-nav-regular-font-color);
+ background: var(--header-nav-regular-background-color);
+ padding: 0 0.5rem;
+ transition-property: background, color;
+ transition-duration: 0.1s;
+ transition-timing-function: ease-out;
+
+ &:hover {
+ color: var(--header-nav-hover-font-color);
+ background: var(--header-nav-hover-background-color);
+ }
+ }
+ }
}
.main_content {
diff --git a/default_environment/templates/html/page_header.dust b/default_environment/templates/html/page_header.dust
index d14af84..ecc6604 100644
--- a/default_environment/templates/html/page_header.dust
+++ b/default_environment/templates/html/page_header.dust
@@ -1,4 +1,9 @@
diff --git a/src/context/blog_post_page.rs b/src/context/blog_post_page.rs
index eb81bd9..643975c 100644
--- a/src/context/blog_post_page.rs
+++ b/src/context/blog_post_page.rs
@@ -61,6 +61,12 @@ render!(
render_context.output_file,
"",
)?),
+ Some(get_web_path(
+ render_context.config,
+ render_context.output_root_directory,
+ render_context.output_file,
+ "about_me",
+ )?),
);
let link_to_blog_post = get_web_path(
render_context.config,
diff --git a/src/context/blog_stream.rs b/src/context/blog_stream.rs
index 635575e..7844fee 100644
--- a/src/context/blog_stream.rs
+++ b/src/context/blog_stream.rs
@@ -59,6 +59,12 @@ render!(
render_context.output_file,
"",
)?),
+ Some(get_web_path(
+ render_context.config,
+ render_context.output_root_directory,
+ render_context.output_file,
+ "about_me",
+ )?),
);
let children = original
diff --git a/src/context/page.rs b/src/context/page.rs
index be4108d..f6094b8 100644
--- a/src/context/page.rs
+++ b/src/context/page.rs
@@ -40,6 +40,12 @@ render!(RenderPage, IPage, original, render_context, {
render_context.output_file,
"",
)?),
+ Some(get_web_path(
+ render_context.config,
+ render_context.output_root_directory,
+ render_context.output_file,
+ "about_me",
+ )?),
);
let link_to_blog_post = get_web_path(
render_context.config,
diff --git a/src/context/page_header.rs b/src/context/page_header.rs
index 0115e9c..d7b3596 100644
--- a/src/context/page_header.rs
+++ b/src/context/page_header.rs
@@ -7,13 +7,35 @@ use serde::Serialize;
pub(crate) struct PageHeader {
website_title: Option,
home_link: Option,
+ nav_links: Vec,
+}
+
+/// A link in the top-right of the page.
+#[derive(Debug, Serialize)]
+#[serde(tag = "type")]
+#[serde(rename = "nav_link")]
+pub(crate) struct NavLink {
+ text: Option,
+ url: Option,
}
impl PageHeader {
- pub(crate) fn new(website_title: Option, home_link: Option) -> PageHeader {
+ pub(crate) fn new(
+ website_title: Option,
+ home_link: Option,
+ about_me_link: Option,
+ ) -> PageHeader {
PageHeader {
website_title,
home_link,
+ nav_links: about_me_link
+ .map(|url| {
+ vec![NavLink {
+ text: Some("About Me".to_owned()),
+ url: Some(url),
+ }]
+ })
+ .unwrap_or_default(),
}
}
}