X-Git-Url: http://git.datanom.net/qtadmin.git/blobdiff_plain/6b3d5ba966ffd150d635a618593295958233baef..e9bc08fcf82464f04a3fc04be9ecbf301bb906ab:/css/styles.css?ds=sidebyside diff --git a/css/styles.css b/css/styles.css index 9ca44dd..9ef5969 100644 --- a/css/styles.css +++ b/css/styles.css @@ -39,16 +39,128 @@ td { padding: 2px 6px; } -body { - font-family: Verdana, Arial, Helvetica, sans-serif; +html body { +/* font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.9em; color: #3D658C; - background: white; + background: white;*/ + background-color: #EBE8E4; + color: #222; + font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; + font-weight: 300; + font-size: 15px; +} + +nav { + background-color: #fff; + border: 1px solid #dedede; + border-radius: 4px; + box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055); + color: #888; + display: block; + margin: 8px 22px 8px 22px; + overflow: hidden; + width: 90%; +} + +nav ul { + margin: 0; + padding: 0; +} + +nav ul li { + display: inline-block; + list-style-type: none; + webkit-transition: all 0.2s; + -moz-transition: all 0.2s; + -ms-transition: all 0.2s; + -o-transition: all 0.2s; + transition: all 0.2s; +} + + nav > ul > li > a > .caret { + border-top: 4px solid #aaa; + border-right: 4px solid transparent; + border-left: 4px solid transparent; + content: ""; + display: inline-block; + height: 0; + width: 0; + vertical-align: middle; + + -webkit-transition: color 0.1s linear; + -moz-transition: color 0.1s linear; + -o-transition: color 0.1s linear; + transition: color 0.1s linear; +} + +nav > ul > li > a { + color: #aaa; + display: block; + line-height: 56px; + padding: 0 24px; + text-decoration: none; +} + +nav > ul > li:hover { + background-color: rgb( 40, 44, 47 ); +} + +nav > ul > li:hover > a { + color: rgb( 255, 255, 255 ); +} + +nav > ul > li:hover > a > .caret { + border-top-color: rgb( 255, 255, 255 ); } +nav > ul > li > div { + background-color: rgb( 40, 44, 47 ); + border-top: 0; + border-radius: 0 0 4px 4px; + box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055); + display: none; + margin: 0; + opacity: 0; + position: absolute; + width: 165px; + visibility: hidden; + z-index: 100; + + -webkit-transiton: opacity 0.2s; + -moz-transition: opacity 0.2s; + -ms-transition: opacity 0.2s; + -o-transition: opacity 0.2s; + -transition: opacity 0.2s; +} + +nav > ul > li:hover > div { + display: block; + opacity: 1; + visibility: visible; +} + +nav > ul > li > div ul > li { + display: block; +} + +nav > ul > li > div ul > li > a { + color: #fff; + display: block; + padding: 12px 24px; + text-decoration: none; +} + +nav > ul > li > div ul > li:hover > a { + background-color: rgba( 255, 255, 255, 0.1); +} + + .total-rows { color: red; font-size: 0.8em; + margin: 0 auto 5px; + display: table; } .page-nav { @@ -60,13 +172,16 @@ body { margin-top: 5px; } -.footer { - text-align: center; - margin-top: 20px; - margin-bottom: 10px; +#container, #footer { + width: 100%; +} + +#footer{ font-size: 0.7em; background: #ECECAC; color: black; + text-align: center; + height: 14px; } .whitefooter { @@ -86,7 +201,7 @@ img { .nav-action { text-align: center; - width: 53px; + width: 58px; } .label {