From 68544e985f022946eea7abf0d74cb70e3b08c01a Mon Sep 17 00:00:00 2001 From: David Runge Date: Fri, 3 Apr 2015 05:56:51 +0200 Subject: sleepmap-theme/static/css/main.css: Adding the same menu styling for the footer as for the banner. --- sleepmap-theme/static/css/main.css | 105 +++++++++++++++++++++++++++++++++++-- 1 file changed, 101 insertions(+), 4 deletions(-) (limited to 'sleepmap-theme') diff --git a/sleepmap-theme/static/css/main.css b/sleepmap-theme/static/css/main.css index 4e86a63..3e6ed2f 100644 --- a/sleepmap-theme/static/css/main.css +++ b/sleepmap-theme/static/css/main.css @@ -174,9 +174,9 @@ img.left, figure.left {float: right; margin: 0 0 2em 2em;} color: #C74350; text-shadow: none; } - + #banner h1 strong {font-size: 0.36em; font-weight: normal;} - + /* Main Nav */ #banner nav { background: #000305; @@ -186,12 +186,11 @@ img.left, figure.left {float: right; margin: 0 0 2em 2em;} margin: 0 auto 2em auto; padding: 0; width: 90%; - border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } - + #banner nav ul ul { display:none; list-style: none; @@ -415,6 +414,104 @@ img.left, figure.left {float: right; margin: 0 0 2em 2em;} margin: 20px auto; } + #footer nav { + background: #000305; + font-size: 1.143em; + height: 40px; + line-height: 30px; + margin: 0 auto 2em auto; + padding: 0; + width: 90%; + border-radius: 5px; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + } + + #footer nav ul ul { + display:none; + list-style: none; + margin: 0 auto; + } + + #footer nav ul li:hover > ul { + display:block; + } + + #footer nav ul { + list-style: none; + margin: 0 auto; + box-shadow: 0px 0px 9px rgba(0,0,0,0.15); + padding: 0 6px; + border-radius: 10px; + list-style: none; + position: absolute; + display: inline-table; + } + + #footer nav ul:after { + content: ""; clear: both; display: block; + } + + #footer nav ul li { + float: left; + } + #footer nav ul li:hover { + background: #4b545f; + background: linear-gradient(top, #4f5964 0%, #5f6975 40%); + background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); + background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); + } + + #footer nav ul li a { + display: block; + padding: 25px 40px; + text-decoration: none; + } + + #footer nav ul ul { + background: #5f6975; + border-radius: 0px; + padding: 0; + position: absolute; + top: 100%; + } + #footer nav ul ul li { + float: none; + border-top: 1px solid #6b727c; + border-bottom: 1px solid #575f6a; + position: relative; + } + #footer nav ul ul li a { + padding: 15px 40px; + color: #fff; + } + #footer nav ul ul li:hover { + background: #db2d2b; + } + #footer nav ul ul li a:hover { + background: #db2d2b; + } + #footer nav ul ul ul { + position: absolute; left: 100%; top:0; + } + #footer nav ul ul li.active { + background: #db2d2b; + } + + #footer nav a:link, #footer nav a:visited { + color: #fff; + display: inline-block; + height: 30px; + padding: 5px 1.5em; + text-decoration: none; + } + #footer nav a:hover, #footer nav a:active, #footer nav .active li:link + #footer nav .active a:link, #footer nav .active a:visited { + background: #C74451; + background: #db2d2b; + color: #fff; + text-shadow: none !important; + } /***** Sections *****/ /* Blog */ .hentry { -- cgit v1.2.3-54-g00ecf