Republic of Lebanon

Side Navigation & Text Links

Font + - Print this PageBookmark and Share
The side navigation bar uses clear typography and colored bars for roll-over states. The text is Tahoma regular, 14pt on white.

a. Roll-over and down state

When the mouse goes over a menu item, its tab changes to the main color.

b. Roll-over on drop-down levels

The drop-down menu has two levels.
  • The first level is aligned with the main level and gets underlined on roll-over and down state
  • The 2nd level is tabbed in to provide an obvious hierarchy and gets highlighted with a 50% shade of the roll-over color

c. Visited state

Once a navigation link has been 'visited' the text goes gray (the same gray as the tab color).

d. Top level visited state

Once a top level navigation link has been 'visited' the text in that tab becomes light gray.

e. Text links styles

The text links color is based on the secondary color (which is contrasting with the main color). It becomes 50% lighter on roll-over and gray on visited state.

Beware that this side navigation could also work as a main navigation should there be too many links not fitting in the main gray bar.
Last updated on: 12/09/2011 - 01:05 PM

Please login to start checking and adding Comments
All rights reserved ©     Sitemap  |  Copyright  |  Privacy  |  Disclaimer
This site is hosted by the Office of the Minister of State for Administrative Reform (OMSAR).