Show HN: An old terminal HTML template | Hacker News Reader

Show HN: An old terminal HTML template

github.com

74 pointsatum4724 comments

Neat. Although it is sort of an anachronistic mishmash of different eras. The mouse interface and colour scheme reminds me of old MS-DOS apps. But the font used is based on 1980s arcade games – https://fonts.google.com/specimen/Press+Start+2P – and is much more blocky than what one usually encountered on those mouse-enabled MS-DOS apps. And the 300 baud style slowness doesn't really fit with the colourful mouse-enabled UI – mouse interfaces on BBSs or remote hosts were rare, and by the time they started to appear modem connection speeds had improved significantly.

It should be possible to add mouseover events to have the mouse only highlight the current character block which is more authentic as well.

yes, at first I was trying to reproduce a software from msdos era. after a while trying fonts and colors I end up with this style. I was going to use it on my own webpage, but then I just released to see if other people would like ut. I'm glad they did

It's your project, you can make it look however you like, and if you like how it is now, that's great.

If however you wanted to go for a more authentic MS-DOS look, consider using these fonts instead – https://int10h.org/oldschool-pc-fonts/ – they are identical (down to the pixel) with the original BIOS fonts used in IBM PC and compatible hardware.

nice

I have just uploaded a new version with the font you suggested. Thanks.

It's really good.

Function keys would be nice, the original green screen with function key strip at the bottom of the screen interface is still one that I think is a good one.

Another small thing, it could be made to work with the HTML elements that are semantic rather than presentational. So no div elements and magic classes, just sections, headers, footers, asides, nav and those sorts of things.

In that way the content could be neatly structured and look good with a normal stylesheet, or, do the terminal mode (s).

I have had a go at terminal mode myself and the Holy Grail is to do a compelling CRT impression with the slight curve of the screen. Not worked out how to do that yet. Phosphor glow is fine but I want to do the live lens distortion on HMTL content.

As an added Easter Egg to your terminal you could get print mode to do the green stripes on the paper look.

I have thought about the keys opening the menus and the green on black crt. I did post this project here to see if people would respond to it, they seem to like it. I think I'll work a little more on it.

Green stripes on the paper idea for printing is great.

I'll take a look at navbar and section. should work fine, the JavaScript sees the element by id and class, change from a div to a navbar or a section shouldn't break it.

There is also https://github.com/kristopolous/BOOTSTRA.386

I didn't know about this one. I made mine as a simple jsfiddle sketch two years or so ago. Yesterday I've decided to upload it to see if someone cares for it.

Yours looks very nice also. Thanks for sharing :)

Fantastic! I've been trying to build something similar for https://TokyoTech.com , but keep fighting with how to display larger content. Once something solidifies, I'll release it on GitHub too. Would love to add support for vim color theme files.

And vim keybindings please :)

first letter of the menu opens it?

Love it. One of my early websites was trying to build something like this (in style at least, I didn't have any interactivity).

I just added the green on black color scheme. It has some glow on it to mimic the CRT glow.

minor UI enhancement:

    line-height: 1.5em

would make it more believable.

I'll test that

reminds me of a low-res foxpro

but why...?

Nostalgia?

of what? it seems to miss whatever its aiming at.

Reply on news.ycombinator.com