A clean notepad in HTML & CSS | Hacker News Reader

A clean notepad in HTML & CSS

marcgayle.com

17 pointsmarcamillion8 comments

It's just a table with some pretty standard css and a graphic or 2. I thought this was going to be an app that remade a standard notepad app in html and had decent features.

Color me unimpressed.

Fair enough.

I did say it was nothing fancy in the first few lines though ;)

It does look very accurate though.

It twinges some school nostalgia for me.

Ha indeed... Started clicking around on it expecting to edit text, or turn a page, or SOMETHING... Started looking for javascript errors thinking Safari had crapped the bed, as it is prone to do from time to time.

sigh

Post things like this once they get interesting. ;)

> I thought this was going to be an app that remade a standard notepad app in html and had decent features.

I thought the same too. I made a plain-text note-taking/outlining app earlier this year ( http://bulletxt.zetabee.com/demo ) and have been interested in online text-editing ever since (SkyWriter, Google Docs, Etherpad etc.) For years, everyone relied on contentEditable and textarea for all major text editing. My app is still using textareas but it uses a series of them, transparent to the user. SkyWriter/Bespin use canvas. I was kinda hoping this link was about making one in pure HTML5 and CSS.

I think it looks slightly wrong because most people don't write between the lines, they align the baseline of the letters with the bottom line.

Several years ago, I did a website for a Poet who works on a manual typewriter using sheets of lined paper ripped from a notebook. I as tasked with recreating the visual feeling of the pages in HTML/CSS, including the fact that texted would be deleted by overtyping "X"'s

Take a look: http://agiginprint.com/poessays/sonoran-hushings/

Here is another typography solution for Baseline Grid Typography http://www.allapis.com/emastic/typography.html from Emastic CSS Framework http://code.google.com/p/emastic/

Reply on news.ycombinator.com