diff --git a/static/css/header.css b/static/css/header.css index b5dedc0..e74897b 100644 --- a/static/css/header.css +++ b/static/css/header.css @@ -1,228 +1,375 @@ -#barra-brasil #wrapper-barra-brasil .brasil-flag{ - height: auto; +#header { + font-size: 62.5%; + font-family: "open_sansregular", Arial, Helvetica, sans-serif; + padding: 14px 0 0 0; + background-color: #EAEDF0; + color: #fff; + min-width: 960px; } -#first-nav{ - background-color:#f0f2f1; - background-color:#ecedf1; - background-image: -webkit-radial-gradient(center, ellipse cover, #f0f2f1 1%, #ecedf1 100%) +#header * { + margin: 0; + padding: 0; + list-style: none; } -/* Accessibility */ + +#header a { + text-decoration: none; +} + +#header > div { + position: relative; + margin: 0 auto; + max-width: 960px; + display: block; +} + +#header * li { + display: inline; +} #accessibility { - font-family: arial; - font-size: 10px; + /*font-size: 1.1em;*/ + font-size: 1.3em; + font-family: Arial, Helvetica, sans-serif; + display: block; + float: left; + width: 50%; + margin-bottom: 18px; +} + +#accessibility a { + color: #2C65CD; + margin-right: 9px; +} + +#accessibility span { + padding: 0 3px; + background: #2C65CD; + color: #fff; } -#accessibility a{ - padding-left: 4px; - padding-right: 4px; - color: #2c66ce; +#second-nav { + float: right; } -#accessibility span{ - background-color: #2c66ce; +#portal-siteactions, +#portal-language { + border-bottom: 1px dotted #2C65CD; } -#colab-portal-siteactions{ - font-size: 10px; - text-align: center; +#portal-siteactions #siteaction-accessibility a { + padding-left: 0; } -#colab-portal-siteactions li{ - display: inline-block; +#portal-siteactions { + display: block; + /*float: right;*/ + float: left; + clear: none; + padding-bottom: 2px; + /*font-size: 1.1em;*/ + font-size: 1.3em; } -#colab-portal-siteactions a { - color:#2c66ce; - text-decoration: none; - text-transform: uppercase; - font-family: 'Open Sans Regular', Arial, Helvetica, sans-serif; - padding-right: 0; - padding-left: 10px; +#portal-siteactions a { + padding: 4px 0 4px 17px; } -#colab-portal-siteactions #colab-siteaction-mapadosite a{ - padding-right: 0; +#portal-siteactions a, +#login-menu a { + text-decoration: none; + text-transform: uppercase; } -#colab-portal-siteactions a:hover { - color: #03316f; +#portal-siteactions a, +#portal-siteactions a:hover, +#portal-language a, +#portal-language a:hover { + color: #2C65CD; } -#colab-portal-siteactions span { - border-bottom: 1px dotted #2c66ce; +#login-menu #user-menu a { + position: relative; + top: -6px; } -/* User-bar */ +#login-menu #user-menu .user img { + width: 32px; + height: 32px; + border-radius: 90%; +} -#user-menu a.btn { - font-size: 13px; - padding: 10px; - background-color: #2c66ce; - border-color: #2c66ce; - color: #FFF; +#login-menu #user-menu .user .carret { + vertical-align: middle; } -#user-menu .dropdown-menu{ - border-radius: 5px; +#login-menu { + float:right; + display: block; + clear: none; + padding-bottom: 2px; + font-size: 1.3em; + padding-left: 17px; } -#user-menu .dropdown-toggle img{ - border-radius: 20px; +#login-menu a { + padding: 4px 0 4px 6px; + font-weight: bold; } -#user-menu .user .caret, #menu-spb a .caret { - border-left: 5px solid transparent; - border-right: 5px solid transparent; - border-top: 5px solid #2c66ce; +#login-menu-box { + right: 0; + left: auto; } -#user-menu a:hover .caret, #menu-spb a:hover .caret, #user-menu a:focus .caret, #menu-spb a:focus .caret{ - border-left: 5px solid transparent; - border-right: 5px solid transparent; - border-top: 5px solid #03316f; +#portal-searchbox { + border: 1px solid #CCC; + float: right; + clear: right; + margin: 18px 0 0 0; + padding: 2px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + background: #fff; + text-align: right; + font-size: 1em; + color: #777; +} +#portal-searchbox form { + white-space: nowrap; } -/* Brand and search */ +.LSBox { + margin: 0; + padding: 0; + border: none; +} -#spb-logo-search { - margin-top: 10px; - margin-bottom: 10px; +fieldset, .editionComment { + line-height: 1.5em; + margin: 1em 0; + padding: 0 1em 1em; + width: auto; } -#spb-logo-search .logo-box{ - padding-bottom: 20px; +.hiddenStructure { + display: block; + background: transparent; + background-image: none; + border: none; + height: 0.1em; + overflow: hidden; + padding: 0; + margin: -0.1em 0 0 -0.1em; + width: 1px; } -#portal-logo img{ - max-height: 50px; +#portal-searchbox label { + font-weight: normal; + cursor: default; } -.box-search{ - margin: auto; - margin-top: 10px; +#portal-searchbox .searchField { + padding: 0.3em 0.35em; + width: 186px; + border: none; + border-right: none; + /*font-size: 1.2em;*/ + font-size: 1.4em; + font-family: "open_sansregular", Arial, Helvetica, sans-serif; } -#search-form .form-group{ - float: left; +#header input.searchButton { + /*background-position: 0px 2px;*/ + background-position: 00 0; + /*padding: 4px 5px 4px 15px;*/ + padding: 6px 5px 4px 15px; + border: none; + background-color: transparent; + text-indent: -2000px; } -#search-form button.btn.btn-default{ - float: left; - border-radius: 0px 5px 5px 0px; - border-left: none; - color: #2c66ce; +#logo { + float: left; + padding: 0; + width: 70%; + min-height: 104px; } -#search-form button.btn.btn-default:hover{ - background: #fff; - border: 1px solid #cccccc; - border-left: none; - color: #03316f; +#logo span { + position: absolute; + display: block; + /*line-height: 1em;*/ + line-height: 1.1em; } -#search-form #header-searchbox{ - width: 100%; - border-radius: 5px 0px 0px 5px; - background: #fff; +#logo a, #logo #portal-title { + color: #2C65CD; } -/* Menu */ +#portal-title { + /*font-size: 4.0em;*/ + font-size: 4.2em; + font-family: "open_sansextrabold", Arial, Helvetica, sans-serif; + margin-top: 9px; +} -#second-nav { - background-color:#CFD0D2; - min-height: 30px; - line-height: 30px; - font-size: 12px; - border-radius: 0; - margin-bottom: 0; +#portal-title-1, +#portal-description { + font-family: "open_sansregular", Arial, Helvetica, sans-serif; +} + +#portal-title-1 { + /*font-size: 1.2em;*/ + font-size: 1.4em; } -#second-nav a { - color: #2c66ce; - font-family: 'Open Sans', Arial, Helvetica, sans-serif; +#portal-description { + /*font-size: 1.4em;*/ + font-size: 1.6em; } -#menu-spb > li > a{ - padding: 5px 15px 5px 5px; +#sobre { + background: #D9DBDE; + clear: both; + margin: 0; + padding: 7px 0; + max-width: 100% !important; + position: relative; } -#menu-spb ul.dropdown-menu { - background: #CFD0D2; - border-color: #CFD0D2; - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1); - font-size: 12px; +#sobre ul { + margin: 0 auto; + max-width: 960px; + text-align: right; +} + +#sobre a { + color: #2C65CD; + /*font-size: 1.2em;*/ + font-size: 1.4em; +} + +#sobre .softwarepublico-item a { + padding: 0 8px; +} + +#sobre .softwarepublico-item .dropdown-menu { + margin-top: 10px; +} + + +#sobre .softwarepublico-item .dropdown-menu:before { + position: absolute; + top: -7px; + left: 20px; + display: inline-block; + border-right: 7px solid transparent; + border-bottom: 7px solid #ccc; + border-left: 7px solid transparent; + border-bottom-color: rgba(0, 0, 0, 0.2); + content: ''; +} + +#sobre .softwarepublico-item .dropdown-menu:after { + position: absolute; + top: -6px; + left: 21px; + display: inline-block; + border-right: 6px solid transparent; + border-bottom: 6px solid #fff; + border-left: 6px solid transparent; + content: ''; +} + +#sobre .softwarepublico-item .dropdown-menu li { + font-size: 0.65em; + text-align: left; + border-right: none; +} + +#sobre .softwarepublico-item .dropdown-menu li a { + border-bottom: 1px solid #EAEDF0; + padding: 8px; +} + + +#sobre .softwarepublico-item a { + border-right: 0; + padding: 0 8px; } -#menu-spb ul.dropdown-menu a{ - color: #03316f; +#sobre .softwarepublico-item li a:hover { + background: #EAEDF0; } -#menu-spb ul.dropdown-menu a:hover{ - color:#2c66ce; +#sobre .last-item a { + padding: 0 0 0 8px; + border-right: none; } -#menu-spb .open > a, #menu-spb .open > a:hover, #menu-spb .open > a:focus{ - background: none; +#social-icons { + float: right; + clear: right; + margin: 13px 0 22px 0; + display: none; } -#quick-links{ - padding-right: 10px +#social-icons a, +#header input.searchButton { + background-image: url("../img/sprite.png"); } -#quick-links > li > a{ - margin: 5px 0; - padding: 0 15px; - border-right: 1px solid #2c66ce; +#social-icons a { + display: block; + overflow: hidden; + margin: 0 0 0 2px; + width: 20px; + height: 20px; + border: none; + text-indent: 100%; + white-space: nowrap; + opacity: .85; + filter: alpha(opacity=85); + border-radius: 4px; } -#quick-links li:last-child > a{ - padding-right: 5px; - border-right: none; +#social-icons li { + display: inline-block; } -#quick-links a:hover, #menu-spb a:focus , #menu-spb a:hover { - color: #03316f; - background: none; +#portalredes-facebook a { + background-position: -80px -25px; } -/* Menu collapsed elements */ -.navbar-toggle .icon-bar{ - background-color: #2c66ce; - margin: auto; +#portalredes-googleplus a { + background-position: -130px 0; } -.navbar-header.logo .navbar-toggle{ - float: left; - margin: 0; +#portalredes-instagram a { + background-position: 69px -49px; } -#quick-links-sm{ - list-style: none; - float: right; - margin: 0; +#portalredes-twitter a { + background-position: -155px -25px; } -#quick-links-sm li{ - display: inline-block; +#portalredes-youtube a { + background-position: -130px -25px; } -#quick-links-sm > li > a{ - margin: 5px 0; - padding: 0 15px; - border-right: 1px solid #2c66ce; - text-decoration: none; +#portalredes-soundcloud a { + background-position: 20px 0; } -#quick-links-sm li:last-child > a{ - padding-right: 5px; - border-right: none; +#portalredes-slideshare a { + background-position: 45px 0; } -#quick-links-sm a:hover{ - color: #03316f; - background: none; +#portalredes-rss a { + background-position: 145px -25px; } diff --git a/templates/header.html b/templates/header.html index d3e0cb3..10685a8 100644 --- a/templates/header.html +++ b/templates/header.html @@ -2,135 +2,164 @@ {% load static from staticfiles %}
-
+ +{% block main_content %} + +{% endblock %} -- libgit2 0.21.2