🌷 florilegium

quartz customization log

✽ created ✎ modified 5 min read

march 8

recently modified

added the “recently modified” section to the index. thank you to eilleen for demystifying it and writing helpful documentation…

  • note to self: you don’t have to put anything besides the first line (<!-- Queryblahblah -->) because the obsidian plugin for data serializer will generate the rest of it for ya.
<!-- QueryToSerialize: TABLE WITHOUT ID file.link as "page", file.mday as "last modified" FROM -"tags" SORT file.mtime DESC WHERE file.name != this.file.name AND file.name != "meta" AND draft != true LIMIT 8 -->
<!-- SerializedQuery: TABLE WITHOUT ID file.link as "page", file.mday as "last modified" FROM -"tags" SORT file.mtime DESC WHERE file.name != this.file.name AND file.name != "meta" AND draft != true LIMIT 8 -->
 
| page                                                              | last modified |
| ----------------------------------------------------------------- | ------------- |
| [[notes on gardening]]              | Mar 25, 2025  |
| [[florilegium to-dos]]              | Mar 25, 2025  |
| [[dead dove questionnaire]]    | Mar 25, 2025  |
| [[dataview reference]] | Mar 25, 2025  |
| [[index.md\|index]]                                               | Mar 25, 2025  |
| [[huey & maggie notes]]          | Mar 25, 2025  |
| [[the scoutmaster]]             | Mar 25, 2025  |
| [[huey-centric]]                   | Mar 25, 2025  |
<!-- SerializedQuery END -->

smaller tags on page list views

listPage.scss

.page-listing .tag-link {
	font-size: 0.7rem; // SMALLER!!!!!
}
 
.page-listing .section .tags {
	display: none; // hides tags in page list views
}
 
.page-listing .section:hover .tags {
	display: initial; // shows the tags when a row (date/title) is hovered over
	height: 1.6rem; // this is a clumsy attempt to show just the first line of tags lol. the line height of tags is 1.4rem.
	overflow: hidden; // hides all other tags
}

i want it to be completely different, damn it!

base.scss

a {
	...
	
	&:hover {
	color: #7fa6ca !important; // "blue" on hellomei/css/default
}

march 17

metadata date edits

added created/modified dates

i followed eilleen’s documentation.

Date.tsx, at the very end

export function _getDateCustom(cfg: GlobalConfiguration, data: QuartzPluginData, dateType: 'modified' | 'created'): Date | undefined {
  // Check if the dateType provided is valid
  if (dateType !== 'modified' && dateType !== 'created') {
    throw new Error(`Invalid date type '${dateType}'. Valid options are 'modified' or 'created'.`)
  }
  
  // Return the respective date based on the given dateType
  return data.dates?.[dateType]
}

ContentMeta.tsx, at the top

import { Date, getDate, _getDateCustom } from "./Date" //added _getDatecustom to the list of guys

still ContentMeta.tsx, replacing what used to be there

if (fileData.dates && fileData.slug !== "index") {
	segments.push(<>
	   ✽ created <Date date={_getDateCustom(cfg, fileData, 'created')!} locale={cfg.locale} />
	</>)
 
	// Only show the modified date if it's NOT equal to the created date
	// Extract the actual date values for comparison
	const datecreatedValue = _getDateCustom(cfg, fileData, 'created');
	const datemodifiedValue = _getDateCustom(cfg, fileData,'modified');
	// Compare the actual date values (ignoring the JSX components)
	const areDatesNotEqual = datecreatedValue?.getTime() !== datemodifiedValue?.getTime();
	if (areDatesNotEqual) {
	  segments.push(<>
		✎ modified <Date date={_getDateCustom(cfg, fileData,'modified')!} locale={cfg.locale} />
		</>
		)
	}

changed comma to a dot

contentMeta.scss

&[show-slash="true"] {
> *:not(:last-child) {
  &::after {
	content: "・";
	color: var(--darkgray);
  }
}
}

ContentMeta.ts

  • after showComma: boolean: add showSlash: boolean
  • after showComma: false,: add showSlash: true,
  • then look for <p show-comma and replace that bit with this:
<p show-slash={options.showSlash} class={classNames(displayClass, "content-meta")}> 
  {segments}
</p>

i just replaced show-comma and showComma with show-slash and showSlash because i was scared and did not know if duplicating it would kill me.

made the date color stand out :)

custom.scss

// makes dates in post metadata a brighter color
.content-meta {
  > time {
    color: var(--custombright);
    font-weight: 550;
    text-transform: lowercase;
  }
}

hid tags in popover for folders

popover.scss

  • for reasons i do not care to know, the edits i made to the tags on page list views did not apply here so lol.
.popover .page-listing .section .tags {
  display: none;
}

tinier things

  • i added a --custombright color to both the light and dark mode in theme.ts. i also added a --customblue color to only the light mode, since it looks good on both light and dark.
    • i changed the a color in base.scss to --customblue from the hashtag it was on march 8.
  • changed the page title deco from a sparkle to a flower in quartz.config.ts.
  • added some fancy bullshit to the pre, code, and checkbox-related css in base.scss.
    • code now has a little box shadow and hover animation.
    • checkboxes are blue when checked and just a slightly lighter body color when not.
  • added custom css for the color of <em> text in custom.scss.
  • made tags align right on page list views.
  • added a tag for folders within the larger folder: 📂folder (big surprise).

march 19

  • just a bunch of cosmetic stuff i usually have on my main site – smaller image widths, spacing for list items, etc.

march 23

  • added obsidian linter and turned on the YAML timestamp function so i could get accurate dates created/modified.
  • changed default sort for notes on list pages (folders, tags) to be date created. might change this again in the future!
  • added password protection following eilleen’s tutorial.

march 24

  • added some code to remove the “evil notes” folder from the explore sidebar. it still shows up in search and on tag pages, but i don’t need it to Not!
  • locked notes’ titles and tags are visible, but not content.
  • password protection does not “remember” you. i don’t now if this will frustrate me in future…

backlinks