mirror of
https://codeberg.org/vlw/code-export-syntax.git
synced 2025-11-05 04:22:43 +01:00
90 lines
No EOL
2.8 KiB
HTML
90 lines
No EOL
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Syntax highlight export</title>
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.conditional.min.css">
|
|
<link rel="stylesheet" href="/assets/css/style.css">
|
|
<link rel="stylesheet" href="/assets/css/pages/edit.css">
|
|
</head>
|
|
<body data-theme="dark">
|
|
<aside>
|
|
<div class="fields pico">
|
|
<fieldset>
|
|
<legend>Theme:</legend>
|
|
<label>
|
|
<input type="radio" name="theme" title="Use theme" checked>
|
|
Default Dark Modern
|
|
</label>
|
|
</fieldset>
|
|
</div>
|
|
<div class="sticky">
|
|
<div class="export pico">
|
|
<button data-export="/pages/export/html.html"><p></></p></button>
|
|
</div>
|
|
<div class="fields pico">
|
|
<fieldset>
|
|
<legend>Highlight:</legend>
|
|
<label>
|
|
<input type="checkbox" name="highlight-spans">
|
|
spans
|
|
</label>
|
|
</fieldset>
|
|
<hr>
|
|
<label id="text-size">
|
|
Font size
|
|
<input type="range" min="12" max="20" step="1" value="14">
|
|
<input type="number" name="text-size" placeholder="Text size" aria-label="Text size" value="14">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
<resize-handle></resize-handle>
|
|
<main class="bg"></main>
|
|
|
|
<edit-span-modal>
|
|
<ol>
|
|
<li class="span-mkt"><p class="mtk1"></p></li>
|
|
<li class="span-mkt"><p class="mtk2"></p></li>
|
|
<li class="span-mkt"><p class="mtk3"></p></li>
|
|
<li class="span-mkt"><p class="mtk4"></p></li>
|
|
<li class="span-mkt"><p class="mtk5"></p></li>
|
|
<li class="span-mkt"><p class="mtk6"></p></li>
|
|
<li class="span-mkt"><p class="mtk7"></p></li>
|
|
<li class="span-mkt"><p class="mtk8"></p></li>
|
|
<li class="span-mkt"><p class="mtk9"></p></li>
|
|
<li class="span-mkt"><p class="mtk10"></p></li>
|
|
<li class="span-mkt"><p class="mtk11"></p></li>
|
|
<li class="span-mkt"><p class="mtk12"></p></li>
|
|
<li class="span-mkt"><p class="mtk13"></p></li>
|
|
<li class="span-mkt"><p class="mtk14"></p></li>
|
|
<li class="span-mkt"><p class="mtk15"></p></li>
|
|
<li class="span-mkt"><p class="mtk16"></p></li>
|
|
<li class="span-mkt"><p class="mtk17"></p></li>
|
|
<li class="span-mkt"><p class="mtk18"></p></li>
|
|
<li class="span-mkt"><p class="mtk19"></p></li>
|
|
<li class="span-mkt"><p class="mtk20"></p></li>
|
|
<li class="span-mkt"><p class="mtk21"></p></li>
|
|
<li class="span-mkt"><p class="mtk22"></p></li>
|
|
</ol>
|
|
<div>
|
|
<div class="buttons">
|
|
<button><p>A</p></button>
|
|
<button class="join"><p>J</p></button>
|
|
<button class="split"><p>S</p></button>
|
|
</div>
|
|
<div class="fmt">
|
|
<ul>
|
|
<li class="span-mkt"><p class="mtk19 mtki"></p></li>
|
|
<li class="span-mkt"><p class="mtk19 mtkb"></p></li>
|
|
<li class="span-mkt"><p class="mtk19 mtks"></p></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</edit-span-modal>
|
|
|
|
<script src="/assets/js/pages/edit.js"></script>
|
|
</body>
|
|
</html> |