Mercurial

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Markdown to HTML Converter</title>
    {{/parts/base_head.html}}
    <link rel="stylesheet" href="markdown_to_html/index.css" />
</head>
<body>
    {{/parts/header.html}}
    <div class="header">
        <h1>Markdown to HTML Converter</h1>
    </div>

    <div class="container">
        <div class="panel">
            <div class="label">Markdown Input</div>
            <textarea id="input" placeholder="Type your markdown here..."># Welcome to Markdown Converter

## Features

This converter supports:

- **Bold text** and *italic text*
- [Links](https://example.com)
- `inline code`
- ~~strikethrough~~

### Lists

1. Ordered lists
2. Like this one
3. With numbers

- Unordered lists
- Use dashes
- Or asterisks

### Code Blocks

```
function example() {
    return "Hello World";
}
```

### Blockquotes

> This is a blockquote
> It can span multiple lines

---

### Images

![Alt text](https://via.placeholder.com/150)

**Try editing this text!**</textarea>
        </div>

        <div class="panel">
            <div class="title">
              <div class="label">HTML Output</div>
              <button id="copy"> Copy </button>
            </div>
            <div id="output"></div>
        </div>
    </div>
    {{/parts/footer.html}}
    <script src="/markdown_to_html.js"></script>
    <script>
        function convert() {
          output.innerHTML = '';
          const markdown = input.value;
          renderMarkdown(output, markdown);
        }
        input.addEventListener('input', convert);

        convert();

        copy.addEventListener('click', () => {
          const htmlBlob = new Blob([output.innerHTML], { type: 'text/html'});
          const textBlob = new Blob([output.innerText], { type: 'text/plain'});
          const data = [new ClipboardItem({
            'text/html': htmlBlob,
            'text/plain': textBlob
          })];
          navigator.clipboard.write(data).then(() => {
            copy.textContent = "Copied!";
            setTimeout(() => {
              copy.textContent = "Copy";
              copy.classList.remove('success');
            }, 1000);
          }).catch(err => {
            console.error('Failed to copy: ', err);
          });
        });
    </script>
</body>
</html>
author	June Park <parkjune1995@gmail.com>
date	Sat, 10 Jan 2026 07:07:10 -0800
parents	be91a73d801a
children	8c74204fd362