Skip to content

Instantly share code, notes, and snippets.

@vojtech-dobes
Created September 3, 2012 08:27
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 vojtech-dobes/3607880 to your computer and use it in GitHub Desktop.
Save vojtech-dobes/3607880 to your computer and use it in GitHub Desktop.
Distraction-less text editor
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<style>
body { width: 100%; margin: 0; padding: 20xp; height: 100%; position: relative; }
div {
color: #555555;
cursor: text;
display: block;
font-family: Consolas;
width: 88%;
height: 90%;
padding: 5% 6%;
position: fixed;
text-align: justify;
border: 0;
overflow: scroll;
vertical-align: top;
}
</style>
<script src="http://modernizr.com/downloads/modernizr.js"></script>
</head>
<body>
<div contenteditable autofocus placeholder="Type anything..."></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
if (Modernizr.localstorage) {
var $textarea = $('div');
var content = localStorage.getItem('content');
$textarea.html(content || '');
$textarea.keyup(function () {
localStorage.setItem('content', $textarea.html());
});
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment