Commit c7782905e06050c279f7e4d9c450c963455e895c

Authored by Sergio Oliveira
1 parent 2518f3d9
Exists in spb-release/3.0

New header

Signed-off-by: Charles Oliveira <18oliveira.charles@gmail.com>
Signed-off-by: Melissa Wen <melissa.srw@gmail.com>
Signed-off-by: Peter Lima <peterlima@gmail.com>
Signed-off-by: Sergio Oliveira <sergio@tracy.com.br>
colab/static/css/header.css
1   -#barra-brasil #wrapper-barra-brasil .brasil-flag{
2   - height: auto;
  1 +header #header {
  2 + font-size: 62.5%;
  3 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  4 + padding: 14px 0 0 0;
  5 + background-color: #EAEDF0;
  6 + color: #fff;
  7 + min-width: 960px;
3 8 }
4 9  
5   -#first-nav{
6   - background-color:#f0f2f1;
7   - background-color:#ecedf1;
8   - background-image: -webkit-radial-gradient(center, ellipse cover, #f0f2f1 1%, #ecedf1 100%)
  10 +header #header * {
  11 + margin: 0;
  12 + padding: 0;
  13 + list-style: none;
9 14 }
10 15  
11   -/* Accessibility */
  16 +header #header a {
  17 + text-decoration: none;
  18 +}
12 19  
13   -#accessibility {
14   - font-family: arial;
15   - font-size: 10px;
  20 +header #header > div {
  21 + position: relative;
  22 + margin: 0 auto;
  23 + max-width: 960px;
  24 + display: block;
16 25 }
17 26  
18   -#accessibility a{
19   - padding-left: 4px;
20   - padding-right: 4px;
21   - color: #2c66ce;
  27 +header #header * li {
  28 + display: inline;
22 29 }
23 30  
24   -#accessibility span{
25   - background-color: #2c66ce;
  31 +header #accessibility {
  32 + /*font-size: 1.1em;*/
  33 + font-size: 1.2em;
  34 + font-family: Arial, Helvetica, sans-serif;
  35 + display: block;
  36 + float: left;
  37 + width: 45%;
  38 + margin-bottom: 18px;
26 39 }
27 40  
28   -#colab-portal-siteactions{
29   - font-size: 10px;
30   - text-align: center;
  41 +header #accessibility a {
  42 + color: #2C65CD;
  43 + margin-right: 9px;
31 44 }
32 45  
33   -#colab-portal-siteactions li{
34   - display: inline-block;
  46 +header #accessibility span {
  47 + padding: 0 3px;
  48 + background: #2C65CD;
  49 + color: #fff;
35 50 }
36 51  
37   -#colab-portal-siteactions a {
38   - color:#2c66ce;
  52 +header #second-nav {
  53 + float: right;
  54 +}
  55 +
  56 +header #portal-siteactions,
  57 +header #portal-language {
  58 + border-bottom: 1px dotted #2C65CD;
  59 +}
  60 +
  61 +header #portal-siteactions #siteaction-accessibility a {
  62 + padding-left: 0;
  63 +}
  64 +
  65 +header #portal-siteactions {
  66 + display: block;
  67 + float: left;
  68 + clear: none;
  69 + padding-bottom: 2px;
  70 + font-size: 1.3em;
  71 +}
  72 +
  73 +header #portal-siteactions a {
  74 + padding: 4px 0 4px 17px;
39 75 text-decoration: none;
40 76 text-transform: uppercase;
41   - font-family: 'Open Sans Regular', Arial, Helvetica, sans-serif;
42   - padding-right: 0;
43   - padding-left: 10px;
44 77 }
45 78  
46   -#colab-portal-siteactions #colab-siteaction-mapadosite a{
47   - padding-right: 0;
  79 +header #portal-siteactions a,
  80 +header #portal-siteactions a:hover,
  81 +header #portal-language a,
  82 +header #portal-language a:hover {
  83 + color: #2C65CD;
48 84 }
49 85  
50   -#colab-portal-siteactions a:hover {
51   - color: #03316f;
  86 +header #login-menu #user-menu .user {
  87 + position: relative;
  88 + top: -6px;
52 89 }
53 90  
54   -#colab-portal-siteactions span {
55   - border-bottom: 1px dotted #2c66ce;
  91 +header #login-menu #user-menu .user img {
  92 + width: 32px;
  93 + height: 32px;
  94 + border-radius: 90%;
56 95 }
57 96  
58   -/* User-bar */
  97 +header #login-menu #user-menu .user .carret {
  98 + vertical-align: middle;
  99 +}
  100 +
  101 +header #login-menu {
  102 + float:right;
  103 + display: block;
  104 + clear: none;
  105 + padding-bottom: 2px;
  106 + font-size: 1.3em;
  107 + padding-left: 17px;
  108 +}
  109 +
  110 +header #login-menu a {
  111 + font-size: 12px;
  112 + padding: 5px 10px;
  113 + color: #2C65CD;
  114 +}
59 115  
60   -#user-menu a.btn {
61   - font-size: 13px;
62   - padding: 10px;
63   - background-color: #2c66ce;
64   - border-color: #2c66ce;
  116 +header #login-menu a.btn-spb-profile {
  117 + background-color: #2C65CD;
  118 + border-color: #2C65CD;
65 119 color: #FFF;
66 120 }
67 121  
68   -#user-menu .dropdown-menu{
69   - border-radius: 5px;
  122 +header #login-menu .login-item a {
  123 + text-transform: uppercase;
  124 + font-size: 11px;
70 125 }
71 126  
72   -#user-menu .dropdown-toggle img{
73   - border-radius: 20px;
  127 +header #login-menu-box {
  128 + right: 0;
  129 + left: auto;
74 130 }
75 131  
76   -#user-menu .user .caret, #menu-spb a .caret {
77   - border-left: 5px solid transparent;
78   - border-right: 5px solid transparent;
79   - border-top: 5px solid #2c66ce;
  132 +header #portal-searchbox {
  133 + border: 1px solid #CCC;
  134 + float: right;
  135 + clear: right;
  136 + margin: 14px 0 0 0;
  137 + padding: 0px 2px;
  138 + -webkit-border-radius: 5px;
  139 + -moz-border-radius: 5px;
  140 + border-radius: 5px;
  141 + background: #fff;
  142 + text-align: right;
  143 + font-size: 1em;
  144 + color: #777;
80 145 }
81 146  
82   -#user-menu a:hover .caret, #menu-spb a:hover .caret, #user-menu a:focus .caret, #menu-spb a:focus .caret{
83   - border-left: 5px solid transparent;
84   - border-right: 5px solid transparent;
85   - border-top: 5px solid #03316f;
  147 +header #portal-searchbox form {
  148 + white-space: nowrap;
  149 +}
86 150  
  151 +header .LSBox {
  152 + margin: 0;
  153 + padding: 0;
  154 + border: none;
87 155 }
88 156  
89   -/* Brand and search */
  157 +header fieldset, header .editionComment {
  158 + line-height: 1.5em;
  159 + margin: 1em 0;
  160 + padding: 0 1em 1em;
  161 + width: auto;
  162 +}
90 163  
91   -#spb-logo-search {
92   - margin-top: 10px;
93   - margin-bottom: 10px;
  164 +header .hiddenStructure {
  165 + display: block;
  166 + background: transparent;
  167 + background-image: none;
  168 + border: none;
  169 + height: 0.1em;
  170 + overflow: hidden;
  171 + padding: 0;
  172 + margin: -0.1em 0 0 -0.1em;
  173 + width: 1px;
94 174 }
95 175  
96   -#spb-logo-search .logo-box{
97   - padding-bottom: 20px;
  176 +header #portal-searchbox label {
  177 + font-weight: normal;
  178 + cursor: default;
98 179 }
99 180  
100   -#portal-logo img{
101   - max-height: 50px;
  181 +header #portal-searchbox .searchField {
  182 + padding: 0.4em 0.35em 0 0.35em;
  183 + width: 192px;
  184 + border: none;
  185 + border-right: none;
  186 + font-size: 1.4em;
  187 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
102 188 }
103 189  
104   -.box-search{
105   - margin: auto;
106   - margin-top: 10px;
  190 +header #header input.searchButton {
  191 + background-position: 0px 1px;
  192 + padding: 5px 10px 6px 15px;
  193 + border: none;
  194 + background-color: transparent;
  195 + text-indent: -2000px;
107 196 }
108 197  
109   -#search-form .form-group{
  198 +header #logo {
110 199 float: left;
  200 + padding: 0;
  201 + width: 70%;
  202 + min-height: 101px;
111 203 }
112 204  
113   -#search-form button.btn.btn-default{
114   - float: left;
115   - border-radius: 0px 5px 5px 0px;
116   - border-left: none;
117   - color: #2c66ce;
  205 +header #logo span {
  206 + position: absolute;
  207 + display: block;
  208 + line-height: 0.5em;
118 209 }
119 210  
120   -#search-form button.btn.btn-default:hover{
121   - background: #fff;
122   - border: 1px solid #cccccc;
123   - border-left: none;
124   - color: #03316f;
  211 +header #logo a, header #logo #portal-title {
  212 + color: #2C65CD;
125 213 }
126 214  
127   -#search-form #header-searchbox{
128   - width: 100%;
129   - border-radius: 5px 0px 0px 5px;
130   - background: #fff;
  215 +header #portal-title {
  216 + font-size: 4.4em;
  217 + font-family: "open_sansextrabold", Arial, Helvetica, sans-serif;
  218 + margin-top: 13px;
131 219 }
132 220  
133   -/* Menu */
  221 +header #portal-title-1,
  222 +header #portal-description {
  223 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  224 +}
134 225  
135   -#second-nav {
136   - background-color:#CFD0D2;
137   - min-height: 30px;
138   - line-height: 30px;
139   - font-size: 12px;
140   - border-radius: 0;
141   - margin-bottom: 0;
  226 +header #portal-description {
  227 + font-size: 1.6em;
  228 + margin-top: 10px;
  229 + letter-spacing: 0.2px;
142 230 }
143 231  
144   -#second-nav a {
145   - color: #2c66ce;
146   - font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  232 +header #portal-title-1 {
  233 + /*font-size: 1.2em;*/
  234 + font-size: 1.4em;
147 235 }
148 236  
149   -#menu-spb > li > a{
150   - padding: 5px 15px 5px 5px;
  237 +header #social-icons {
  238 + float: right;
  239 + clear: right;
  240 + margin: 13px 0 22px 0;
  241 + display: none;
151 242 }
152 243  
153   -#menu-spb ul.dropdown-menu {
154   - background: #CFD0D2;
155   - border-color: #CFD0D2;
156   - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
157   - font-size: 12px;
  244 +header #social-icons a,
  245 +header #header input.searchButton {
  246 + background-image: url("../img/sprite.png");
158 247 }
159 248  
160   -#menu-spb ul.dropdown-menu a{
161   - color: #03316f;
  249 +header #social-icons a {
  250 + display: block;
  251 + overflow: hidden;
  252 + margin: 0 0 0 2px;
  253 + width: 20px;
  254 + height: 20px;
  255 + border: none;
  256 + text-indent: 100%;
  257 + white-space: nowrap;
  258 + opacity: .85;
  259 + filter: alpha(opacity=85);
  260 + border-radius: 4px;
162 261 }
163 262  
164   -#menu-spb ul.dropdown-menu a:hover{
165   - color:#2c66ce;
  263 +header #portalredes-facebook a {
  264 + background-position: -80px -25px;
166 265 }
167 266  
168   -#menu-spb .open > a, #menu-spb .open > a:hover, #menu-spb .open > a:focus{
169   - background: none;
  267 +header #portalredes-googleplus a {
  268 + background-position: -130px 0;
170 269 }
171 270  
172   -#quick-links{
173   - padding-right: 10px
  271 +header #portalredes-instagram a {
  272 + background-position: 69px -49px;
174 273 }
175 274  
176   -#quick-links > li > a{
177   - margin: 5px 0;
178   - padding: 0 15px;
179   - border-right: 1px solid #2c66ce;
  275 +header #portalredes-twitter a {
  276 + background-position: -155px -25px;
180 277 }
181 278  
182   -#quick-links li:last-child > a{
183   - padding-right: 5px;
184   - border-right: none;
  279 +header #portalredes-youtube a {
  280 + background-position: -130px -25px;
185 281 }
186 282  
187   -#quick-links a:hover, #menu-spb a:focus , #menu-spb a:hover {
188   - color: #03316f;
189   - background: none;
  283 +header #portalredes-soundcloud a {
  284 + background-position: 20px 0;
190 285 }
191 286  
192   -/* Menu collapsed elements */
193   -.navbar-toggle .icon-bar{
194   - background-color: #2c66ce;
195   - margin: auto;
  287 +header #portalredes-slideshare a {
  288 + background-position: 45px 0;
196 289 }
197 290  
198   -.navbar-header.logo .navbar-toggle{
199   - float: left;
200   - margin: 0;
  291 +header #portalredes-rss a {
  292 + background-position: 145px -25px;
201 293 }
202 294  
203   -#quick-links-sm{
204   - list-style: none;
205   - float: right;
  295 +header .thumbnail {
  296 + min-width: 80px;
  297 + max-width: 80px;
  298 +}
  299 +
  300 +header #social-icons li {
  301 + display: inline-block;
  302 +}
  303 +
  304 +header #sobre {
  305 + background: #D9DBDE;
  306 + clear: both;
206 307 margin: 0;
  308 + padding: 6px 0 5px 0;
  309 + max-width: 100% !important;
  310 + position: relative;
  311 +}
  312 +
  313 +header #sobre ul {
  314 + margin: 0 auto;
  315 + max-width: 960px;
  316 + text-align: right;
  317 +}
  318 +
  319 +header #sobre a {
  320 + color: #2C65CD;
  321 + font-size: 1.4em;
207 322 }
208 323  
209   -#quick-links-sm li{
  324 +header #sobre a .caret {
  325 + border-top: 4px dashed #2C65CD;
  326 +}
  327 +
  328 +header #sobre .softwarepublico-item .dropdown-menu {
  329 + margin-top: 10px;
  330 +}
  331 +
  332 +
  333 +header #sobre .softwarepublico-item .dropdown-menu:before,
  334 +header #second-nav .softwarepublico-item .dropdown-menu:before {
  335 + position: absolute;
  336 + top: -7px;
  337 + left: 20px;
210 338 display: inline-block;
  339 + border-right: 7px solid transparent;
  340 + border-bottom: 7px solid #ccc;
  341 + border-left: 7px solid transparent;
  342 + border-bottom-color: rgba(0, 0, 0, 0.2);
  343 + content: '';
  344 +}
  345 +
  346 +header #sobre .softwarepublico-item .dropdown-menu:after,
  347 +header #second-nav .softwarepublico-item .dropdown-menu:after {
  348 + position: absolute;
  349 + top: -6px;
  350 + left: 21px;
  351 + display: inline-block;
  352 + border-right: 6px solid transparent;
  353 + border-bottom: 6px solid #fff;
  354 + border-left: 6px solid transparent;
  355 + content: '';
211 356 }
212 357  
213   -#quick-links-sm > li > a{
214   - margin: 5px 0;
215   - padding: 0 15px;
216   - border-right: 1px solid #2c66ce;
217   - text-decoration: none;
  358 +header #second-nav #login-menu-box {
  359 + top: 23px;
  360 + padding: 10px 4px;
218 361 }
219 362  
220   -#quick-links-sm li:last-child > a{
221   - padding-right: 5px;
  363 +header #user-menu .user-info span {
  364 + color: #172738;
  365 +}
  366 +
  367 +header #second-nav .softwarepublico-item .dropdown-menu:before {
  368 + left: auto;
  369 + right: 12px;
  370 +}
  371 +
  372 +header #second-nav .softwarepublico-item .dropdown-menu:after {
  373 + left: auto;
  374 + right: 13px;
  375 +}
  376 +
  377 +header #sobre .softwarepublico-item .dropdown-menu {
  378 + margin-top: 10px;
  379 +}
  380 +
  381 +header #sobre .softwarepublico-item .dropdown-menu li {
  382 + font-size: 0.65em;
  383 + text-align: left;
  384 + border-right: none;
  385 +}
  386 +
  387 +header #sobre .softwarepublico-item .dropdown-menu li a {
  388 + border-right: none;
  389 + border-bottom: 1px solid #EAEDF0;
  390 + padding: 8px;
  391 +}
  392 +
  393 +header #sobre .softwarepublico-item .dropdown-menu li:last-child a { border-bottom: none;
  394 +}
  395 +
  396 +header #sobre li.softwarepublico-item a {
  397 + border-right: 1px solid #EAEDF0;
  398 + /*border-right: 1px solid #2C65CD;*/
  399 + padding: 0 8px;
  400 +}
  401 +
  402 +header #sobre li.softwarepublico-item:last-child a {
222 403 border-right: none;
  404 + padding-right: 0;
223 405 }
224 406  
225   -#quick-links-sm a:hover{
226   - color: #03316f;
  407 +header #sobre .softwarepublico-item a {
  408 + border-right: 0;
  409 + padding: 0 8px;
  410 +}
  411 +
  412 +header #sobre .softwarepublico-item a:hover {
227 413 background: none;
  414 + opacity: 0.8;
  415 +}
  416 +
  417 +header #sobre .last-item a {
  418 + padding: 0 0 0 8px;
  419 + border-right: none;
228 420 }
... ...
colab/static/css/screen.css
1 1 @import url(footer.css);
2 2 @import url(header.css);
3   -@import url(http://fonts.googleapis.com/css?family=Open+Sans);
  3 +@import url(font-awesome.min.css);
  4 +
  5 +@font-face {
  6 + font-weight: normal;
  7 + font-style: normal;
  8 + font-family: "open_sanslight";
  9 + src: url("fonts/opensans-300-webfont.eot");
  10 + src: url("fonts/opensans-300-webfont.eot?#iefix") format("embedded-opentype"),
  11 + url("fonts/opensans-300-webfont.woff") format("woff"),
  12 + url("fonts/opensans-300-webfont.ttf") format("truetype"),
  13 + url("fonts/opensans-300-webfont.svg#open_sanslight") format("svg");
  14 +}
  15 +
  16 +@font-face {
  17 + font-weight: normal;
  18 + font-style: normal;
  19 + font-family: "open_sansregular";
  20 + src: url("fonts/opensans-400-webfont.eot");
  21 + src: url("fonts/opensans-400-webfont.eot?#iefix") format("embedded-opentype"),
  22 + url("fonts/opensans-400-webfont.woff") format("woff"),
  23 + url("fonts/opensans-400-webfont.ttf") format("truetype"),
  24 + url("fonts/opensans-400-webfont.svg#open_sansregular") format("svg");
  25 +}
  26 +
  27 +@font-face {
  28 + font-weight: normal;
  29 + font-style: normal;
  30 + font-family: "open_sanssemibold";
  31 + src: url("fonts/opensans-600-webfont.eot");
  32 + src: url("fonts/opensans-600-webfont.eot?#iefix") format("embedded-opentype"),
  33 + url("fonts/opensans-600-webfont.woff") format("woff"),
  34 + url("fonts/opensans-600-webfont.ttf") format("truetype"),
  35 + url("fonts/opensans-600-webfont.svg#open_sanssemibold") format("svg");
  36 +}
  37 +
  38 +@font-face {
  39 + font-weight: normal;
  40 + font-style: normal;
  41 + font-family: "open_sansbold";
  42 + src: url("fonts/opensans-700-webfont.eot");
  43 + src: url("fonts/opensans-700-webfont.eot?#iefix") format("embedded-opentype"),
  44 + url("fonts/opensans-700-webfont.woff") format("woff"),
  45 + url("fonts/opensans-700-webfont.ttf") format("truetype"),
  46 + url("fonts/opensans-700-webfont.svg#open_sansbold") format("svg");
  47 +}
  48 +
  49 +@font-face {
  50 + font-weight: normal;
  51 + font-style: normal;
  52 + font-family: "open_sansextrabold";
  53 + src: url("fonts/opensans-800-webfont.eot");
  54 + src: url("fonts/opensans-800-webfont.eot?#iefix") format("embedded-opentype"),
  55 + url("fonts/opensans-800-webfont.woff") format("woff"),
  56 + url("fonts/opensans-800-webfont.ttf") format("truetype"),
  57 + url("fonts/opensans-800-webfont.svg#open_sansextrabold") format("svg");
  58 +}
4 59  
5 60 body {
6 61 padding-bottom: 0;
... ...
colab/static/img/acesso-a-informacao.png

3.75 KB | W: | H:

1.75 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
colab/static/img/brasil.png

6.53 KB | W: | H:

3 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
colab/static/img/fav.ico
No preview for this file type
colab/static/img/sprite.png 0 → 100644

12.8 KB

colab/static/img/voltar-topo.png 0 → 100644

292 Bytes

colab/templates/header.html
... ... @@ -2,135 +2,147 @@
2 2 {% load static from staticfiles %}
3 3  
4 4 <header>
5   -<div class="navbar navbar-static-top">
6   -<!-- begin of barra-brasil -->
7   -<div id="barra-brasil">
8   - <a href="https://brasil.gov.br" style="background:#7F7F7F; height: 20px; padding:4px 0 4px 10px; display: block; font-family:sans,sans-serif; text-decoration:none; color:white; ">Portal do Governo Brasileiro</a>
9   -</div>
10   -<script src="https://barra.brasil.gov.br/barra.js" type="text/javascript" defer async></script>
11   -<!-- end of barra-brasil -->
12   - <div id="first-nav">
13   - <div class="container">
14   - <div class="row">
15   - <div class="col-md-12">
16   - <ul id="accessibility" class="nav navbar-nav hidden-xs hidden-sm">
17   - <li>
18   - <a id="link-conteudo" href="#main-content" accesskey="1">Ir para o conteúdo <span class="label label-primary">1</span></a>
19   - </li>
20   - <li>
21   - <a id="link-navegacao" href="#menu-spb" accesskey="2">Ir para o menu <span class="label label-primary">2</span></a>
22   - </li>
23   - <li> <a id="link-buscar" accesskey="3" href="#header-searchbox" title="Go to search">Ir para a busca <span class="label label-primary">3</span></a>
24   - </li>
25   - <li>
26   - <a id="link-rodape" href="#link-top" accesskey="4">Ir para o rodapé <span class="label label-primary">4</span></a>
27   - </li>
28   - </ul> <!-- end of accesskeys -->
29   - <ul id="colab-portal-siteactions" class="nav navbar-nav navbar-right">
30   - <li id="colab-siteaction-accessibility">
31   - <a href="/software-publico-brasileiro/acessibilidade"><span>Acessibilidade</span></a>
32   - </li>
33   - <li id="colab-siteaction-contraste">
34   - <a href="#"><span>Alto Contraste</span></a>
35   - </li>
36   - <li id="colab-siteaction-mapadosite">
37   - <a href="/social/spb/mapa-do-site"><span>Mapa do site</span></a>
38   - </li>
39   - <!-- begin of user-menu -->
40   - {% if not user.is_authenticated %}
41   - <li class="dropdown hidden-xs hidden-lg">
42   - <a href="#" class="dropdown-toggle" data-toggle="dropdown">Acesso <b class="caret"></b></a>
43   - <ul class="dropdown-menu">
44   - {% trans 'Login' as login_text %}
45   - <li><a href="{% url 'signup' %}">{% trans "Register" %}</a></li>
46   - <li><a href="{% url 'login' %}">{% trans "Login" %}</a></li>
47   - </ul>
48   - </li>
49   - {% trans 'Login' as login_text %}
50   - <li class="visible-xs hidden-sm hidden-md"><a href="{% url 'signup' %}">{% trans "Register" %}</a></li>
51   - <li class="visible-xs hidden-sm hidden-md"><a href="{% url 'login' %}">{% trans "Login" %}</a></li>
52   - {% else %}
53   - <li id="user-menu" class="dropdown">
54   - <a href="#" class="dropdown-toggle user" data-toggle="dropdown">{% gravatar user.email 40 %} <b class="caret"></b>&nbsp;&nbsp;</a>
55   - <ul class="dropdown-menu" role="menu">
56   - <li>
  5 + <div id="barra-brasil">
  6 + <a href="http://brasil.gov.br" style="background:#7F7F7F; height: 20px; padding:4px 0 4px 10px; display: block; font-family:sans,sans-serif; text-decoration:none; color:white; ">Software Público Brasileiro</a>
  7 + </div>
  8 + <script src="//barra.brasil.gov.br/barra.js" type="text/javascript" defer async></script>
  9 + <div id="header" role="banner">
  10 + <div>
  11 + <ul id="accessibility">
  12 + <li>
  13 + <a accesskey="1" href="#acontent" id="link-conteudo">
  14 + Ir para o conteúdo
  15 + <span>1</span>
  16 + </a>
  17 + </li>
  18 + <li>
  19 + <a accesskey="2" href="#sobre" id="link-navegacao">
  20 + Ir para o menu
  21 + <span>2</span>
  22 + </a>
  23 + </li>
  24 + <li>
  25 + <a accesskey="3" href="#nolivesearchGadget" id="link-buscar">
  26 + Ir para a busca
  27 + <span>3</span>
  28 + </a>
  29 + </li>
  30 + <li class="last-item">
  31 + <a accesskey="4" href="#afooter" id="link-rodape">
  32 + Ir para o rodapé
  33 + <span>4</span>
  34 + </a>
  35 + </li>
  36 + </ul>
  37 + <div id="second-nav">
  38 + <ul id="portal-siteactions">
  39 + <li id="siteaction-accessibility">
  40 + <a href="/social/spb/acessibilidade" title="Acessibilidade" accesskey="5">
  41 + Acessibilidade
  42 + </a>
  43 + </li>
  44 + <li id="siteaction-contraste">
  45 + <a href="#" title="Alto Contraste" accesskey="6">
  46 + Alto Contraste
  47 + </a>
  48 + </li>
  49 + <li id="siteaction-mapadosite">
  50 + <a href="/social/spb/mapa-do-site" title="Mapa do Site" accesskey="7">
  51 + Mapa do Site
  52 + </a>
  53 + </li>
  54 + </ul>
  55 + <ul id="login-menu">
  56 + {% if not user.is_authenticated %}
  57 + <li class="login-item"><a href="{% url 'signup' %}">Cadastre-se</a></li>
  58 + <li class="login-item last-item"><a href="{% url 'login' %}">Entrar</a></li>
  59 + {% else %}
  60 + <li id="user-menu" class="dropdown softwarepublico-item">
  61 + <a href="#" class="dropdown-toggle user" data-toggle="dropdown">
  62 + {% gravatar user.email %} <b class="caret"></b>&nbsp;&nbsp;
  63 + </a>
  64 + <ul id="login-menu-box" class="dropdown-menu" role="menu">
  65 + <li class="last-item">
57 66 <div class="wrapper">
58   - <div class="thumbnail">{% gravatar user.email 100 %}</div>
59   - <div class="user-info">
60   - <span><b>{{ user.get_full_name }}</b></span>
61   - <span class="quiet">{{ user.email }}</span>
62   - </div>
63   - <div>
64   - <a class="btn btn-info pull-left" href="{% url 'user_profile' user.username %}">{% trans "My Profile" %}</a>
65   - {% trans 'Logout' as logout_text %}
66   - <a class="btn btn-default pull-right" href="{% url 'logout' %}"> {% trans "Logout" %}</a>
  67 + <div class="thumbnail">{% gravatar user.email %}</div>
  68 + <div class="user-info">
  69 + <span><b>{{ user.get_full_name }}</b></span>
  70 + <span class="quiet">{{ user.email }}</span>
  71 + </div>
  72 + <div>
  73 + <a class="btn btn-default btn-spb-profile pull-left" href="{% url 'user_profile' user.username %}">Meu perfil</a>
  74 + <a class="btn btn-default pull-right" href="{% url 'logout' %}">Sair</a>
67 75 </div>
68 76 </div>
69 77 </li>
70 78 </ul>
71   - </li> <!-- end of user-menu -->
72   - {% endif %}
73   - </ul>
74   - </div>
75   - </div> <!-- end of access-menu -->
76   - <div class="row" id="spb-logo-search">
77   - <div class="col-md-6 logo-box">
78   - <div id="logo">
79   - <a href="/" id="portal-logo">
80   - <img class="img-responsive pull-left" src="{% static 'img/logo.svg' %}" />
81   - </a>
82   - </div>
83   - </div>
84   - <div class="col-md-6">
85   - <div class="input-group box-search navbar-right">
86   - <form action="{% url 'haystack_search' %}" method="GET" id="search-form" class="navbar-form" role="search">
87   - <div class="form-group">
88   - <label class="sr-only" for="header-searchbox">{% trans 'Search...' %}</label>
89   - <input name="q" id="header-searchbox"
90   - class="form-control" value="{{ request.GET.q }}"
91   - type="search" placeholder="{% trans 'Search...' %}" />
92   - </div>
93   - <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
94   - </form>
95   - </div>
96   - </div>
  79 + </li>
  80 + {% endif %}
  81 + </ul>
97 82 </div>
98   - </div>
99   - </div><!-- end of first-nav -->
100   - <div id="second-nav">
101   - <div class="container">
102   - <div class="row">
103   - <ul id="quick-links-sm" class="hidden-md hidden-lg">
104   - <li id="link-faq">
105   - <a href="/social/spb/ajuda">FAQ</a>
  83 + <div id="logo">
  84 + <a id="portal-logo" title="" href="/">
  85 + <span id="portal-title-1">Portal do</span>
  86 + <h1 id="portal-title" class="corto">Software Público Brasileiro</h1>
  87 + <span id="portal-description">MINISTÉRIO DO PLANEJAMENTO, ORÇAMENTO E GESTÃO</span>
  88 + </a>
  89 + </div>
  90 + <div id="portal-searchbox">
  91 + <form id="nolivesearchGadget_form" action="{% url 'haystack_search' %}">
  92 + <fieldset class="LSBox"><legend class="hiddenStructure">Buscar no portal</legend>
  93 + <label class="hiddenStructure" for="nolivesearchGadget">Buscar no portal</label>
  94 + <input name="q" type="text" size="18" value="{{ request.GET.q }}" title="Buscar no portal" placeholder="Buscar no portal" class="searchField" id="nolivesearchGadget">
  95 + <input class="searchButton" type="submit" value="Buscar no portal">
  96 + </fieldset>
  97 + </form>
  98 + </div>
  99 + <div id="social-icons">
  100 + <ul>
  101 + <li id="portalredes-facebook" class="portalredes-item">
  102 + <a href="#">Facebook</a>
106 103 </li>
107   - <li id="link-contact">
108   - <a href="/social/spb/contato">Contato</a>
  104 + <li id="portalredes-googleplus" class="portalredes-item">
  105 + <a href="#">Google+</a>
109 106 </li>
110   - </ul>
111   - <div class="navbar-header logo">
112   - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
113   - <span class="icon-bar"></span>
114   - <span class="icon-bar"></span>
115   - <span class="icon-bar"></span>
116   - </button>
117   - </div>
118   - <ul id="menu-spb" class="nav navbar-nav navbar-collapse collapse ">
119   - <li>
120   - <a href="{% url 'thread_list' %}">{% trans "Groups" %}</a>
  107 + <li id="portalredes-instagram" class="portalredes-item">
  108 + <a href="#">Instagram</a>
121 109 </li>
122   - {% proxy_menu %}
123   - </ul>
124   - <ul id="quick-links" class="nav navbar-nav navbar-right hidden-xs hidden-sm">
125   - <li id="link-faq">
126   - <a href="/social/spb/ajuda">Perguntas Frequentes</a>
  110 + <li id="portalredes-twitter" class="portalredes-item">
  111 + <a href="#">Twitter</a>
  112 + </li>
  113 + <li id="portalredes-youtube" class="portalredes-item">
  114 + <a href="#">YouTube</a>
  115 + </li>
  116 + <li id="portalredes-soundcloud" class="portalredes-item">
  117 + <a href="#">SoundCloud</a>
127 118 </li>
128   - <li id="link-contact">
129   - <a href="/social/spb/contato">Contato</a>
  119 + <li id="portalredes-slideshare" class="portalredes-item">
  120 + <a href="#">Slideshare</a>
  121 + </li>
  122 + <li id="portalredes-rss" class="portalredes-item last-item">
  123 + <a href="#">RSS</a>
130 124 </li>
131 125 </ul>
132 126 </div>
133 127 </div>
  128 + <div id="sobre">
  129 + <ul>
  130 + <li id="softwarepublico-groups" class="softwarepublico-item">
  131 + <a href="{% url 'thread_list' %}" title="Listas de discussão">Listas de discussão</a>
  132 + </li>
  133 + {% proxy_menu %}
  134 + <li id="softwarepublico-perguntas-frequentes" class="softwarepublico-item">
  135 + <a href="/social/spb/ajuda" title="Perguntas frequentes">Perguntas frequentes</a>
  136 + </li>
  137 + <li id="softwarepublico-contato" class="softwarepublico-item">
  138 + <a href="/social/spb/contato" title="Contato">Contato</a>
  139 + </li>
  140 + </ul>
  141 + </div>
134 142 </div>
135   -</div>
136 143 </header>
  144 +
  145 +{% block main_content %}
  146 + <a name="acontent" id="acontent"></a>
  147 +{% endblock %}
  148 +
... ...