이 글은 nyan 테마가 코드블럭과 수식(LaTeX)을 어떻게 렌더링하는지 확인하기 위한 테스트 글입니다. (`・ω・´)
현재 이 사이트에는 Settings → Code injection 을 통해 Prism.js(코드 하이라이팅)와 KaTeX(수식)가 이미 설치되어 있습니다. 그래서 테마 쪽에서는 코드블럭을 터미널 스타일로 감싸고, 다크 배경에서도 토큰 색이 잘 보이도록 보정만 해두었습니다.
1. 코드블럭 테스트
JavaScript
// 최애를 정렬하는 함수
function sortOshi(list) {
return list
.filter((x) => x.moe > 0)
.sort((a, b) => b.moe - a.moe);
}
const team = [
{ name: "にゃんこ先生", moe: 120 },
{ name: "せんぱい", moe: 300 },
];
const result = sortOshi(team);
console.log(`최애는 ${result[0].name}!!`);
Python
from dataclasses import dataclass
from typing import List
@dataclass
class Character:
name: str
power: float
moe: float = 0.0
def power_level(chars: List[Character]) -> float:
return sum(c.power ** 2 for c in chars) ** 0.5
squad = [Character("にゃんこ", 9000, 9999), Character("せんぱい", 7500, 1200)]
print(f"총 전투력: {power_level(squad):.1f}")
Bash
#!/usr/bin/env bash
# 오늘도 덕질을 시작한다
set -euo pipefail
for i in {1..3}; do
echo "推し活 ${i} 日目: 元気!"
done
ls -la ~/2d && echo "88888888"
HTML / CSS
<div class="hero">
<span class="sticker">期間限定</span>
<p>ようこそ、二次元へ</p>
</div>
인라인 코드
인라인은 이렇게 표시됩니다: npm run dev · const moe = "∞" · git push --force-with-lease · docker compose up -d
2. LaTeX 수식 테스트
인라인 수식
질량–에너지 등가 원리는 \(E = mc^2\) 로 유명합니다. 그렇다면 '덕력'도 보존될까요? 오늘의 덕력은 \(D = \sum_{i} \frac{moe_i}{t_i}\) 로 써볼 수 있겠습니다. (단위는 물론 애정입니다.)
블록 수식
가우시안 적분은 이렇게 렌더링됩니다.
$$ \int_{-\infty}^{\infty} e^{-x^2}\,dx = \sqrt{\pi} $$
행렬과 벡터
$$ \begin{pmatrix} a & b \\ c & d \end{pmatrix} \begin{pmatrix} x \\ y \end{pmatrix} = \begin{pmatrix} ax + by \\ cx + dy \end{pmatrix} $$
정렬된 방정식
$$ \begin{aligned} \text{총 덕력} &= \sum_{i=1}^{n} \text{모에}_i \times \text{활동량}_i \\ &= \text{애정} \times \text{시간} \end{aligned} $$
급수와 극한
바젤 문제도 한번.
$$ \sum_{n=1}^{\infty} \frac{1}{n^2} = \frac{\pi^2}{6} \qquad \lim_{x \to \infty} \left(1 + \frac{1}{x}\right)^x = e $$
3. 기타 요소 테스트
「이 글은 테스트야. コードと数式、ちゃんと見える?」
리스트
- 리스트 아이템 하나
- 리스트 아이템 둘
- 중첩된 하위 항목
- 또 하나
- 리스트 아이템 셋
- 첫째, 코드블럭 확인
- 둘째, 수식 확인
- 셋째, 다크 모드 확인
표
| 항목 | 결과 |
|---|---|
| 코드블럭 | ✅ Prism 하이라이팅 |
| LaTeX | ✅ KaTeX 렌더링 |
| 인라인 코드 | ✅ 핑크 하이라이트 |
— 테스트 끝! おつかれさま♡