keroosha/keroosha.cybergulag.today
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix(explorer): increase consistency, explicitly use font-family (#496)

Browse source 
* fix(explorer): display name for folders without `index` file

* docs(explorer): add section for folder display names

* docs(explorer): fix broken wikilink

* fix(consistency): explicitly set font + label/link fix

Use consistent styling between folders with `folderClickBehavior: "link"` and `"collapse`

* Update quartz/components/styles/explorer.scss

Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com>

* Update quartz/components/styles/explorer.scss

Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com>

---------

Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com>
This commit is contained in:
Ben Schlegel 2023-09-21 19:35:11 +02:00 • committed by GitHub
parent 8eb1554b13
commit fa69c2a565
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
docs/features/explorer.md
View file

@ -8,7 +8,7 @@ Quartz features an explorer that allows you to navigate all files and folders on
By default, it shows all folders and files on your page. To display the explorer in a different spot, you can edit the [[layout]]. By default, it shows all folders and files on your page. To display the explorer in a different spot, you can edit the [[layout]].
Display names for folders get determined by the `title` frontmatter field in `folder/index.md` (more detail in [[Authoring Content]]). If this file does not exist or does not contain frontmatter, the local folder name will be used instead. Display names for folders get determined by the `title` frontmatter field in `folder/index.md` (more detail in [[authoring content | Authoring Content]]). If this file does not exist or does not contain frontmatter, the local folder name will be used instead.
> [!info] > [!info]
> The explorer uses local storage by default to save the state of your explorer. This is done to ensure a smooth experience when navigating to different pages. > The explorer uses local storage by default to save the state of your explorer. This is done to ensure a smooth experience when navigating to different pages.

19
quartz/components/styles/explorer.scss
View file

@ -81,16 +81,17 @@ svg {
align-items: center; align-items: center;
user-select: none; user-select: none;
& li > a { & div > a {
// other selector is more specific, needs important color: var(--secondary);
color: var(--secondary) !important; font-family: var(--headerFont);
opacity: 1 !important; font-size: 0.95rem;
font-size: 1.05rem !important; font-weight: 600;
line-height: 1.5rem;
display: inline-block;
} }
& li > a:hover { & div > a:hover {
// other selector is more specific, needs important color: var(--tertiary);
color: var(--tertiary) !important;
} }
& div > button { & div > button {
@ -103,6 +104,7 @@ svg {
padding-right: 0; padding-right: 0;
display: flex; display: flex;
align-items: center; align-items: center;
font-family: var(--headerFont);
& p { & p {
font-size: 0.95rem; font-size: 0.95rem;
@ -111,7 +113,6 @@ svg {
font-weight: 600; font-weight: 600;
margin: 0; margin: 0;
line-height: 1.5rem; line-height: 1.5rem;
font-weight: bold;
pointer-events: none; pointer-events: none;
} }
} }