99 lines
2.4 KiB
HTML
99 lines
2.4 KiB
HTML
<!DOCTYPE html><html><head>
|
|
<meta charset="utf-8">
|
|
<title>📝🎉 {{ title }}</title> <!-- 📜 -->
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=0.7">
|
|
<link href="/.cpr/md.css" rel="stylesheet">
|
|
{%- if edit %}
|
|
<link href="/.cpr/md2.css" rel="stylesheet">
|
|
{%- endif %}
|
|
</head>
|
|
<body>
|
|
<div id="mn">navbar</div>
|
|
<div id="mh">
|
|
<a id="lightswitch" href="#">go dark</a>
|
|
<a id="navtoggle" href="#">hide nav</a>
|
|
{%- if edit %}
|
|
<a id="save" href="?edit">save</a>
|
|
<a id="sbs" href="#">sbs</a>
|
|
<a id="nsbs" href="#">editor</a>
|
|
<a id="help" href="#">help</a>
|
|
{%- else %}
|
|
<a href="?edit">edit (basic)</a>
|
|
<a href="?edit2">edit (fancy)</a>
|
|
{%- endif %}
|
|
</div>
|
|
<div id="toc"></div>
|
|
<div id="mtw">
|
|
<textarea id="mt">{{ md }}</textarea>
|
|
</div>
|
|
<div id="mw">
|
|
<div id="ml">
|
|
<div style="text-align:center;margin:5em 0">
|
|
<div style="font-size:2em;margin:1em 0">Loading</div>
|
|
if you're still reading this, check that javascript is allowed
|
|
</div>
|
|
</div>
|
|
<div id="mp"></div>
|
|
</div>
|
|
|
|
{%- if edit %}
|
|
<div id="helpbox">
|
|
<textarea>
|
|
|
|
write markdown (html is permitted)
|
|
|
|
### hotkey list
|
|
* `Ctrl-S` to save
|
|
* `Ctrl-H` / `Ctrl-Shift-H` to create a header
|
|
* `TAB` / `Shift-TAB` to indent/dedent a selection
|
|
|
|
### toolbar
|
|
1. toggle dark mode
|
|
2. show/hide navigation bar
|
|
3. save changes on server
|
|
4. side-by-side editing
|
|
5. toggle editor/preview
|
|
6. this thing :^)
|
|
|
|
.
|
|
|
|
</textarea>
|
|
</div>
|
|
{%- endif %}
|
|
|
|
<script>
|
|
|
|
var link_md_as_html = false; // TODO (does nothing)
|
|
var last_modified = {{ lastmod }};
|
|
|
|
(function () {
|
|
var btn = document.getElementById("lightswitch");
|
|
var toggle = function (e) {
|
|
if (e) e.preventDefault();
|
|
var dark = !document.documentElement.getAttribute("class");
|
|
document.documentElement.setAttribute("class", dark ? "dark" : "");
|
|
btn.innerHTML = "go " + (dark ? "light" : "dark");
|
|
if (window.localStorage)
|
|
localStorage.setItem('darkmode', dark ? 1 : 0);
|
|
};
|
|
btn.onclick = toggle;
|
|
if (window.localStorage && localStorage.getItem('darkmode') == 1)
|
|
toggle();
|
|
})();
|
|
|
|
if (!String.startsWith) {
|
|
String.prototype.startsWith = function(s, i) {
|
|
i = i>0 ? i|0 : 0;
|
|
return this.substring(i, i + s.length) === s;
|
|
};
|
|
}
|
|
|
|
</script>
|
|
<script src="/.cpr/deps/marked.full.js"></script>
|
|
<script src="/.cpr/md.js"></script>
|
|
{%- if edit %}
|
|
<script src="/.cpr/md2.js"></script>
|
|
{%- endif %}
|
|
</body></html>
|