<script lang="ts">
let content = "那是一条神奇的天路耶！带我们走进天堂的门阖！";
</script>

<textarea name="content" id="content" bind:value={content}></textarea>

<div id="main" class="main ss02">
  {@html content}
</div>

<style>
  @font-face { font-family: Simp; src: url(../../lib/assets/EvilSung-Regular.ttf); }
  :global(.ss01) { font-feature-settings: "ss01"; }
  :global(.ss02) { font-feature-settings: "ss02"; }
  :global(.ss03) { font-feature-settings: "ss03"; }
  :global(.ss04) { font-feature-settings: "ss04"; }
  :global(.ss05) { font-feature-settings: "ss05"; }
  :global(.ss06) { font-feature-settings: "ss06"; }
  :global(.ss07) { font-feature-settings: "ss07"; }

  #main {
    font-family: Simp;
    font-size: 2em;
    display: block;
    color: #c9d1d9;
    background-color: #0d1117;
    width: fit-content;
    max-width: 600px;
    padding: 10px;
  }

  :global(html, body) {
    background-color: #0d1117;
    color: #c9d1d9;
  }
</style>