mathpix-markdown-it
Version:
Mathpix-markdown-it is an open source implementation of the mathpix-markdown spec written in Typescript. It relies on the following open source libraries: MathJax v3 (to render math with SVGs), markdown-it (for standard Markdown parsing)
562 lines (560 loc) • 2.31 MB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dynamic Flex Table with Modal</title>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: #f5f5f5;
flex-direction: column;
}
.container {
max-width: 1200px;
overflow: auto;
}
.table {
display: flex;
flex-wrap: wrap;
gap: 5px;
border: 2px solid black;
padding: 10px;
background: white;
}
.cell {
flex: 1;
font-size: 30px;
min-width: 50px;
max-width: 50px;
padding: 8px;
text-align: center;
background: lightgray;
border: 1px solid black;
cursor: pointer;
transition: background 0.2s;
flex-grow: 0;
}
.cell:hover {
background: darkgray;
}
.modal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
justify-content: center;
align-items: center;
}
.row {
display: flex;
align-items: baseline;
justify-content: left;
gap: 5px;
padding: 5px 0;
}
code {
background: #f0f0f4;
}
.modal-content {
background: white;
padding: 20px;
border-radius: 5px;
text-align: center;
position: relative;
}
.close {
position: absolute;
top: 10px;
right: 15px;
cursor: pointer;
font-size: 20px;
font-weight: bold;
}
#modal-description #setText {
text-align: left;
}
#loading.hide {
display: none;
}
</style>
</head>
<body>
<div id="loading">Loading...</div>
<div class="container">
<div id="table" class="table"></div>
</div>
<div id="modal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<h2 id="modal-title"></h2>
<p id="modal-description"></p>
</div>
</div>
<script>
const iconsData = [
{
"name": "unknown",
"textContent": "\\icon{unknown}",
"textHtml": "<div><span >�</span></div>\n",
"mathContent": "$\\icon{unknown}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.488ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1099.5 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">�</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_unknown}",
"nameColorHtml": "<div><span style=\"color: red;\">�</span></div>\n",
"colorContent": "\\icon{unknown red}",
"colorHtml": "<div><span style=\"color: red;\">�</span></div>\n"
},
{
"name": "times",
"textContent": "\\icon{times}",
"textHtml": "<div><span >×</span></div>\n",
"mathContent": "$\\icon{times}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.248ex\" height=\"1.09ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -491 993.5 482\" style=\"vertical-align: 0.02ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"D7\" d=\"M630 29Q630 9 609 9Q604 9 587 25T493 118L389 222L284 117Q178 13 175 11Q171 9 168 9Q160 9 154 15T147 29Q147 36 161 51T255 146L359 250L255 354Q174 435 161 449T147 471Q147 480 153 485T168 490Q173 490 175 489Q178 487 284 383L389 278L493 382Q570 459 587 475T609 491Q630 491 630 471Q630 464 620 453T522 355L418 250L522 145Q606 61 618 48T630 29Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_times}",
"nameColorHtml": "<div><span style=\"color: red;\">×</span></div>\n",
"colorContent": "\\icon{times red}",
"colorHtml": "<div><span style=\"color: red;\">×</span></div>\n"
},
{
"name": "bullet",
"textContent": "\\icon{bullet}",
"textHtml": "<div><span >•</span></div>\n",
"mathContent": "$\\icon{bullet}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.619ex\" height=\"0.88ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -444 715.5 389\" style=\"vertical-align: 0.124ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2022\" d=\"M55 251Q55 328 112 386T249 444T386 388T444 249Q444 171 388 113T250 55Q170 55 113 112T55 251Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_bullet}",
"nameColorHtml": "<div><span style=\"color: red;\">•</span></div>\n",
"colorContent": "\\icon{bullet red}",
"colorHtml": "<div><span style=\"color: red;\">•</span></div>\n"
},
{
"name": "reference_mark",
"textContent": "\\icon{reference_mark}",
"textHtml": "<div><span >※</span></div>\n",
"mathContent": "$\\icon{reference_mark}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.933ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 854.2 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">※</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_reference_mark}",
"nameColorHtml": "<div><span style=\"color: red;\">※</span></div>\n",
"colorContent": "\\icon{reference_mark red}",
"colorHtml": "<div><span style=\"color: red;\">※</span></div>\n"
},
{
"name": "left_arrow",
"textContent": "\\icon{left_arrow}",
"textHtml": "<div><span >←</span></div>\n",
"mathContent": "$\\icon{left_arrow}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.75ex\" height=\"1.181ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -511 1215.5 522\" style=\"vertical-align: -0.025ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2190\" d=\"M944 261T944 250T929 230H165Q167 228 182 216T211 189T244 152T277 96T303 25Q308 7 308 0Q308 -11 288 -11Q281 -11 278 -11T272 -7T267 2T263 21Q245 94 195 151T73 236Q58 242 55 247Q55 254 59 257T73 264Q121 283 158 314T215 375T247 434T264 480L267 497Q269 503 270 505T275 509T288 511Q308 511 308 500Q308 493 303 475Q293 438 278 406T246 352T215 315T185 287T165 270H929Q944 261 944 250Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_left_arrow}",
"nameColorHtml": "<div><span style=\"color: red;\">←</span></div>\n",
"colorContent": "\\icon{left_arrow red}",
"colorHtml": "<div><span style=\"color: red;\">←</span></div>\n"
},
{
"name": "up_arrow",
"textContent": "\\icon{up_arrow}",
"textHtml": "<div><span >↑</span></div>\n",
"mathContent": "$\\icon{up_arrow}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.619ex\" height=\"2.007ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -694 715.5 887\" style=\"vertical-align: -0.437ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2191\" d=\"M27 414Q17 414 17 433Q17 437 17 439T17 444T19 447T20 450T22 452T26 453T30 454T36 456Q80 467 120 494T180 549Q227 607 238 678Q240 694 251 694Q259 694 261 684Q261 677 265 659T284 608T320 549Q340 525 363 507T405 479T440 463T467 455T479 451Q483 447 483 433Q483 413 472 413Q467 413 458 416Q342 448 277 545L270 555V-179Q262 -193 252 -193H250H248Q236 -193 230 -179V555L223 545Q192 499 146 467T70 424T27 414Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_up_arrow}",
"nameColorHtml": "<div><span style=\"color: red;\">↑</span></div>\n",
"colorContent": "\\icon{up_arrow red}",
"colorHtml": "<div><span style=\"color: red;\">↑</span></div>\n"
},
{
"name": "right_arrow",
"textContent": "\\icon{right_arrow}",
"textHtml": "<div><span >→</span></div>\n",
"mathContent": "$\\icon{right_arrow}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.75ex\" height=\"1.181ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -511 1215.5 522\" style=\"vertical-align: -0.025ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2192\" d=\"M56 237T56 250T70 270H835Q719 357 692 493Q692 494 692 496T691 499Q691 511 708 511H711Q720 511 723 510T729 506T732 497T735 481T743 456Q765 389 816 336T935 261Q944 258 944 250Q944 244 939 241T915 231T877 212Q836 186 806 152T761 85T740 35T732 4Q730 -6 727 -8T711 -11Q691 -11 691 0Q691 7 696 25Q728 151 835 230H70Q56 237 56 250Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_right_arrow}",
"nameColorHtml": "<div><span style=\"color: red;\">→</span></div>\n",
"colorContent": "\\icon{right_arrow red}",
"colorHtml": "<div><span style=\"color: red;\">→</span></div>\n"
},
{
"name": "down_arrow",
"textContent": "\\icon{down_arrow}",
"textHtml": "<div><span >↓</span></div>\n",
"mathContent": "$\\icon{down_arrow}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.619ex\" height=\"2.009ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -694 715.5 888\" style=\"vertical-align: -0.439ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2193\" d=\"M473 86Q483 86 483 67Q483 63 483 61T483 56T481 53T480 50T478 48T474 47T470 46T464 44Q428 35 391 14T316 -55T264 -168Q264 -170 263 -173T262 -180T261 -184Q259 -194 251 -194Q242 -194 238 -176T221 -121T180 -49Q169 -34 155 -21T125 2T95 20T67 33T44 42T27 47L21 49Q17 53 17 67Q17 87 28 87Q33 87 42 84Q158 52 223 -45L230 -55V312Q230 391 230 482T229 591Q229 662 231 676T243 693Q244 694 251 694Q264 692 270 679V-55L277 -45Q307 1 353 33T430 76T473 86Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_down_arrow}",
"nameColorHtml": "<div><span style=\"color: red;\">↓</span></div>\n",
"colorContent": "\\icon{down_arrow red}",
"colorHtml": "<div><span style=\"color: red;\">↓</span></div>\n"
},
{
"name": "circled_one",
"textContent": "\\icon{circled_one}",
"textHtml": "<div><span >①</span></div>\n",
"mathContent": "$\\icon{circled_one}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">①</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_one}",
"nameColorHtml": "<div><span style=\"color: red;\">①</span></div>\n",
"colorContent": "\\icon{circled_one red}",
"colorHtml": "<div><span style=\"color: red;\">①</span></div>\n"
},
{
"name": "circled_two",
"textContent": "\\icon{circled_two}",
"textHtml": "<div><span >②</span></div>\n",
"mathContent": "$\\icon{circled_two}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">②</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_two}",
"nameColorHtml": "<div><span style=\"color: red;\">②</span></div>\n",
"colorContent": "\\icon{circled_two red}",
"colorHtml": "<div><span style=\"color: red;\">②</span></div>\n"
},
{
"name": "circled_three",
"textContent": "\\icon{circled_three}",
"textHtml": "<div><span >③</span></div>\n",
"mathContent": "$\\icon{circled_three}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">③</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_three}",
"nameColorHtml": "<div><span style=\"color: red;\">③</span></div>\n",
"colorContent": "\\icon{circled_three red}",
"colorHtml": "<div><span style=\"color: red;\">③</span></div>\n"
},
{
"name": "circled_four",
"textContent": "\\icon{circled_four}",
"textHtml": "<div><span >④</span></div>\n",
"mathContent": "$\\icon{circled_four}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">④</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_four}",
"nameColorHtml": "<div><span style=\"color: red;\">④</span></div>\n",
"colorContent": "\\icon{circled_four red}",
"colorHtml": "<div><span style=\"color: red;\">④</span></div>\n"
},
{
"name": "circled_five",
"textContent": "\\icon{circled_five}",
"textHtml": "<div><span >⑤</span></div>\n",
"mathContent": "$\\icon{circled_five}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⑤</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_five}",
"nameColorHtml": "<div><span style=\"color: red;\">⑤</span></div>\n",
"colorContent": "\\icon{circled_five red}",
"colorHtml": "<div><span style=\"color: red;\">⑤</span></div>\n"
},
{
"name": "circled_six",
"textContent": "\\icon{circled_six}",
"textHtml": "<div><span >⑥</span></div>\n",
"mathContent": "$\\icon{circled_six}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⑥</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_six}",
"nameColorHtml": "<div><span style=\"color: red;\">⑥</span></div>\n",
"colorContent": "\\icon{circled_six red}",
"colorHtml": "<div><span style=\"color: red;\">⑥</span></div>\n"
},
{
"name": "circled_seven",
"textContent": "\\icon{circled_seven}",
"textHtml": "<div><span >⑦</span></div>\n",
"mathContent": "$\\icon{circled_seven}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⑦</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_seven}",
"nameColorHtml": "<div><span style=\"color: red;\">⑦</span></div>\n",
"colorContent": "\\icon{circled_seven red}",
"colorHtml": "<div><span style=\"color: red;\">⑦</span></div>\n"
},
{
"name": "circled_eight",
"textContent": "\\icon{circled_eight}",
"textHtml": "<div><span >⑧</span></div>\n",
"mathContent": "$\\icon{circled_eight}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⑧</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_eight}",
"nameColorHtml": "<div><span style=\"color: red;\">⑧</span></div>\n",
"colorContent": "\\icon{circled_eight red}",
"colorHtml": "<div><span style=\"color: red;\">⑧</span></div>\n"
},
{
"name": "circled_nine",
"textContent": "\\icon{circled_nine}",
"textHtml": "<div><span >⑨</span></div>\n",
"mathContent": "$\\icon{circled_nine}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⑨</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_nine}",
"nameColorHtml": "<div><span style=\"color: red;\">⑨</span></div>\n",
"colorContent": "\\icon{circled_nine red}",
"colorHtml": "<div><span style=\"color: red;\">⑨</span></div>\n"
},
{
"name": "circled_zero",
"textContent": "\\icon{circled_zero}",
"textHtml": "<div><span >⓪</span></div>\n",
"mathContent": "$\\icon{circled_zero}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⓪</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_zero}",
"nameColorHtml": "<div><span style=\"color: red;\">⓪</span></div>\n",
"colorContent": "\\icon{circled_zero red}",
"colorHtml": "<div><span style=\"color: red;\">⓪</span></div>\n"
},
{
"name": "black_square",
"textContent": "\\icon{black_square}",
"textHtml": "<div><span >■</span></div>\n",
"mathContent": "$\\icon{black_square}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.248ex\" height=\"1.559ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -689 993.5 689\" style=\"vertical-align: 0px;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25A0\" d=\"M71 0Q59 4 55 16V346L56 676Q64 686 70 689H709Q719 681 722 674V15Q719 10 709 1L390 0H71Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_square}",
"nameColorHtml": "<div><span style=\"color: red;\">■</span></div>\n",
"colorContent": "\\icon{black_square red}",
"colorHtml": "<div><span style=\"color: red;\">■</span></div>\n"
},
{
"name": "black_triangle",
"textContent": "\\icon{black_triangle}",
"textHtml": "<div><span >▲</span></div>\n",
"mathContent": "$\\icon{black_triangle}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.121ex\" height=\"1.346ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -575 937.5 595\" style=\"vertical-align: -0.045ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25B2\" d=\"M99 -20Q84 -11 84 0Q84 5 148 145T278 424L342 563Q347 575 360 575Q368 575 375 570Q376 569 441 430T571 148T637 0Q637 -11 622 -20H99Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle}",
"nameColorHtml": "<div><span style=\"color: red;\">▲</span></div>\n",
"colorContent": "\\icon{black_triangle red}",
"colorHtml": "<div><span style=\"color: red;\">▲</span></div>\n"
},
{
"name": "black_triangle_down",
"textContent": "\\icon{black_triangle_down}",
"textHtml": "<div><span >▼</span></div>\n",
"mathContent": "$\\icon{black_triangle_down}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.121ex\" height=\"1.346ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -576 937.5 595\" style=\"vertical-align: -0.043ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25BC\" d=\"M84 556Q84 567 99 576H622Q637 567 637 556Q637 551 572 409T441 127T375 -14Q368 -19 360 -19H358Q349 -19 342 -7T296 92Q249 193 211 275Q84 550 84 556Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_down}",
"nameColorHtml": "<div><span style=\"color: red;\">▼</span></div>\n",
"colorContent": "\\icon{black_triangle_down red}",
"colorHtml": "<div><span style=\"color: red;\">▼</span></div>\n"
},
{
"name": "black_triangle_right",
"textContent": "\\icon{black_triangle_right}",
"textHtml": "<div><span >▶</span></div>\n",
"mathContent": "$\\icon{black_triangle_right}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.248ex\" height=\"1.312ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -539 993.5 580\" style=\"vertical-align: -0.093ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25B6\" d=\"M83 523Q83 524 85 527T92 535T103 539Q107 539 389 406T680 268Q694 260 694 249Q694 239 687 234Q685 232 395 95L107 -41H101Q90 -40 83 -26V523Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_right}",
"nameColorHtml": "<div><span style=\"color: red;\">▶</span></div>\n",
"colorContent": "\\icon{black_triangle_right red}",
"colorHtml": "<div><span style=\"color: red;\">▶</span></div>\n"
},
{
"name": "black_triangle_left",
"textContent": "\\icon{black_triangle_left}",
"textHtml": "<div><span >◀</span></div>\n",
"mathContent": "$\\icon{black_triangle_left}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.248ex\" height=\"1.312ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -539 993.5 580\" style=\"vertical-align: -0.093ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25C0\" d=\"M694 -26Q686 -40 676 -41H670L382 95Q92 232 90 234Q83 239 83 249Q83 262 96 267Q101 270 379 401T665 537Q671 539 674 539Q686 539 694 524V-26Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_left}",
"nameColorHtml": "<div><span style=\"color: red;\">◀</span></div>\n",
"colorContent": "\\icon{black_triangle_left red}",
"colorHtml": "<div><span style=\"color: red;\">◀</span></div>\n"
},
{
"name": "triangle",
"textContent": "\\icon{triangle}",
"textHtml": "<div><span >△</span></div>\n",
"mathContent": "$\\icon{triangle}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.499ex\" height=\"1.62ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -716 1104.5 716\" style=\"vertical-align: 0px;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25B3\" d=\"M75 0L72 2Q69 3 67 5T62 11T59 20Q59 24 62 30Q65 37 245 370T428 707Q428 708 430 710T436 714T444 716Q451 716 455 712Q459 710 644 368L828 27V20Q828 7 814 0H75ZM610 347L444 653Q443 653 278 347T113 40H775Q775 42 610 347Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle}",
"nameColorHtml": "<div><span style=\"color: red;\">▲</span></div>\n",
"colorContent": "\\icon{triangle red}",
"colorHtml": "<div><span style=\"color: red;\">△</span></div>\n"
},
{
"name": "triangle_down",
"textContent": "\\icon{triangle_down}",
"textHtml": "<div><span >▽</span></div>\n",
"mathContent": "$\\icon{triangle_down}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.499ex\" height=\"1.618ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -500 1104.5 715\" style=\"vertical-align: -0.486ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"25BD\" d=\"M59 480Q59 485 61 489T66 495T72 498L75 500H814Q828 493 828 480V474L644 132Q458 -210 455 -212Q451 -215 444 -215T433 -212Q429 -210 342 -49T164 282T64 466Q59 478 59 480ZM775 460H113Q113 459 278 153T444 -153T610 153T775 460Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_down}",
"nameColorHtml": "<div><span style=\"color: red;\">▼</span></div>\n",
"colorContent": "\\icon{triangle_down red}",
"colorHtml": "<div><span style=\"color: red;\">▽</span></div>\n"
},
{
"name": "triangle_right",
"textContent": "\\icon{triangle_right}",
"textHtml": "<div><span >▷</span></div>\n",
"mathContent": "$\\icon{triangle_right}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.488ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1099.5 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">▷</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_right}",
"nameColorHtml": "<div><span style=\"color: red;\">▶</span></div>\n",
"colorContent": "\\icon{triangle_right red}",
"colorHtml": "<div><span style=\"color: red;\">▷</span></div>\n"
},
{
"name": "triangle_left",
"textContent": "\\icon{triangle_left}",
"textHtml": "<div><span >◁</span></div>\n",
"mathContent": "$\\icon{triangle_left}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.077ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 918.2 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">◁</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_triangle_left}",
"nameColorHtml": "<div><span style=\"color: red;\">◀</span></div>\n",
"colorContent": "\\icon{triangle_left red}",
"colorHtml": "<div><span style=\"color: red;\">◁</span></div>\n"
},
{
"name": "circle",
"textContent": "\\icon{circle}",
"textHtml": "<div><span >○</span></div>\n",
"mathContent": "$\\icon{circle}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.695ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 749.4 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">○</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circle}",
"nameColorHtml": "<div><span >🔴</span></div>\n",
"colorContent": "\\icon{circle red}",
"colorHtml": "<div><span style=\"color: red;\">○</span></div>\n"
},
{
"name": "black_circle",
"textContent": "\\icon{black_circle}",
"textHtml": "<div><span >●</span></div>\n",
"mathContent": "$\\icon{black_circle}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.695ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 749.4 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">●</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circle}",
"nameColorHtml": "<div><span >🔴</span></div>\n",
"colorContent": "\\icon{black_circle red}",
"colorHtml": "<div><span style=\"color: red;\">●</span></div>\n"
},
{
"name": "bullseye",
"textContent": "\\icon{bullseye}",
"textHtml": "<div><span >◎</span></div>\n",
"mathContent": "$\\icon{bullseye}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.488ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1099.5 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">◎</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_bullseye}",
"nameColorHtml": "<div><span style=\"color: red;\">◎</span></div>\n",
"colorContent": "\\icon{bullseye red}",
"colorHtml": "<div><span style=\"color: red;\">◎</span></div>\n"
},
{
"name": "black_star",
"textContent": "\\icon{black_star}",
"textHtml": "<div><span >★</span></div>\n",
"mathContent": "$\\icon{black_star}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.623ex\" height=\"1.821ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -694 1159.5 805\" style=\"vertical-align: -0.251ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2605\" d=\"M367 395Q374 416 398 492T442 627T463 688Q463 692 467 692Q471 694 472 694Q478 694 484 680T523 562Q553 469 576 400L577 395H731H819Q872 395 883 394T895 384Q895 380 891 376T832 333Q794 305 767 285Q643 195 643 194L690 47Q737 -96 737 -103Q737 -111 727 -111Q721 -111 594 -18L472 71L350 -18Q223 -111 217 -111Q207 -111 207 -103Q207 -96 254 47L301 194Q301 195 241 239T118 328T51 378Q49 382 49 384Q49 392 58 393T110 395H213H367Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_star}",
"nameColorHtml": "<div><span style=\"color: red;\">★</span></div>\n",
"colorContent": "\\icon{black_star red}",
"colorHtml": "<div><span style=\"color: red;\">★</span></div>\n"
},
{
"name": "star",
"textContent": "\\icon{star}",
"textHtml": "<div><span >☆</span></div>\n",
"mathContent": "$\\icon{star}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.488ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1099.5 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">☆</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_star}",
"nameColorHtml": "<div><span style=\"color: red;\">★</span></div>\n",
"colorContent": "\\icon{star red}",
"colorHtml": "<div><span style=\"color: red;\">☆</span></div>\n"
},
{
"name": "sad_face",
"textContent": "\\icon{sad_face}",
"textHtml": "<div><span >☹</span></div>\n",
"mathContent": "$\\icon{sad_face}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.961ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 866.7 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">☹</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_sad_face}",
"nameColorHtml": "<div><span style=\"color: red;\">☹</span></div>\n",
"colorContent": "\\icon{sad_face red}",
"colorHtml": "<div><span style=\"color: red;\">☹</span></div>\n"
},
{
"name": "smiley",
"textContent": "\\icon{smiley}",
"textHtml": "<div><span >☺</span></div>\n",
"mathContent": "$\\icon{smiley}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.53ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1118.3 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">☺</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_smiley}",
"nameColorHtml": "<div><span style=\"color: red;\">☻</span></div>\n",
"colorContent": "\\icon{smiley red}",
"colorHtml": "<div><span style=\"color: red;\">☺</span></div>\n"
},
{
"name": "black_smiley",
"textContent": "\\icon{black_smiley}",
"textHtml": "<div><span >☻</span></div>\n",
"mathContent": "$\\icon{black_smiley}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.592ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1145.7 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">☻</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_smiley}",
"nameColorHtml": "<div><span style=\"color: red;\">☻</span></div>\n",
"colorContent": "\\icon{black_smiley red}",
"colorHtml": "<div><span style=\"color: red;\">☻</span></div>\n"
},
{
"name": "heart",
"textContent": "\\icon{heart}",
"textHtml": "<div><span >♡</span></div>\n",
"mathContent": "$\\icon{heart}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.248ex\" height=\"1.695ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -716 993.5 749\" style=\"vertical-align: -0.075ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"2661\" d=\"M55 490Q55 557 71 604T114 674T167 706T222 716Q279 716 322 684T389 605Q391 610 395 617T414 643T447 677T494 704T555 716Q642 716 682 652T723 490Q723 455 718 426T684 342T602 227Q573 196 537 161T485 110T449 63T412 -8Q408 -22 404 -27T389 -33Q382 -33 379 -31T372 -23T366 -8T355 18T335 54Q319 81 298 104T239 163T176 227Q102 310 79 371T55 490ZM198 674Q143 664 119 613T95 491Q95 415 137 346Q174 282 265 194T384 48L389 39Q391 42 397 54T406 71T415 86T427 104T442 122T464 146T491 172Q571 249 613 303Q683 396 683 487Q683 581 649 631Q613 676 556 676Q495 676 457 634T410 538Q407 514 390 514Q386 514 380 517Q372 520 369 536T355 581T319 635Q277 675 223 675H217H208L204 674Q200 674 198 674Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_heart}",
"nameColorHtml": "<div><span style=\"color: red;\">♥</span></div>\n",
"colorContent": "\\icon{heart red}",
"colorHtml": "<div><span style=\"color: red;\">♡</span></div>\n"
},
{
"name": "black_heart",
"textContent": "\\icon{black_heart}",
"textHtml": "<div><span >♥</span></div>\n",
"mathContent": "$\\icon{black_heart}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.675ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 740.2 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">♥</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_heart}",
"nameColorHtml": "<div><span style=\"color: red;\">♥</span></div>\n",
"colorContent": "\\icon{black_heart red}",
"colorHtml": "<div><span style=\"color: red;\">♥</span></div>\n"
},
{
"name": "hot_springs",
"textContent": "\\icon{hot_springs}",
"textHtml": "<div><span >♨</span></div>\n",
"mathContent": "$\\icon{hot_springs}$",
"mathHtml": "<div><span class=\"math-inline \">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2.585ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 1142.6 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">♨</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_hot_springs}",
"nameColorHtml": "<div><span style=\"color: red;\">♨</span></div>\n",
"colorContent": "\\icon{hot_springs red}",
"colorHtml": "<div><span style=\"color: red;\">♨</span></div>\n"
},
{
"name": "circled_white_bullet",
"textContent": "\\icon{circled_white_bullet}",
"textHtml": "<div><span >⦾</span></div>\n",
"mathContent": "$\\icon{circled_white_bullet}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.892ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 836.4 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⦾</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_white_bullet}",
"nameColorHtml": "<div><span style=\"color: red;\">⦾</span></div>\n",
"colorContent": "\\icon{circled_white_bullet red}",
"colorHtml": "<div><span style=\"color: red;\">⦾</span></div>\n"
},
{
"name": "circled_bullet",
"textContent": "\\icon{circled_bullet}",
"textHtml": "<div><span >⦿</span></div>\n",
"mathContent": "$\\icon{circled_bullet}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.892ex\" height=\"2.149ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 836.4 950\" style=\"vertical-align: -0.452ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><text data-variant=\"normal\" transform=\"scale(1,-1)\" font-size=\"884px\" font-family=\"serif\">⦿</text></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_circled_bullet}",
"nameColorHtml": "<div><span style=\"color: red;\">⦿</span></div>\n",
"colorContent": "\\icon{circled_bullet red}",
"colorHtml": "<div><span style=\"color: red;\">⦿</span></div>\n"
},
{
"name": "left_angle",
"textContent": "\\icon{left_angle}",
"textHtml": "<div><span >〈</span></div>\n",
"mathContent": "$\\icon{left_angle}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.368ex\" height=\"2.262ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 604.5 1000\" style=\"vertical-align: -0.566ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"3008\" d=\"M333 -232Q332 -239 327 -244T313 -250Q303 -250 296 -240Q293 -233 202 6T110 250T201 494T296 740Q299 745 306 749L309 750Q312 750 313 750Q331 750 333 732Q333 727 243 489Q152 252 152 250T243 11Q333 -227 333 -232Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_left_angle}",
"nameColorHtml": "<div><span style=\"color: red;\">〈</span></div>\n",
"colorContent": "\\icon{left_angle red}",
"colorHtml": "<div><span style=\"color: red;\">〈</span></div>\n"
},
{
"name": "right_angle",
"textContent": "\\icon{right_angle}",
"textHtml": "<div><span >〉</span></div>\n",
"mathContent": "$\\icon{right_angle}$",
"mathHtml": "<div><span class=\"math-inline \" data-overflow=\"visible\">\n<mjx-container class=\"MathJax\" jax=\"SVG\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1.368ex\" height=\"2.262ex\" role=\"img\" focusable=\"false\" viewBox=\"0 -750 604.5 1000\" style=\"vertical-align: -0.566ex;\"><g stroke=\"currentColor\" fill=\"currentColor\" stroke-width=\"0\" transform=\"scale(1,-1)\"><g data-mml-node=\"math\"><g data-mml-node=\"mpadded\"><g data-mml-node=\"mtext\"><path data-c=\"3009\" d=\"M55 732Q56 739 61 744T75 750Q85 750 92 740Q95 733 186 494T278 250T187 6T92 -240Q85 -250 75 -250Q67 -250 62 -245T55 -232Q55 -227 145 11Q236 248 236 250T145 489Q55 727 55 732Z\"></path></g></g></g></g></svg></mjx-container></span></div>\n",
"nameColorContent": "\\icon{red_right_angle}",
"nameColorHtml": "<div><span style=\"color: re