GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2026-02-04 06:25:41 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: menu order, bullet points and hover

Browse Source
This commit is contained in:
ajspig 2025-12-11 15:09:14 -05:00
parent 2f28c66989
commit fef2330945
2 changed files with 37 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
quartz.layout.ts
View File

@ -51,32 +51,24 @@ export const defaultContentPageLayout: PageLayout = {
}), }),
Component.Explorer({ Component.Explorer({
sortFn: (a, b) => { sortFn: (a, b) => {
// Sort folders first, then files by date (newest first) const folderOrder = ["blog", "notes", "research", "careers", "archive"]
if (a.isFolder && b.isFolder) { if (a.isFolder && b.isFolder) {
// Both folders: alphabetical const aIndex = folderOrder.indexOf(a.displayName.toLowerCase())
return a.displayName.localeCompare(b.displayName, undefined, { const bIndex = folderOrder.indexOf(b.displayName.toLowerCase())
numeric: true, if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex
sensitivity: "base", if (aIndex !== -1) return -1
}) if (bIndex !== -1) return 1
return a.displayName.localeCompare(b.displayName)
} }
if (a.isFolder) return -1 // Folders before files if (a.isFolder) return -1
if (b.isFolder) return 1 // Folders before files if (b.isFolder) return 1
// Both files: sort by date descending (newest first) // Files: sort by date (newest first)
// Note: dates come from JSON as strings, need to convert to Date objects
const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0 const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0
const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0 const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0
return bDate - aDate || a.displayName.localeCompare(b.displayName)
if (aDate !== bDate) {
return bDate - aDate // Descending order (newest first)
}
// Same date or no dates: alphabetical fallback
return a.displayName.localeCompare(b.displayName, undefined, {
numeric: true,
sensitivity: "base",
})
}, },
}), }),
], ],
@ -121,32 +113,24 @@ export const defaultListPageLayout: PageLayout = {
}), }),
Component.Explorer({ Component.Explorer({
sortFn: (a, b) => { sortFn: (a, b) => {
// Sort folders first, then files by date (newest first) const folderOrder = ["blog", "notes", "research", "careers", "archive"]
if (a.isFolder && b.isFolder) { if (a.isFolder && b.isFolder) {
// Both folders: alphabetical const aIndex = folderOrder.indexOf(a.displayName.toLowerCase())
return a.displayName.localeCompare(b.displayName, undefined, { const bIndex = folderOrder.indexOf(b.displayName.toLowerCase())
numeric: true, if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex
sensitivity: "base", if (aIndex !== -1) return -1
}) if (bIndex !== -1) return 1
return a.displayName.localeCompare(b.displayName)
} }
if (a.isFolder) return -1 // Folders before files if (a.isFolder) return -1
if (b.isFolder) return 1 // Folders before files if (b.isFolder) return 1
// Both files: sort by date descending (newest first) // Files: sort by date (newest first)
// Note: dates come from JSON as strings, need to convert to Date objects
const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0 const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0
const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0 const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0
return bDate - aDate || a.displayName.localeCompare(b.displayName)
if (aDate !== bDate) {
return bDate - aDate // Descending order (newest first)
}
// Same date or no dates: alphabetical fallback
return a.displayName.localeCompare(b.displayName, undefined, {
numeric: true,
sensitivity: "base",
})
}, },
}), }),
], ],

13
quartz/components/styles/explorer.scss
View File

@ -124,6 +124,12 @@ button.desktop-explorer {
color: var(--dark); color: var(--dark);
opacity: 0.75; opacity: 0.75;
pointer-events: all; pointer-events: all;
transition: color 0.15s ease, opacity 0.15s ease;
&:hover {
opacity: 1;
color: var(--tertiary);
}
&.active { &.active {
opacity: 1; opacity: 1;
@ -132,6 +138,13 @@ button.desktop-explorer {
} }
} }
// Add bullet points to file items (articles) inside folders
.folder-outer > ul > li:not(:has(.folder-container)) > a::before {
content: "•";
margin-right: 6px;
color: var(--gray);
}
.folder-outer { .folder-outer {
display: grid; display: grid;
grid-template-rows: 0fr; grid-template-rows: 0fr;