add one post

content/homelab/modern-unix-command/index.md

@@ -16,8 +16,12 @@ Let's say I am currently in `~/Documents/Projects/personal-blog` and I want to j
 With the classic `cd`, I will have to type the whole path.
 With `cd` aliased to `zoxide`, I only need to type `cd n` (supposing that `~/.config/nix` is the most frequently visited directory among all matched directories).
 
+![zoxide jump](zoxide-jump.png)
+
 Internally `zoxide` records my visits to directories in a SQLite database and sorts them based on frequency. If the first hit is not what I want, I can also interactively select from the matched list.
 
+![zoxide select](zoxide-select.png)
+
 ## `du` -> `ncdu`
 
 `du` is quite basic, and I usually need to add several arguments to make it somewhat usable. For example, `-d 1` to control the depth, `-h` to make the size human-readable.
@@ -25,20 +29,30 @@ Internally `zoxide` records my visits to directories in a SQLite database and so
 [`ncdu`](https://dev.yorhel.nl/ncdu) is an interactive alternative to `du`, and is very usable out of the box. Interestingly, I also feel it is a touch faster than `du`.
 It can totally be an alternative to those fancy disk space analyzers as well.
 
+![ncdu](ncdu.png)
+
 ## `top` -> `btop`
 
-`top` is quite basic and looks "unexciting". `htop` also ships with most Unix/Linux systems and looks better. 
+`top` is quite basic and looks "unexciting". `htop` also ships with most Unix/Linux systems and looks better.
+
+![htop](htop.png)
 
 [`btop`](https://github.com/aristocratos/btop) might be the most "nerdy-looking" `top` alternative out of the box. It can be a handy tool if you are trying to make people believe you are a hacker.
 
+![btop](btop.png)
+
 At the same time, it is very feature-rich and configurable. To some extent, it is also an alternative to bandwidth monitoring tools like `iftop` and disk utilization tools like `df`.
 
 ## `ls` -> `eza`
 
 I think there is nothing wrong with the classic `ls`. So, as an alternative, [`eza`](https://github.com/eza-community/eza) just has a few quality-of-life improvements, like file type icons, Git status, and (based on personal taste) prettier colors.
 
+![eza list](eza-list.png)
+
 It can replace the `tree` command as well.
 
+![eza tree](eza-tree.png)
+
 ## `vim` -> `nvim`
 
 Many people still haven't overcome the biggest `vim` challenge to this day: exit `vim` without turning off your computer.
@@ -49,3 +63,6 @@ You can simply use `vim` keybindings in many editors or IDEs. `vim` itself can f
 To put it simply, it is a TUI editor that can truly be your only text editor. With countless plugins and ways to configure it, it can be a basic text editor, or a fully-featured development IDE, or anything in-between.
 Syntax highlighting, file browser, fuzzy search, intelligent autocompletion, debugging, AI™ integration. You name it, `neovim` has it.
 
+![neovim](nvim-1.png)
+
+![neovim fuzzy search](nvim-2.png)

sass/style.scss

@@ -74,7 +74,12 @@ main {
   min-height: 60vh;
 }
 
-h1, h2, h3 {
+img {
+  max-width: 100%;
+  height: auto;
+}
+
+h1, h2, h3, h4 {
   margin: 1.5rem 0 0.75rem;
   line-height: 1.3;
 }
@@ -83,6 +88,26 @@ h1 { font-size: 1.75rem; }
 h2 { font-size: 1.4rem; }
 h3 { font-size: 1.15rem; }
 
+h2::after {
+  content: " ##";
+  color: var(--muted);
+  font-weight: normal;
+}
+
+h3::after {
+  content: " ###";
+  color: var(--muted);
+  font-weight: normal;
+}
+
+h4 { font-size: 1rem; }
+
+h4::after {
+  content: " ####";
+  color: var(--muted);
+  font-weight: normal;
+}
+
 p, ul, ol {
   margin-bottom: 1rem;
 }