refactor: replace markdown parser

- replace markdown-it with remark and rehype
- add bunch of markdown features
This commit is contained in:
Kim, Jimin 2023-07-10 10:56:09 +09:00
parent c0195e02fd
commit ae5ecaaccc
31 changed files with 912 additions and 247 deletions

View file

@ -24,11 +24,12 @@ When I was old enough to understand language, my father introduced me to my firs
At the time, it was everything I wished for and more, but little did I know,
IE was already on the decline while another browser was quietly climbing up the market share.
<p align="center">
<img alt="browser market share" src="/img/posts/linux-setup-script/browser-market-share-trend.avif" style="max-width: 100%;" />
<br />
source: <a href="https://gs.statcounter.com/browser-market-share/desktop/worldwide/#monthly-200901-202203" target="_blank">statcounter.com</a>
</p>
<figure>
<img title="browser market share" alt="browser market share" src="/img/posts/linux-setup-script/browser-market-share-trend.avif">
<figcaption>
source: <a href="https://gs.statcounter.com/browser-market-share/desktop/worldwide/#monthly-200901-202203" target="_blank">statcounter.com</a>
</figcaption>
</figure>
One day, probably after my father upgraded the PC to Windows 7,
the default browser was changed to some colorful ball looking thing.

View file

@ -15,7 +15,7 @@ This post exists to test various features such as markdown-to-html conversion, t
## Image
<img src="/icon/icon.svg" alt="developomp icon" width="100">
![alt text](/icon/icon.svg "title")
## Video
@ -51,15 +51,15 @@ This post exists to test various features such as markdown-to-html conversion, t
## Footnote
css only causes pain[^css_bad] and python is overrated[^python_is_overrated].
everyone should use tailwind[^use_tailwind] and pineapple belongs on pizza[^pineapple_pizza_truth].
## Code
Here's a `code`.
Here's a `code`. Here are color chips `#FFFFFF` `#E06C75` `#61AFEF` `#E5C07B`.
```python {7,12,14-15}
```python
print("And here's a language-specific code block")
# with comments and line highlighting!
# with comments!
x = 256
y = 256
@ -81,13 +81,58 @@ print(z is w) # False. id(z) is not equal to id(w)
>
> > nested blockquote
**bold**<br />
_italic_<br />
~~strikethrough~~<br />
<u>underlined</u><br />
==marked==<br />
this is a ^superscript^ (soon^TM^)<br />
and this is a ~subscript~ (H~2~O)
**bold**
_italic_
~~strikethrough~~
<u>underlined</u>
==marked==
=a=marked with color amber==
=b=blue==
=c=cyan==
=d=brown==
=f=fuchsia==
=g=green==
=h=hotpink==
=l=lime==
=m=magenta==
=n=navyblue==
=o=orange==
=p=purple==
=q=pink==
=r=red==
=s=silver==
=t=teal==
=v=violet==
=x=gray==
=y=yellow==.
This is a ^superscript^ (soon^TM^) and this is a ~subscript~ (H~2~O)
## Callouts & Directives
:::note
Some **content** with _Markdown_ `syntax`.
:::
:::commend
Some **content** with _Markdown_ `syntax`.
:::
:::warn
Some **content** with _Markdown_ `syntax`.
:::
:::deter
Some **content** with _Markdown_ `syntax`.
:::
:::assert
Some **content** with _Markdown_ `syntax`.
:::
:::note{title="Custom <u>title</u> using **directives**"}
Some **content** with _Markdown_ `syntax`.
:::
## CSS styling
@ -144,5 +189,5 @@ Lorem ipsum blah blah.
<!-- Footnotes -->
[^css_bad]: Based on my experience building this website, Dec 2021.
[^python_is_overrated]: Based on my infinite wisdom, Dec 2021.
[^use_tailwind]: Based on my experience building this website
[^pineapple_pizza_truth]: Based on my infinite wisdom

View file

@ -26,16 +26,12 @@ The War Brokers Mods (WBM) is a mod for the game
different aspects of the game
- [OBS overlay][overlays] - Customizable overlays for [OBS studio](https://github.com/obsproject/obs-studio)
<p align="center">
<img alt="Overlay image" src="/img/portfolio/wbm-overlays.avif" />
</p>
![Overlay image](/img/portfolio/wbm-overlays.avif "Overlay image")
- [installer][installer] - Utility for installing updating the mod. Built with [tauri][tauri],
[rust][rust], [svelte][svelte], and [tailwind css][tailwindcss].
<p align="center">
<img alt="Installer image" src="/img/portfolio/wbm-installer.avif" />
</p>
![Installer image](/img/portfolio/wbm-installer.avif "Installer image")
[mod]: https://github.com/War-Brokers-Mods/WBM
[overlays]: https://github.com/War-Brokers-Mods/WBM-Overlays