Alternate CSS available at: OdsWiki NewTestCSS

It is relatively easy to build a new-look css for FlexWiki if you start with the style known as Chocolate as in the ChocolateCSS file. The steps to create a new css file are as follows:

• Visit the site CSS Color Chart or Slayeroffice Color Palette and select 5 colors from the same family with a range of light to dark
• Map the colors starting at the lightest to the darkest
• #FFAF2 --> lightest new color
• #FFF3E1 --> new color
• #C1AF92 --> new color
• #6A4E22 --> new color
• #4E3818 --> darkest new color
• Visit the site Gradient Image Maker and create a gradient image with the following parameters
• Width = 1
• Height = 1150 (this will accommodate displays 1920 X 1200)
• Start color = lightest new color (or second lightest new color)
• End color = darkest new color
• File type = png
• Generate the full size gradient image and copy the image to a local drive
• Rename the gradient file to something like "grad_blue.png""
• Put the new color mappings into the color summary table below
• Copy the wiki.css file (displayed as ChocolateCSS) to your local drive
• rename wiki.css to wiki_local.css
• Edit wiki_local.css and replace the color values with the new mappings.
• Edit the #TopicBody:border css value to refer to the new gradient image file
• Copy the gradient image file to the image directory under FlexWiki on the web server
• Copy the file wiki_local.css to the FlexWiki directory on the web server
• Edit the web server file flexwiki.config and add a line in the <configuration> section as below
• <OverrideStylesheet>wiki_local.css</OverrideStylesheet>
• Restart the web server
• (Optional) tweak other color settings as required
• mainly text colors (#B3E0FF --> #228B22) by selecting a dark color in the same palette as the new colors
• table background (#DEF --> #F0FFF0) by selecting a very light color in the same palette as the new colors

Chocolate	CSS Selector	New CSS
#000	.Border#RightBorder:color	#000
	a.create:color
	PropertyName a.create:color
	TableCell p:color, TableCell ul:color
	td:color
	DefaultTopicTipText:color
	body:color
	TopicTip:color
	TopicTipStats:color
	#TopicBody:border
#303030	ErrorMessage:border	#303030
	body:background
#4E3818	StaticTopicBar:color	#556B2F
	TopicBar:color
	TopicBarHover:color
	.Rule:border-top
	input#search:border
	SidebarTile:border
	QuickLinkInput:color
#6A4E22	pre:border	#6E8B3D
	h1:border-bottom
	h2:border-bottom
	a.create:border-bottom
	a.create:hover:color
	a.create:hover:border-bottom
	PropertyName a.create:border-bottom
	PropertyName a.create:hover:border-bottom
	PropertyName a.create:hover:color
	PropertyValue a.create:border-bottom
	PropertyValue a.create:hover:border-bottom
	PropertyValue a.create:hover:color
	DynamicTopicBarHelp:color
	TopicBarHover:border
	h1:color
	TableClass:border
	TableCellHighlighted:border
	TableCell:border
	TopicTipStats:border-top
	TopicTip:border
	a:color
	h2:color
	h3:color
	h4:color
	h5:color
	h6:color
#C1AF92	QuickLinkInput:background	#A2CD5A
#FFF3E1	SidebarTile:background	#BCEE68
	.Dialog:background
	TopicBar:border
	StaticTopicBar:border
	input#search:background
	#TopicBody:background
#FFFAF2	pre:background	#CAFF70
#DEF	TableClass:background-color	#F0FFF0
#B3E0FF	.Border a:color	#228B22
	.Border a.create:border-bottom
	.Border a.create:hover:color
	.Border a.create:hover:border-bottom
#FFF	ErrorMessageTitle:color	#FFF
	ErrorMessageBody:color
	TableCellHighlighted:background-color
	TableCellHighlightedNoBorder:background-color
	SidebarTileTitle:color
	.Border:color
	.Border a.create:color
#CC6600	PropertyValue a.create:color	#CC6600
	PropertyValue:color
	PropertyValue p:color
	.Anchor:color
#CC0000	ErrorMessageTitle:background-color	#CC0000
#990033	ErrorMessageBody:background-color	#990033
#C00	ReadOnlyStripe:color	#C00