Notes

Byte size tips

:where() is zero in CSS specificity

2021.11.22

TIL that :where() has 0 value in CSS specificity calculation. Today, I was trying to override anchor link’s styles from unocss-preset-typography and turned out that normal .header-anchor is not working.

Because its selector is .prose :where(a):not(.not-prose) and each selector’s specificity is:

  • .prose is 10.

  • :where(a) is 0.

  • :not(.not-prose) is 10 cuz :not takes what specificity its argument has.

Adding all values result in 20 meanwhile .header-anchor only has 10. So, I need to write .prose .header-anchor.

VitePress with Volar

2021.11.20

When using VitePress with Volar for developing a custom theme, Volar somehow doesn’t work or autocomplete for me.

Then, I searched on GitHub and found that it has been fixed in Volar v0.27.22. Also, found a tip from Volar which is

// tsconfig.json
{
  "compilerOptions": {
    "allowJs": true // for Vue + JS
  },
  "include": [".vitepress/**/*.vue"]
}

And Volar can now pick up Vue files under .vitepress directory.

Recursively delete node_modules

2021.11.10

find . -type d -name "node_modules" -exec rm -rf "{}" +
  • find - a command in Unix and Linux system.

  • . - current working directory.

  • -type d - only find directory.

  • -name "node_modules" - only find names with node_modules (case sensitive).

  • -exec - execute specified command for each located directory.

  • "{}" - replaces the located directory (if end with ;) or directories (if end with +).

  • + - find command using -exec must end with + or ;.

Different git commit emails with different git platforms

2021.09.05

We normally configure an email when using git for commits and GitHub / GitLab provides anonymous email for us. We can configure git to load respective emails based on the cloned repo path with includeIf. That includeIf takes the path to the config file as an argument.

Assuming GitHub repos are cloned in gh directory and GitLab ones are in gl:

# includeIf follows keyword `gitdir` to find `.git`
# gitdir/i is for matching directories case insensitively
# if we are in `gh`, we will load `gh.ini`
# if we are in `gl`, we will load `gl.ini`
git config --global includeIf.gitdir/i:$HOME/gh/.path $DOTFILES_PATH/gh.ini
git config --global includeIf.gitdir/i:$HOME/gl/.path $DOTFILES_PATH/gl.ini

Whereas in gh.ini and gl.ini, we add:

# gh.ini
[user]
  email = xxxxxxxx+ydcjeff@users.noreply.github.com
# gl.ini
[user]
  email = xxxxxxx-ydcjeff@users.noreply.gitlab.com

A working example can be found in my dotfiles repo.

Last Updated: