added homebar
This commit is contained in:
parent
8b5e4c56a3
commit
3195781247
|
@ -4,7 +4,9 @@ import * as Component from "./quartz/components"
|
||||||
// components shared across all pages
|
// components shared across all pages
|
||||||
export const sharedPageComponents: SharedLayout = {
|
export const sharedPageComponents: SharedLayout = {
|
||||||
head: Component.Head(),
|
head: Component.Head(),
|
||||||
header: [],
|
header: [
|
||||||
|
Component.Homebar(),
|
||||||
|
],
|
||||||
footer: Component.Footer({
|
footer: Component.Footer({
|
||||||
links: {
|
links: {
|
||||||
"Main social profile": "https://derg.social/@ulysia",
|
"Main social profile": "https://derg.social/@ulysia",
|
||||||
|
|
38
quartz/components/Homebar.tsx
Normal file
38
quartz/components/Homebar.tsx
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
import { pathToRoot } from "../util/path"
|
||||||
|
import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
|
||||||
|
import { classNames } from "../util/lang"
|
||||||
|
import { i18n } from "../i18n"
|
||||||
|
|
||||||
|
const Homebar: QuartzComponent = ({ fileData, cfg, displayClass }: QuartzComponentProps) => {
|
||||||
|
const title = cfg?.pageTitle ?? i18n(cfg.locale).propertyDefaults.title
|
||||||
|
const baseDir = pathToRoot(fileData.slug!)
|
||||||
|
return (
|
||||||
|
<div class={classNames(displayClass, "homebar")}>
|
||||||
|
<a href="/index">Home</a>
|
||||||
|
<a href="Characters">Characters</a>
|
||||||
|
<a href="Links">Where you can find me</a>
|
||||||
|
<a href="Projects">Projects</a>
|
||||||
|
<a href="Articles">Articles</a>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
Homebar.css = `
|
||||||
|
.homebar {
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
.homebar > * {
|
||||||
|
border-radius: 25%;
|
||||||
|
background-color: rgba(100,100,100, 0.3);
|
||||||
|
padding: 0.2rem 0.4rem;
|
||||||
|
margin: 0.2rem 0.4rem;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.homebar > *:hover {
|
||||||
|
background-color: rgba(100,100,100, 0.5);
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export default (() => Homebar) satisfies QuartzComponentConstructor
|
|
@ -20,6 +20,7 @@ import MobileOnly from "./MobileOnly"
|
||||||
import RecentNotes from "./RecentNotes"
|
import RecentNotes from "./RecentNotes"
|
||||||
import Breadcrumbs from "./Breadcrumbs"
|
import Breadcrumbs from "./Breadcrumbs"
|
||||||
import PageImage from "./PageImage"
|
import PageImage from "./PageImage"
|
||||||
|
import Homebar from "./Homebar"
|
||||||
|
|
||||||
export {
|
export {
|
||||||
ArticleTitle,
|
ArticleTitle,
|
||||||
|
@ -44,4 +45,5 @@ export {
|
||||||
NotFound,
|
NotFound,
|
||||||
Breadcrumbs,
|
Breadcrumbs,
|
||||||
PageImage,
|
PageImage,
|
||||||
|
Homebar,
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue