Mercurial > hg > nodescore
diff www/m/css/menu.css @ 23:e1a02869da08
reduced to one score file with menu to choose which part stream to receive
added latency results to client and tweeked some css
author | tzara <rc-web@kiben.net> |
---|---|
date | Wed, 11 Jul 2012 14:17:43 +0100 |
parents | |
children | ea19684cd1db |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/www/m/css/menu.css Wed Jul 11 14:17:43 2012 +0100 @@ -0,0 +1,154 @@ +#nav { + margin: 0; + padding: 1px 1px 0; + background: #7d7d7d; + line-height: 100%; + + border-radius: 1em; + -webkit-border-radius: 1em; + -moz-border-radius: 1em; + + -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4); + -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4); + position:absolute; + left: 0px; + bottom: 2px; +} +#nav li { + margin: 0 5px; + padding: 0 0 8px; + float: left; + position: relative; + list-style: none; +} + + +/* main level link */ +#nav a { + font-weight: bold; + color: #e7e5e5; + text-decoration: none; + display: block; + padding: 8px 20px; + margin: 0; + + -webkit-border-radius: 1.6em; + -moz-border-radius: 1.6em; + + text-shadow: 0 1px 1px rgba(0,0,0, .3); +} +#nav a:hover { + background: #000; + color: #fff; +} + +/* main level link hover */ +#nav .current a, #nav li:hover > a { + background: #666; + color: #444; + border-top: solid 1px #f8f8f8; + + -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); + -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2); + box-shadow: 0 1px 1px rgba(0,0,0, .2); + + text-shadow: 0 1px 0 rgba(255,255,255, 1); +} + +/* sub levels link hover */ +#nav ul li:hover a, #nav li:hover li a { + background: none; + border: none; + color: #666; + + -webkit-box-shadow: none; + -moz-box-shadow: none; +} +#nav ul a:hover { + background: #0078ff !important; + color: #fff !important; + + -webkit-border-radius: 0; + -moz-border-radius: 0; + + text-shadow: 0 1px 1px rgba(0,0,0, .1); +} + +/* dropdown */ +#nav li:hover > ul { + display: block; +} + +/* level 2 list */ +#nav ul { + display: none; + + margin: 0; + padding: 0; + width: 185px; + position: absolute; + top: -55px; + left: 0; + background: #ddd; + border: solid 1px #b4b4b4; + + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; + + -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3); + -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); + box-shadow: 0 1px 3px rgba(0,0,0, .3); +} +#nav ul li { + float: none; + margin: 0; + padding: 0; +} + +#nav ul a { + font-weight: normal; + text-shadow: 0 1px 0 #fff; +} + +/* level 3+ list */ +#nav ul ul { + left: 181px; + top: -3px; +} + +/* rounded corners of first and last link */ +#nav ul li:first-child > a { + -webkit-border-top-left-radius: 9px; + -moz-border-radius-topleft: 9px; + + -webkit-border-top-right-radius: 9px; + -moz-border-radius-topright: 9px; +} +#nav ul li:last-child > a { + -webkit-border-bottom-left-radius: 9px; + -moz-border-radius-bottomleft: 9px; + + -webkit-border-bottom-right-radius: 9px; + -moz-border-radius-bottomright: 9px; +} + +/* clearfix */ +#nav:after { + content: "."; + display: block; + clear: both; + visibility: hidden; + line-height: 0; + height: 0; +} +#nav { + display: inline-block; +} +html[xmlns] #nav { + display: block; +} + +* html #nav { + height: 1%; +} \ No newline at end of file