quickshell/quickshell-web
3
1
Fork 0
Code Issues Projects Activity

improve TOC style somewhat

Browse source
This commit is contained in:
outfoxxed 2025-06-08 17:40:00 -07:00
parent 415c5f56ef
commit 55e272eb2e
Signed by: outfoxxed
GPG key ID: 4C88A185FB89301E
19 changed files with 60 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/navigation/sidebars/toc/Table.tsx
View file

@ -11,15 +11,19 @@ import {
import { Heading } from "./Heading";
export const Table: Component<{
title?: string;
typeTOC?: TypeTOC;
configTOC?: ConfigTOC[];
}> = props => {
const { typeTOC, configTOC } = props;
const { title, typeTOC, configTOC } = props;
if (configTOC) {
return (
<div class="toc-content">
<p>Contents</p>
{title && <>
<p>{title}</p>
<hr/>
</>}
<For each={configTOC}>
{heading => (
<Heading

7
src/components/navigation/sidebars/toc/index.tsx
View file

@ -15,7 +15,7 @@ const TableOfContents: Component<TOCProps> = props => {
const [open, setOpen] = createSignal<boolean>(false);
const [clientWidth, setClientWidth] = createSignal<number>(0);
const [screenWidth, setScreenWidth] = createSignal<number>(0);
const { mobile, config, type } = props;
const { mobile, title, config, type } = props;
let tocRef: HTMLDivElement;
function toggle(e: MouseEvent) {
@ -27,9 +27,10 @@ const TableOfContents: Component<TOCProps> = props => {
return type ? (
<Table typeTOC={type} />
) : (
<Table configTOC={buildHierarchy(config!)} />
<Table title={title} configTOC={buildHierarchy(config!)} />
);
}
const handleClickOutside = (event: MouseEvent) => {
const isLink = "href" in (event.target || {});
const isInBody = document.body.contains(event.target as Node);
@ -97,7 +98,7 @@ const TableOfContents: Component<TOCProps> = props => {
{type ? (
<Table typeTOC={type} />
) : (
<Table configTOC={buildHierarchy(config!)} />
<Table title={title} configTOC={buildHierarchy(config!)} />
)}
</div>
</div>