GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2026-02-03 22:15:42 -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({
sortFn: (a, b) => {
// Sort folders first, then files by date (newest first)
const folderOrder = ["blog", "notes", "research", "careers", "archive"]
if (a.isFolder && b.isFolder) {
// Both folders: alphabetical
return a.displayName.localeCompare(b.displayName, undefined, {
numeric: true,
sensitivity: "base",
})
const aIndex = folderOrder.indexOf(a.displayName.toLowerCase())
const bIndex = folderOrder.indexOf(b.displayName.toLowerCase())
if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex
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 (b.isFolder) return 1 // Folders before files
if (a.isFolder) return -1
if (b.isFolder) return 1
// Both files: sort by date descending (newest first)
// Note: dates come from JSON as strings, need to convert to Date objects
// Files: sort by date (newest first)
const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0
const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0
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",
})
return bDate - aDate || a.displayName.localeCompare(b.displayName)
},
}),
],
@ -121,32 +113,24 @@ export const defaultListPageLayout: PageLayout = {
}),
Component.Explorer({
sortFn: (a, b) => {
// Sort folders first, then files by date (newest first)
const folderOrder = ["blog", "notes", "research", "careers", "archive"]
if (a.isFolder && b.isFolder) {
// Both folders: alphabetical
return a.displayName.localeCompare(b.displayName, undefined, {
numeric: true,
sensitivity: "base",
})
const aIndex = folderOrder.indexOf(a.displayName.toLowerCase())
const bIndex = folderOrder.indexOf(b.displayName.toLowerCase())
if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex
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 (b.isFolder) return 1 // Folders before files
if (a.isFolder) return -1
if (b.isFolder) return 1
// Both files: sort by date descending (newest first)
// Note: dates come from JSON as strings, need to convert to Date objects
// Files: sort by date (newest first)
const aDate = a.data?.date ? new Date(a.data.date).getTime() : 0
const bDate = b.data?.date ? new Date(b.data.date).getTime() : 0
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",
})
return bDate - aDate || a.displayName.localeCompare(b.displayName)
},
}),
],

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

@ -124,6 +124,12 @@ button.desktop-explorer {
color: var(--dark);
opacity: 0.75;
pointer-events: all;
transition: color 0.15s ease, opacity 0.15s ease;
&:hover {
opacity: 1;
color: var(--tertiary);
}
&.active {
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 {
display: grid;
grid-template-rows: 0fr;