forked from HPR/hpr_generator
		
	Modify white space of main menu
Add some accessiblility touches: change cursor to pointer on hover, change link color on active event.
This commit is contained in:
		| @@ -185,174 +185,54 @@ header > hr { | ||||
| } | ||||
|  | ||||
| /* The main navigation menu */ | ||||
| .menu { | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
| header > nav.menu { | ||||
|   display: block; | ||||
|   background-color: #4D4D4D; /* HPR Grey */ | ||||
|   text-align: Left; | ||||
|   clear:both; /* Forces the menu to appear after the HPR Header block */ | ||||
|   padding: 0em 0em; | ||||
|   margin: 0em 0em; | ||||
| } | ||||
|  | ||||
| .menu ul ul { /* Causes the sub menus not to be displayed, until hover shows them */ | ||||
|   display: none; | ||||
| } | ||||
|  | ||||
| #main_menu li a {display: block;} | ||||
|  | ||||
| .menu ul li { padding: .25em 0em;} | ||||
|  | ||||
| } | ||||
|  | ||||
| .menu ul { /* The menu bar background across screen */ | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
|   color: white; | ||||
|   padding: 0 10px; /* Keeps sub menus to the left */ | ||||
|   list-style: none; | ||||
|   position: relative; | ||||
|   margin: 0; | ||||
|   display: inline-table; | ||||
| } | ||||
|  | ||||
| .menu ul:after { /* Forces the dropdown to be a block with non float */ | ||||
|   content: "";  | ||||
|   clear: both;  | ||||
|   display: block; | ||||
| } | ||||
|  | ||||
| .menu ul li { | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
|   color: white; | ||||
|   float: left; | ||||
|   padding: .5em 1em; | ||||
| } | ||||
|  | ||||
| .menu ul li a { | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
|   color: white; | ||||
|   display: block;  | ||||
|   text-decoration: none; | ||||
| } | ||||
|      | ||||
| .menu ul ul { | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
|   color: white; | ||||
|   padding: 0; | ||||
|   position: absolute;  | ||||
|   top: 100%; | ||||
|   margin: 0; | ||||
| } | ||||
|  | ||||
| .menu ul ul li { | ||||
|   background: #4D4D4D; /* HPR Grey */ | ||||
| header > nav.menu ul { | ||||
| 	margin: 0; | ||||
| 	padding: 0.5rem; | ||||
| 	background-color: inherit; | ||||
|   color: white; | ||||
|   float: none;  | ||||
|   position: relative; | ||||
| } | ||||
|      | ||||
| .menu ul ul ul { | ||||
|   position: absolute;  | ||||
|   left: 100%;  | ||||
|   top:0; | ||||
| } | ||||
|  | ||||
|  | ||||
| hr { | ||||
|   background: #4D4D4D;  /* HPR Grey */ | ||||
|   border: 0; | ||||
|   height: 0.25em; | ||||
| header > nav.menu ul li { | ||||
| 	display: inline-block; | ||||
| 	background-color: inherit; | ||||
| 	color: inherit; | ||||
| 	line-height: 1.5; | ||||
| 	margin: 0; | ||||
|   padding: 0; | ||||
| 	padding-right: clamp(0.5rem, -0.25rem + 3vw , 2.5rem); | ||||
| } | ||||
|  | ||||
| /* The multi colum footer layout */ | ||||
|  | ||||
| #footer_page { | ||||
|   width:100%; | ||||
| } | ||||
|  | ||||
| .column { | ||||
|   width:12%; | ||||
|   background-color: white; | ||||
|   color: #4D4D4D; /* HPR Grey */ | ||||
|   float:left; | ||||
|   margin:0 10px; | ||||
| header > nav.menu ul li a { | ||||
|   color: white; | ||||
| 	text-decoration: none; | ||||
|   display: block; | ||||
| 	padding: 0.25rem 0; | ||||
| } | ||||
|  | ||||
| .column li { | ||||
|   list-style:none; | ||||
|   padding: .25em 0em; | ||||
|   font-size: 85%; | ||||
| header > nav.menu ul li a:hover { | ||||
| 	border-bottom: thin solid white; | ||||
| 	padding: 0.15rem 0; | ||||
| 	-webkit-transition: 0.3s ease-in-out color; | ||||
| 	-moz-transition: 0.3s ease-in-out color; | ||||
| 	transition: 0.3s ease-in-out color; | ||||
| } | ||||
|  | ||||
| .thick_bar { | ||||
|   width:100%; | ||||
|   background-color: #4D4D4D; /* HPR Grey */ | ||||
|   color: white; | ||||
|   float:left;    | ||||
|   clear: both; | ||||
|   height:1.5em; | ||||
|   padding: .5em 0em .5em 0em; | ||||
|   font-size: 1em; | ||||
|   margin: 1em 0em 1em 0em; | ||||
| header > nav.menu ul li a:visited{ | ||||
| 	color: #EDEDED; | ||||
| } | ||||
|  | ||||
| #more_info {margin: auto;} | ||||
| nav.column { display: block; padding: 0em 1em 0em 1em;} | ||||
| #copyright { | ||||
|   font-size: small; | ||||
|   width:100%; | ||||
|   float:left;    | ||||
| } | ||||
|  | ||||
| article, #copyright p { | ||||
|   padding: 0 10px; | ||||
| } | ||||
|  | ||||
| audio {padding: .7em 0em .5em 0em; clear: both; position: relative; z-index:auto;} | ||||
| .audcredit { font-size: 75%;margin-bottom: 1em;} | ||||
| h1.showtitle { font-size: 125%;} | ||||
|  | ||||
| /* Full Index Page styling */ | ||||
| #index_full h2.title { | ||||
| 	font-weight: lighter; | ||||
| 	margin-bottom: -.5em; | ||||
| 	padding: .5em 0em 0em 0em;  | ||||
| 	font-size: 110%;} | ||||
|  | ||||
| #index_full p.meta {font-size: 85%;} | ||||
|  | ||||
| #small { | ||||
|   font-size: small; | ||||
| } | ||||
|  | ||||
| p.author { font-size: 85%;} | ||||
| p.shownotes { padding: .5em;} | ||||
| #maincontent footer p { /* font-size: 75%; */ margin-bottom: 1em;} | ||||
| /* link styling */ | ||||
| a:link {text-decoration: none;} | ||||
|  | ||||
| table { | ||||
|     width:100%; | ||||
| } | ||||
| table, th, td { | ||||
|     border-collapse: collapse; | ||||
|     padding: 2px; | ||||
|     text-align: left; | ||||
| } | ||||
| table#t01, table#t01 th, table#t01 td { | ||||
|     border: 1px solid black; | ||||
| } | ||||
| table#t01 th, table#t01 td { | ||||
|     padding: 5px; | ||||
|     text-align: left; | ||||
| } | ||||
| table#t01 tr:nth-child(even) { | ||||
|     background-color: #eee; | ||||
| } | ||||
| table#t01 tr:nth-child(odd) { | ||||
|    background-color:#fff; | ||||
| } | ||||
| table#t01 th	{ | ||||
|     background-color: #4D4D4D; | ||||
|     color: white; | ||||
| a:active,  | ||||
| header > nav.menu ul li a:active { | ||||
| 	color: red; | ||||
| } | ||||
|  | ||||
| pre { /* Add background, border and scrollbar to <pre> */ | ||||
|   | ||||
		Reference in New Issue
	
	Block a user