switched to component ring
This commit is contained in:
parent
d2bb4222ee
commit
89a499d231
|
@ -8,11 +8,14 @@ export const sharedPageComponents: SharedLayout = {
|
|||
Component.DesktopOnly(Component.PageImage()),
|
||||
Component.Homebar(),
|
||||
],
|
||||
footer: Component.Footer({
|
||||
links: {
|
||||
"Main social profile": "https://derg.social/@ulysia",
|
||||
},
|
||||
}),
|
||||
footer: [
|
||||
Component.Footer({
|
||||
links: {
|
||||
"Main social profile": "https://derg.social/@ulysia",
|
||||
},
|
||||
}),
|
||||
Component.Rings()
|
||||
],
|
||||
}
|
||||
|
||||
// components for pages that display a single page (e.g. a single note)
|
||||
|
|
49
quartz/components/Rings.tsx
Normal file
49
quartz/components/Rings.tsx
Normal file
|
@ -0,0 +1,49 @@
|
|||
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="homebar">
|
||||
<div class="ring">
|
||||
<a href ="https://fediring.net"><h2>Fediring:</h2></a>
|
||||
<a class="ringbtn" href="https://fediring.net/previous?host=nexie.net">◄</a>
|
||||
<a class="ringbtn" href="https://fediring.net/random">Random</a>
|
||||
<a class="ringbtn" href="https://fediring.net/next?host=nexie.net">►</a>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Homebar.css = `
|
||||
.ring {
|
||||
display:flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.ringbtn {
|
||||
font-size: 0.9rem !important;
|
||||
border-radius: 16px !important;
|
||||
border:none !important;
|
||||
background-color: rgba(100,100,100, 0.3) !important;
|
||||
padding: 0.4rem 0.8rem !important;
|
||||
margin: 0.2rem 0.4rem !important;
|
||||
text-decoration: none !important;
|
||||
width: fit-content !important;
|
||||
height: fit-content !important;
|
||||
cursor:pointer !important;
|
||||
}
|
||||
|
||||
.ringbtn:hover{
|
||||
background-color: rgba(100,100,100, 0.5) !important;
|
||||
}
|
||||
|
||||
.ring svg {
|
||||
display:none !important;
|
||||
}
|
||||
`
|
||||
|
||||
export default (() => Homebar) satisfies QuartzComponentConstructor
|
|
@ -21,6 +21,7 @@ import RecentNotes from "./RecentNotes"
|
|||
import Breadcrumbs from "./Breadcrumbs"
|
||||
import PageImage from "./PageImage"
|
||||
import Homebar from "./Homebar"
|
||||
import Rings from "./Rings"
|
||||
|
||||
export {
|
||||
ArticleTitle,
|
||||
|
@ -46,4 +47,5 @@ export {
|
|||
Breadcrumbs,
|
||||
PageImage,
|
||||
Homebar,
|
||||
Rings,
|
||||
}
|
||||
|
|
|
@ -1,28 +1,3 @@
|
|||
@use "./base.scss";
|
||||
|
||||
// put your custom CSS here!
|
||||
.ring {
|
||||
display:flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.ringbtn {
|
||||
font-size: 0.9rem !important;
|
||||
border-radius: 16px !important;
|
||||
border:none !important;
|
||||
background-color: rgba(100,100,100, 0.3) !important;
|
||||
padding: 0.4rem 0.8rem !important;
|
||||
margin: 0.2rem 0.4rem !important;
|
||||
text-decoration: none !important;
|
||||
width: fit-content !important;
|
||||
height: fit-content !important;
|
||||
cursor:pointer !important;
|
||||
}
|
||||
|
||||
.ringbtn:hover{
|
||||
background-color: rgba(100,100,100, 0.5) !important;
|
||||
}
|
||||
|
||||
.ring svg {
|
||||
display:none !important;
|
||||
}
|
Loading…
Reference in a new issue