diff options
| author | Shulhan <ms@kilabit.info> | 2023-05-28 21:05:35 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2023-05-28 21:05:35 +0700 |
| commit | 3c25256f105271c402eb56cd19b1e73fa8fd26fb (patch) | |
| tree | 4bf9ba893911403de55fb940029a8a404dc7b19b | |
| parent | 6f7bb3e07398c80e782dd46045ce020a45067095 (diff) | |
| download | asciidoctor-go-3c25256f105271c402eb56cd19b1e73fa8fd26fb.tar.xz | |
_doc: add HTML file to test previewing partial HTML content
The HTML file can be viewed by running "make serve-doc" and opening
http://127.0.0.1:8080/test.html .
It provide a textarea where developer can input partial HTML and a
button Preview to render the partial HTML on the right.
| -rw-r--r-- | _doc/test.html | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/_doc/test.html b/_doc/test.html new file mode 100644 index 0000000..1ee01b0 --- /dev/null +++ b/_doc/test.html @@ -0,0 +1,57 @@ +<html> + <head> + <title>HTML test</title> + <style> + .row { + width: 100%; + display: flex; + flex-direction: row; + } + .col-50 { + width: 50%; + display: flex; + flex-direction: column; + margin: 1em; + } + textarea#rawhtml { + width: 100%; + } + #output { + border: 1px solid black; + } + @media screen and (max-width: 720px) { + .row { + flex-direction: column; + } + .col-50 { + width: calc(100% - 2em); + } + } + </style> + </head> + <body> + <div class="row"> + <div class="col-50"> + <div> + Input partial raw HTML and click + <button onclick="doPreview()">Preview</button> + </div> + <textarea id="rawhtml" name="rawhtml" rows="50"> +input raw <b>html</b> here!</textarea + > + </div> + <div class="col-50"> + <div>Output :</div> + <div id="output"></div> + </div> + </div> + </body> + <script> + function doPreview() { + let elInput = document.getElementById("rawhtml"); + let elOut = document.getElementById("output"); + + elOut.innerHTML = elInput.value; + } + </script> +</html> |