display page title a bit more proudly

This commit is contained in:
liquidex 2024-02-07 13:32:47 +01:00
parent cac1084138
commit 6d887da5cd
3 changed files with 33 additions and 8 deletions

View file

@ -198,6 +198,7 @@ impl Generator {
pub struct Page { pub struct Page {
pub title: String, pub title: String,
pub breadcrumbs: String, pub breadcrumbs: String,
pub tree_path: Option<String>,
pub tree: String, pub tree: String,
} }
@ -211,6 +212,9 @@ impl Generator {
page: Page { page: Page {
title: roots.attributes.title.clone(), title: roots.attributes.title.clone(),
breadcrumbs, breadcrumbs,
tree_path: treehouse
.tree_path(parsed_tree.file_id)
.map(|s| s.to_owned()),
tree, tree,
}, },
}; };

View file

@ -313,13 +313,19 @@ th {
display: none; display: none;
} }
/* Give the logo on the top some nicer looks */ /* Style the navigation bar. */
nav { nav {
display: flex; display: flex;
align-items: center; align-items: center;
} }
nav .nav-page {
display: flex;
flex-direction: column;
}
/* Give the logo on the top some nicer looks */
nav .logo { nav .logo {
width: 48px; width: 48px;
height: 48px; height: 48px;
@ -329,6 +335,15 @@ nav .logo {
color: var(--text-color); color: var(--text-color);
} }
/* Style page titles */
h1.page-title {
--recursive-wght: 800;
margin-top: 0;
margin-bottom: 0;
margin-left: 32px;
font-size: 1.25rem;
}
/* Style emojis to be readable */ /* Style emojis to be readable */
img[is="th-emoji"] { img[is="th-emoji"] {

View file

@ -41,11 +41,17 @@
</svg> </svg>
</a> </a>
{{#if page.breadcrumbs}} <div class="nav-page">
<ol class="breadcrumbs"> {{#if page.breadcrumbs}}
{{{ page.breadcrumbs }}} <ol class="breadcrumbs">
</ol> {{{ page.breadcrumbs }}}
{{/if}} </ol>
{{/if}}
{{#if (and (ne page.title config.user.title) (ne page.title page.tree_path))}}
<h1 class="page-title">{{ page.title }}</h1>
{{/if}}
</div>
</nav> </nav>
<noscript> <noscript>