fbdbe5a0Use helper for HTML class generation instead of simple `const enum`
Manual naming using `const enum` works fine. It's definitely better than using
bare string literals. However it's error-prone and difficult to maintain short class
names: even if I take care on unique prefix constraint, class names would collide inside
a namespace if the file have many class names. This problem became noticable when I
authored the `from_mdast/code.tsx`, which defines every class names for Prism tokens.
This patch frees mental overhead of carefully defining actuall class names, and
(hopefully) helps compression algorithms (e.g. gzip) to work better because of repeated
patterns after prefixes.
Shota FUJI
authored at
Shota FUJI
comitted at
48b04db3Delete unused imports
I thought it errors on `check` command since LS shows warning on unused imports.
Shota FUJI
authored at
Shota FUJI
comitted at
f81aeb55Do not fade-out document-tree and toc on non-hover environment
This effect only works when a user's primary input device is hover-capable device
(e.g. mouse, pen) or focus-navigatable device (e.g. keyboard). If a user is using
neither of those, the document-tree and toc UI is always dimmed. Or worse, a user
may think it as some kind of broken CSS.
In order to maintain legibility for non-hover environments (mostly touch-only
environments), I restricted the rule to when the primary input device is hover-capable.
This prevents the effect from running on non-hover but keyboard navigatable environemts,
such as using keyboard on touch-only device. However, as the effect is just to help
users for focusing a main content, legibility wins over it.
Shota FUJI
authored at
Shota FUJI
comitted at
49519dadImprove create/update datetime formatting, more concise and consistent
This patch reduces clutters in a datetime string and make the string more consistent
to other parts of the document.
The first and most significant problem was the datetime string is formatted using
UA's locale. The UA's locale could be different to a document's locale. This results
in inconsistent text formatting: for example, when a user viewing the page with `lang="ja"`
but UA uses "en-US", chunk of "en-US" text appears in "ja" document as a result.
The second problem is the datetime string is verbose. I can't imagine any usecase where
seconds part benefits a user (viewer).
The final problem is ugliness of the datetime string in noscript env. It's ISO-8601 string
because of timezone. I remembered that `toLocaleString` (`Intl.DateTimeFormat`) can display
timezone string, so here it is.
Even though the metadata is not properly styled and is still ugly, I'm satisfied how the
result looks good without compromising semantic markup and/or build process.
Shota FUJI
authored at
Shota FUJI
comitted at
35ce077dUse page title as a label text for Obsidian's formatting pages
With external link icons, they are no longer confusing.
This form also looks far better than bare URL.
Shota FUJI
authored at
Shota FUJI
comitted at
8526d465Style anchors using class selector, rather than type selector
Type selector, which selects all tags/elements that matches,
often causes unexpected side-effect. For example, if an internal
component includes anchor element, the default style for contents
also applys to the internal anchor, which is not desirable.
Shota FUJI
authored at
Shota FUJI
comitted at
bd077317Style syntax highlighted code block
This patch also removes annoying semi-global style for main contents.
Shota FUJI
authored at
Shota FUJI
comitted at
94b55a12Use hastscript instead of nano_jsx
The first reason for this change is tedious conversion from Markdown to components.
Since Hast does not have a concept of "Component", those needs to be converted to
custom elements first, then restored by carefully mapping the custom element nodes.
During that process, properties are transformed to HTML attributes (e.g. true -> "").
This is very error-prone and exhausting thing to write.
The second one is the quality of nano-jsx. The library is, honestly, toy-level.
Even though they promote it as "SSR First", HTML seriealization is joke: empty children
appears as `children=""`, cannot handle falsy attribute values, renders `true` attribute
value as `"true"`, etc...
Also, it's TypeScript typing is almost non-existent. Most of the exposed things are
typed as `any`. I would not call that a typed library.
While hastscript is not perfect either, it's good enough for my HTML generation usecase.
It also eliminates Mdast -> Hast -> (JSX runtime) confusing data conversion.
I choose not to write wrapper for `<Component/>` usage. It's nice, but not necessary.
In fact, normal function call is **far better** than JSX's loose and cryptic typings.
The only output changes I observed was "Module" and "Program" in "Architecture.canvas"
now overflows (thus broken in Safari). However, it's due to the new more strict CSS.
I believe it's improvement, not regression (needs to be fixed the overall JSONCanvas
stylings at some point, though).
Shota FUJI
authored at
Shota FUJI
comitted at
e635bd88Style GFM task list extension's output
The default output, which mimics GitHub's markup and styles, is horrible.
It sets `disabled` attribute that makes the element screen reader unfriendly.
Also it does not associate the text to checkbox, which is also screen reader unfriendly.
I may revisit styles in the future as the current one is not that pretty...
Shota FUJI
authored at
Shota FUJI
comitted at
49403feeFix content style having higher priority than component styles
I noticed this by seeing non-foldable callout's title being weirdly wrapped.
Shota FUJI
authored at
Shota FUJI
comitted at
9ee3d742Limit content styles only to body elements
Global styles have been a pain point.
Shota FUJI
authored at
Shota FUJI
comitted at
110d8d4eMove Hast related function inside page builder to one place
I have been felt those logics are disconnected.
Shota FUJI
authored at
Shota FUJI
comitted at