----------------------------------------
Styling Lynx Gopher->HTML output with sed and CSS
March 30th, 2018
----------------------------------------
Note: this phlog entry does not display correctly on HTTP/HTTPS
 
In yesterday's post, I gave some tidbits on how to use Lynx to turn
gopher menus into decent HTML, today I'll give some hints on how to 
make the document appear a little better using sed and CSS. My goals 
here are to make the document look a little bit like Netscape 2.0 
(file type images instead of text description) but also not look like a 
piece of paper at the same time...

First lets use a sed file (sed -f images.sed) to inject some HTML SPANs
and classes into the document...

=> source of file here, too wide to display in the blog

Then, lets inject the HTML code to get the browser to load a stylesheet:
sed -e '//a \

=>

The stylesheet contains code to set the body color to a pleasing shade
of grey, and the background to black... Also to set the text to a 
monospace font, as many gopher menus contain ASCII art that will not 
work with a proportional font...
We'll also make the "GOPHER MENU" H1 not so damn huge, and make the 
links legible when paired with a black foreground...
Finally it contains CSS trickery to replace the spans we inserted
with nice little file icons from Apache.
----------------------------------------

=> Back to phlog index | gopher.zcrayfish.soy gopher root

Future direct comment submission has been disabled for this phlog entry.
Comments are still accepted by email, please send to:
zacharygopher@gopher.zcrayfish.soy
Be sure to include the post title in the subject line! Thanks!
Nobody has commented on this post.
Proxy Information
Original URL
gemini://gopher.zcrayfish.soy/1/phlog/20180330-styling-lynx-gopher-html-output-with-sed-and-css
Status Code
Success (20)
Meta
text/gemini;
Capsule Response Time
569.694895 milliseconds
Gemini-to-HTML Time
0.347451 milliseconds

This content has been proxied by September (3851b).