Skip to content

Instantly share code, notes, and snippets.

@saborrie
Last active July 4, 2020 22:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save saborrie/df5bc25d78aa0763c938032dc50c4528 to your computer and use it in GitHub Desktop.
Save saborrie/df5bc25d78aa0763c938032dc50c4528 to your computer and use it in GitHub Desktop.
data:text/html, <html> <head> <title>Notepad</title> <style> html { height: 100%; } body { background: rgb(255, 255, 170); padding: 0; margin: 0; font-family: monospace; font-size: 20px; height: 100%; } input { background: none; padding: 0; border: none; margin: 0; width: 100%; line-height: inherit; font-size: inherit; height: inherit; } input:focus { outline: none !important; border-color: inherit; border: none; -webkit-box-shadow: none; box-shadow: none; } .top, .bottom { width: 840px; max-width: 100%; margin: auto; padding: 0 20px; } .hiddentitle { display: none; } .top { height: 100px; padding-top: 40px; } .bottom, .bottom:focus { padding: 30px 20px; min-height: calc(100% - 200px); outline: 0 solid transparent; } img { max-width: 80%; margin: auto; max-height: 250px; text-align: center; } </style> </head> <body> <div class="top"> <h1><span class="hiddentitle" id="hiddentitle"></span><input id="title" placeholder="Title" autocomplete="off" onkeyup="updateTitle()" /></h1> </div> <div class="bottom" placeholder="content" contenteditable></div> <script> function updateTitle() { var newtitle = document.getElementById("title").value || "Notepad"; document.title = newtitle; document.getElementById("hiddentitle").innerHTML = newtitle; } document.getElementById("title").value = document.getElementById("hiddentitle").innerHTML; </script> </body> </html>
@saborrie
Copy link
Author

saborrie commented Dec 8, 2016

Paste the code into your URL bar and then bookmark it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment