Testing CSS Styles from Haiku User Guide

Blog post by koki on Thu, 2009-07-16 22:54
, , ,

This is a sample of the CSS styles taken from the extraordinary work done by Humdinger on the Haiku User Guide. I am showcasing these here because I would like to use them throughout haiku-os.org as well. If it turns out that there is no unsurmountable opposition to adopting these classes, I will eventually document them so that they can be used by those submitting news, blogs posts and documents to haiku-os.org.

Boxes

This is just a very unthreatening little note. Don't be upset.
This may have serious consequences. Don't mess this up.
By golly, you better be sure what you're doing! Danger, Will Robinson!

Terminal in/output:

Unzipping generated/download/openssl-0.9.8j-gcc2-2009-01-28.zip ...
Deleting old MIME database ...
Installing MIME database ...
Unmounting ...
...updated 8580 target(s)...
humdinger@zeppo:~/Source/haiku/trunk$

Normal pre-Block, e.g. for a text file:

pre {
	border-color: #0c3762;
	border-style: dotted;
	border-width: thin;
	margin: 0em;
	padding: 1.5em;
	background-color: #5a5a5a;
}

pre.terminal {
	border-color: #ffb11f;
	border-style: dotted;
	border-width: thin;
	margin: 0em;
	padding: 1.5em;
	background-color: #f0f0f0;
	color: #ffb11f;
}

A path: /boot/home/config/settings/

A GUI application: WonderBrush

A command line application: mkdir

A menu item: Settings...

A button: Same As...

You can use many of the shortcuts also used in Tracker. Besides the commands that are also available through the File menu, there are a few not that obvious:

ALT N Creates a new folder.
ALT E Lets you rename the selected entry.
ALT CURSOR-UP Opens the parent folder.
ALT CURSOR-DOWN or RETURN Opens the selected folder.
ALT D Takes you to your Desktop.
ALT H Takes you to your Home folder.

We are open to improving these classes in any way possible (colors, font style, etc.), so feel free to use the comments area to tell us where you deem there is room for improvement.

Comments

Re: Testing CSS Styles from Haiku User Guide

by Dancxjo - 2009-07-30 17:53

Pretttttty!

Re: Testing CSS Styles from Haiku User Guide

by mikebryant - 2009-07-31 23:18

These styles are really beautiful. Excellent work.

My minor, personal quibbles:

  • The default terminal style is dark text on a light background (also, as it happens, my preference) so maybe the terminal in/out style should reflect that?
  • At least on Linux (Firefox, Chromium) the "path" font looks a little bit too small

Other than that it looks great!

Re: Testing CSS Styles from Haiku User Guide

by stan - 2009-12-21 20:36

Cool. Very usefull.
----------
Stan