Download as
Browse Code »

Commit e3f16d86d21fdb298e07f277f4f6a3538a0c90f2

Authored by Carlos Coêlho
1 parent 382da68c
Exists in master

Updated header due to SECOM guidelines 

Signed-off-by: Carlos Oliveira <carlospecter@gmail.com>
Signed-off-by: Peter Lima <peterlima@gmail.com>
Showing 2 changed files with 429 additions and 253 deletions   Show diff stats
static/css/header.css
  Diff comments   View file @e3f16d8
1   -#barra-brasil #wrapper-barra-brasil .brasil-flag{
2   - height: auto;
  1 +#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 * {
  11 + margin: 0;
  12 + padding: 0;
  13 + list-style: none;
9 14 }
10 15  
11   -/* Accessibility */
  16 +
  17 +#header a {
  18 + text-decoration: none;
  19 +}
  20 +
  21 +#header > div {
  22 + position: relative;
  23 + margin: 0 auto;
  24 + max-width: 960px;
  25 + display: block;
  26 +}
  27 +
  28 +#header * li {
  29 + display: inline;
  30 +}
12 31  
13 32 #accessibility {
14   - font-family: arial;
15   - font-size: 10px;
  33 + /*font-size: 1.1em;*/
  34 + font-size: 1.3em;
  35 + font-family: Arial, Helvetica, sans-serif;
  36 + display: block;
  37 + float: left;
  38 + width: 50%;
  39 + margin-bottom: 18px;
  40 +}
  41 +
  42 +#accessibility a {
  43 + color: #2C65CD;
  44 + margin-right: 9px;
  45 +}
  46 +
  47 +#accessibility span {
  48 + padding: 0 3px;
  49 + background: #2C65CD;
  50 + color: #fff;
16 51 }
17 52  
18   -#accessibility a{
19   - padding-left: 4px;
20   - padding-right: 4px;
21   - color: #2c66ce;
  53 +#second-nav {
  54 + float: right;
22 55 }
23 56  
24   -#accessibility span{
25   - background-color: #2c66ce;
  57 +#portal-siteactions,
  58 +#portal-language {
  59 + border-bottom: 1px dotted #2C65CD;
26 60 }
27 61  
28   -#colab-portal-siteactions{
29   - font-size: 10px;
30   - text-align: center;
  62 +#portal-siteactions #siteaction-accessibility a {
  63 + padding-left: 0;
31 64 }
32 65  
33   -#colab-portal-siteactions li{
34   - display: inline-block;
  66 +#portal-siteactions {
  67 + display: block;
  68 + /*float: right;*/
  69 + float: left;
  70 + clear: none;
  71 + padding-bottom: 2px;
  72 + /*font-size: 1.1em;*/
  73 + font-size: 1.3em;
35 74 }
36 75  
37   -#colab-portal-siteactions a {
38   - color:#2c66ce;
39   - text-decoration: none;
40   - text-transform: uppercase;
41   - font-family: 'Open Sans Regular', Arial, Helvetica, sans-serif;
42   - padding-right: 0;
43   - padding-left: 10px;
  76 +#portal-siteactions a {
  77 + padding: 4px 0 4px 17px;
44 78 }
45 79  
46   -#colab-portal-siteactions #colab-siteaction-mapadosite a{
47   - padding-right: 0;
  80 +#portal-siteactions a,
  81 +#login-menu a {
  82 + text-decoration: none;
  83 + text-transform: uppercase;
48 84 }
49 85  
50   -#colab-portal-siteactions a:hover {
51   - color: #03316f;
  86 +#portal-siteactions a,
  87 +#portal-siteactions a:hover,
  88 +#portal-language a,
  89 +#portal-language a:hover {
  90 + color: #2C65CD;
52 91 }
53 92  
54   -#colab-portal-siteactions span {
55   - border-bottom: 1px dotted #2c66ce;
  93 +#login-menu #user-menu a {
  94 + position: relative;
  95 + top: -6px;
56 96 }
57 97  
58   -/* User-bar */
  98 +#login-menu #user-menu .user img {
  99 + width: 32px;
  100 + height: 32px;
  101 + border-radius: 90%;
  102 +}
59 103  
60   -#user-menu a.btn {
61   - font-size: 13px;
62   - padding: 10px;
63   - background-color: #2c66ce;
64   - border-color: #2c66ce;
65   - color: #FFF;
  104 +#login-menu #user-menu .user .carret {
  105 + vertical-align: middle;
66 106 }
67 107  
68   -#user-menu .dropdown-menu{
69   - border-radius: 5px;
  108 +#login-menu {
  109 + float:right;
  110 + display: block;
  111 + clear: none;
  112 + padding-bottom: 2px;
  113 + font-size: 1.3em;
  114 + padding-left: 17px;
70 115 }
71 116  
72   -#user-menu .dropdown-toggle img{
73   - border-radius: 20px;
  117 +#login-menu a {
  118 + padding: 4px 0 4px 6px;
  119 + font-weight: bold;
74 120 }
75 121  
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;
  122 +#login-menu-box {
  123 + right: 0;
  124 + left: auto;
80 125 }
81 126  
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;
  127 +#portal-searchbox {
  128 + border: 1px solid #CCC;
  129 + float: right;
  130 + clear: right;
  131 + margin: 18px 0 0 0;
  132 + padding: 2px;
  133 + -webkit-border-radius: 5px;
  134 + -moz-border-radius: 5px;
  135 + border-radius: 5px;
  136 + background: #fff;
  137 + text-align: right;
  138 + font-size: 1em;
  139 + color: #777;
  140 +}
86 141  
  142 +#portal-searchbox form {
  143 + white-space: nowrap;
87 144 }
88 145  
89   -/* Brand and search */
  146 +.LSBox {
  147 + margin: 0;
  148 + padding: 0;
  149 + border: none;
  150 +}
90 151  
91   -#spb-logo-search {
92   - margin-top: 10px;
93   - margin-bottom: 10px;
  152 +fieldset, .editionComment {
  153 + line-height: 1.5em;
  154 + margin: 1em 0;
  155 + padding: 0 1em 1em;
  156 + width: auto;
94 157 }
95 158  
96   -#spb-logo-search .logo-box{
97   - padding-bottom: 20px;
  159 +.hiddenStructure {
  160 + display: block;
  161 + background: transparent;
  162 + background-image: none;
  163 + border: none;
  164 + height: 0.1em;
  165 + overflow: hidden;
  166 + padding: 0;
  167 + margin: -0.1em 0 0 -0.1em;
  168 + width: 1px;
98 169 }
99 170  
100   -#portal-logo img{
101   - max-height: 50px;
  171 +#portal-searchbox label {
  172 + font-weight: normal;
  173 + cursor: default;
102 174 }
103 175  
104   -.box-search{
105   - margin: auto;
106   - margin-top: 10px;
  176 +#portal-searchbox .searchField {
  177 + padding: 0.3em 0.35em;
  178 + width: 186px;
  179 + border: none;
  180 + border-right: none;
  181 + /*font-size: 1.2em;*/
  182 + font-size: 1.4em;
  183 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
107 184 }
108 185  
109   -#search-form .form-group{
110   - float: left;
  186 +#header input.searchButton {
  187 + /*background-position: 0px 2px;*/
  188 + background-position: 00 0;
  189 + /*padding: 4px 5px 4px 15px;*/
  190 + padding: 6px 5px 4px 15px;
  191 + border: none;
  192 + background-color: transparent;
  193 + text-indent: -2000px;
111 194 }
112 195  
113   -#search-form button.btn.btn-default{
114   - float: left;
115   - border-radius: 0px 5px 5px 0px;
116   - border-left: none;
117   - color: #2c66ce;
  196 +#logo {
  197 + float: left;
  198 + padding: 0;
  199 + width: 70%;
  200 + min-height: 104px;
118 201 }
119 202  
120   -#search-form button.btn.btn-default:hover{
121   - background: #fff;
122   - border: 1px solid #cccccc;
123   - border-left: none;
124   - color: #03316f;
  203 +#logo span {
  204 + position: absolute;
  205 + display: block;
  206 + /*line-height: 1em;*/
  207 + line-height: 1.1em;
125 208 }
126 209  
127   -#search-form #header-searchbox{
128   - width: 100%;
129   - border-radius: 5px 0px 0px 5px;
130   - background: #fff;
  210 +#logo a, #logo #portal-title {
  211 + color: #2C65CD;
131 212 }
132 213  
133   -/* Menu */
  214 +#portal-title {
  215 + /*font-size: 4.0em;*/
  216 + font-size: 4.2em;
  217 + font-family: "open_sansextrabold", Arial, Helvetica, sans-serif;
  218 + margin-top: 9px;
  219 +}
134 220  
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;
  221 +#portal-title-1,
  222 +#portal-description {
  223 + font-family: "open_sansregular", Arial, Helvetica, sans-serif;
  224 +}
  225 +
  226 +#portal-title-1 {
  227 + /*font-size: 1.2em;*/
  228 + font-size: 1.4em;
142 229 }
143 230  
144   -#second-nav a {
145   - color: #2c66ce;
146   - font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  231 +#portal-description {
  232 + /*font-size: 1.4em;*/
  233 + font-size: 1.6em;
147 234 }
148 235  
149   -#menu-spb > li > a{
150   - padding: 5px 15px 5px 5px;
  236 +#sobre {
  237 + background: #D9DBDE;
  238 + clear: both;
  239 + margin: 0;
  240 + padding: 7px 0;
  241 + max-width: 100% !important;
  242 + position: relative;
151 243 }
152 244  
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;
  245 +#sobre ul {
  246 + margin: 0 auto;
  247 + max-width: 960px;
  248 + text-align: right;
  249 +}
  250 +
  251 +#sobre a {
  252 + color: #2C65CD;
  253 + /*font-size: 1.2em;*/
  254 + font-size: 1.4em;
  255 +}
  256 +
  257 +#sobre .softwarepublico-item a {
  258 + padding: 0 8px;
  259 +}
  260 +
  261 +#sobre .softwarepublico-item .dropdown-menu {
  262 + margin-top: 10px;
  263 +}
  264 +
  265 +
  266 +#sobre .softwarepublico-item .dropdown-menu:before {
  267 + position: absolute;
  268 + top: -7px;
  269 + left: 20px;
  270 + display: inline-block;
  271 + border-right: 7px solid transparent;
  272 + border-bottom: 7px solid #ccc;
  273 + border-left: 7px solid transparent;
  274 + border-bottom-color: rgba(0, 0, 0, 0.2);
  275 + content: '';
  276 +}
  277 +
  278 +#sobre .softwarepublico-item .dropdown-menu:after {
  279 + position: absolute;
  280 + top: -6px;
  281 + left: 21px;
  282 + display: inline-block;
  283 + border-right: 6px solid transparent;
  284 + border-bottom: 6px solid #fff;
  285 + border-left: 6px solid transparent;
  286 + content: '';
  287 +}
  288 +
  289 +#sobre .softwarepublico-item .dropdown-menu li {
  290 + font-size: 0.65em;
  291 + text-align: left;
  292 + border-right: none;
  293 +}
  294 +
  295 +#sobre .softwarepublico-item .dropdown-menu li a {
  296 + border-bottom: 1px solid #EAEDF0;
  297 + padding: 8px;
  298 +}
  299 +
  300 +
  301 +#sobre .softwarepublico-item a {
  302 + border-right: 0;
  303 + padding: 0 8px;
158 304 }
159 305  
160   -#menu-spb ul.dropdown-menu a{
161   - color: #03316f;
  306 +#sobre .softwarepublico-item li a:hover {
  307 + background: #EAEDF0;
162 308 }
163 309  
164   -#menu-spb ul.dropdown-menu a:hover{
165   - color:#2c66ce;
  310 +#sobre .last-item a {
  311 + padding: 0 0 0 8px;
  312 + border-right: none;
166 313 }
167 314  
168   -#menu-spb .open > a, #menu-spb .open > a:hover, #menu-spb .open > a:focus{
169   - background: none;
  315 +#social-icons {
  316 + float: right;
  317 + clear: right;
  318 + margin: 13px 0 22px 0;
  319 + display: none;
170 320 }
171 321  
172   -#quick-links{
173   - padding-right: 10px
  322 +#social-icons a,
  323 +#header input.searchButton {
  324 + background-image: url("../img/sprite.png");
174 325 }
175 326  
176   -#quick-links > li > a{
177   - margin: 5px 0;
178   - padding: 0 15px;
179   - border-right: 1px solid #2c66ce;
  327 +#social-icons a {
  328 + display: block;
  329 + overflow: hidden;
  330 + margin: 0 0 0 2px;
  331 + width: 20px;
  332 + height: 20px;
  333 + border: none;
  334 + text-indent: 100%;
  335 + white-space: nowrap;
  336 + opacity: .85;
  337 + filter: alpha(opacity=85);
  338 + border-radius: 4px;
180 339 }
181 340  
182   -#quick-links li:last-child > a{
183   - padding-right: 5px;
184   - border-right: none;
  341 +#social-icons li {
  342 + display: inline-block;
185 343 }
186 344  
187   -#quick-links a:hover, #menu-spb a:focus , #menu-spb a:hover {
188   - color: #03316f;
189   - background: none;
  345 +#portalredes-facebook a {
  346 + background-position: -80px -25px;
190 347 }
191 348  
192   -/* Menu collapsed elements */
193   -.navbar-toggle .icon-bar{
194   - background-color: #2c66ce;
195   - margin: auto;
  349 +#portalredes-googleplus a {
  350 + background-position: -130px 0;
196 351 }
197 352  
198   -.navbar-header.logo .navbar-toggle{
199   - float: left;
200   - margin: 0;
  353 +#portalredes-instagram a {
  354 + background-position: 69px -49px;
201 355 }
202 356  
203   -#quick-links-sm{
204   - list-style: none;
205   - float: right;
206   - margin: 0;
  357 +#portalredes-twitter a {
  358 + background-position: -155px -25px;
207 359 }
208 360  
209   -#quick-links-sm li{
210   - display: inline-block;
  361 +#portalredes-youtube a {
  362 + background-position: -130px -25px;
211 363 }
212 364  
213   -#quick-links-sm > li > a{
214   - margin: 5px 0;
215   - padding: 0 15px;
216   - border-right: 1px solid #2c66ce;
217   - text-decoration: none;
  365 +#portalredes-soundcloud a {
  366 + background-position: 20px 0;
218 367 }
219 368  
220   -#quick-links-sm li:last-child > a{
221   - padding-right: 5px;
222   - border-right: none;
  369 +#portalredes-slideshare a {
  370 + background-position: 45px 0;
223 371 }
224 372  
225   -#quick-links-sm a:hover{
226   - color: #03316f;
227   - background: none;
  373 +#portalredes-rss a {
  374 + background-position: 145px -25px;
228 375 }
... ...
templates/header.html
  Diff comments   View file @e3f16d8
... ... @@ -2,135 +2,164 @@
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>
  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="http://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="#anavigation" id="link-navegacao">
  20 + Ir para o menu
  21 + <span>2</span>
  22 + </a>
  23 + </li>
  24 + <li>
  25 + <a accesskey="3" href="#SearchableText" 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 + <!-- <ul id="language">
  38 + <li class="language-es">
  39 + <a href="#">Espa&#241;ol</a>
  40 + </li>
  41 + <li class="language-en">
  42 + <a href="#">English</a>
  43 + </li>
  44 + </ul>-->
  45 + <div id="second-nav">
  46 + <ul id="portal-siteactions">
  47 + <li id="siteaction-accessibility">
  48 + <a href="/software-publico-brasileiro/acessibilidade" title="Acessibilidade" accesskey="5">
  49 + Acessibilidade
  50 + </a>
  51 + </li>
  52 + <li id="siteaction-contraste">
  53 + <a href="#" title="Alto Contraste" accesskey="6">
  54 + Alto Contraste
  55 + </a>
  56 + </li>
  57 + <li id="siteaction-mapadosite">
  58 + <a href="/social/spb/mapa-do-site" title="Mapa do Site" accesskey="7">
  59 + Mapa do Site
  60 + </a>
  61 + </li>
  62 + </ul>
  63 + <ul id="login-menu">
  64 + {% if not user.is_authenticated %}
49 65 {% 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>
  66 + <li class="login-item"><a href="{% url 'signup' %}">{% trans "Register" %}</a></li>
  67 + <li class="login item last-item"><a href="{% url 'login' %}">{% trans "Login" %}</a></li>
  68 + {% else %}
  69 + <li id="user-menu" class="login-item dropdown">
  70 + <a href="#" class="dropdown-toggle user" data-toggle="dropdown">{% gravatar user.email %} <b class="caret"></b>&nbsp;&nbsp;</a>
  71 + <ul id="login-menu-box" class="dropdown-menu" role="menu">
  72 + <li class="last-item">
57 73 <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>
  74 + <div class="thumbnail">{% gravatar user.email %}</div>
  75 + <div class="user-info">
  76 + <span><b>{{ user.get_full_name }}</b></span>
  77 + <span class="quiet">{{ user.email }}</span>
  78 + </div>
  79 + <div>
  80 + <a class="btn btn-info pull-left" href="{% url 'user_profile' user.username %}">{% trans "My Profile" %}</a>
  81 + {% trans 'Logout' as logout_text %}
  82 + <a class="btn btn-default pull-right" href="{% url 'logout' %}"> {% trans "Logout" %}</a>
67 83 </div>
68 84 </div>
69 85 </li>
70 86 </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>
  87 + </li>
  88 + {% endif %}
  89 + </ul>
  90 + </div>
  91 + <div id="logo">
  92 + <a id="portal-logo" title="" href="/">
  93 + <span id="portal-title-1">Portal do</span>
  94 + <h1 id="portal-title" class="corto">Software Público Brasileiro</h1>
  95 + <span id="portal-description">MINISTÉRIO DO PLANEJAMENTO, ORÇAMENTO E GESTÃO</span>
  96 + </a>
  97 + </div>
  98 + <div id="portal-searchbox">
  99 + {% comment %}
  100 + <form action="{% url 'haystack_search' %}" method="GET" id="search-form" class="navbar-form navbar-right hidden-xs hidden-sm" role="search">
  101 + <div class="form-group">
  102 + <label class="sr-only" for="header-searchbox">{% trans 'Search here...' %}</label>
  103 + <input name="q" id="header-searchbox"
  104 + class="form-control" value="{{ request.GET.q }}"
  105 + type="search" placeholder="{% trans 'Search here...' %}" />
96 106 </div>
  107 + <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
  108 + </form>
  109 + {% endcomment %}
  110 + <form id="nolivesearchGadget_form" action="/search/">
  111 + <fieldset class="LSBox"><legend class="hiddenStructure">Buscar no portal</legend>
  112 + <label class="hiddenStructure" for="nolivesearchGadget">Buscar no portal</label>
  113 + <input name="SearchableText" type="text" size="18" title="Buscar no portal" placeholder="Buscar no portal" class="searchField" id="nolivesearchGadget">
  114 + <input class="searchButton" type="submit" value="Buscar no portal">
  115 + </fieldset>
  116 + </form>
97 117 </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>
  118 + <div id="social-icons">
  119 + <ul>
  120 + <li id="portalredes-facebook" class="portalredes-item">
  121 + <a href="#">Facebook</a>
106 122 </li>
107   - <li id="link-contact">
108   - <a href="/social/spb/contato">Contato</a>
  123 + <li id="portalredes-googleplus" class="portalredes-item">
  124 + <a href="#">Google+</a>
109 125 </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>
  126 + <li id="portalredes-instagram" class="portalredes-item">
  127 + <a href="#">Instagram</a>
121 128 </li>
122   - {% plugins_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>
  129 + <li id="portalredes-twitter" class="portalredes-item">
  130 + <a href="#">Twitter</a>
  131 + </li>
  132 + <li id="portalredes-youtube" class="portalredes-item">
  133 + <a href="#">YouTube</a>
127 134 </li>
128   - <li id="link-contact">
129   - <a href="/social/spb/contato">Contato</a>
  135 + <li id="portalredes-soundcloud" class="portalredes-item">
  136 + <a href="#">SoundCloud</a>
  137 + </li>
  138 + <li id="portalredes-slideshare" class="portalredes-item">
  139 + <a href="#">Slideshare</a>
  140 + </li>
  141 + <li id="portalredes-rss" class="portalredes-item last-item">
  142 + <a href="#">RSS</a>
130 143 </li>
131 144 </ul>
132 145 </div>
133 146 </div>
  147 + <div id="sobre">
  148 + <ul>
  149 + <li id="softwarepublico-groups" class="softwarepublico-item">
  150 + <a href="https://portal.softwarepublico.gov.br/archives/thread/" title="Groups">Groups</a>
  151 + </li>
  152 + <li id="softwarepublico-perguntas-frequentes" class="softwarepublico-item">
  153 + <a href="/social/spb/ajuda" title="Perguntas frequentes">Perguntas frequentes</a>
  154 + </li>
  155 + <li id="softwarepublico-contato" class="softwarepublico-item">
  156 + <a href="/social/spb/contato" title="Contato">Contato</a>
  157 + </li>
  158 + </ul>
  159 + </div>
134 160 </div>
135   -</div>
136 161 </header>
  162 +
  163 +{% block main_content %}
  164 + <a name="acontent" id="acontent"></a>
  165 +{% endblock %}
... ...