Commit 1ee405a7f24aa8c6b5f4ef24dfc68beadc8cc42b

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

New footer

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/footer.css
1 /*Footer*/ 1 /*Footer*/
2 2
3 footer { 3 footer {
4 - background: none; 4 + font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
5 } 5 }
6 6
7 -.colab-footer-content{  
8 - background: rgb(213,213,213);  
9 - font-family: 'Open Sans Regular', Arial, Helvetica, sans-serif; 7 +footer #btn-top {
  8 + min-width: 960px;
  9 + max-width: 960px;
  10 + padding-right: 0px;
  11 + margin-bottom: 22px;
  12 + text-decoration: none;
  13 + font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
  14 + font-size: 14px;
  15 + position: relative;
10 } 16 }
11 17
12 -.colab-footer-links a{  
13 - color:#2c66ce;  
14 - font-size: 13px;  
15 - line-height: 1.7em; 18 +footer #btn-top a {
  19 + padding-left: 20px;
  20 + background: url("../img/voltar-topo.png") no-repeat left center;
  21 + color: #777;
  22 + font-size: 14px;
16 } 23 }
17 24
18 -.colab-footer-links a:hover{  
19 - background: none;  
20 - text-decoration: underline; 25 +footer #footer {
  26 + padding: 4px 0 20px 0;
  27 + min-height: 50px;
  28 + width: 100%;
  29 + background: #EAEDF0;
  30 + color: #fff;
  31 + font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
  32 + min-width: 960px;
21 } 33 }
22 34
23 -.colab-footer-links{  
24 - color:#2c66ce;  
25 - border-left:1px dotted #2c66ce;  
26 - margin-top: 50px;  
27 - margin-bottom: 50px; 35 +
  36 +footer #footer > div {
  37 + margin: 2em auto;
  38 + padding-top: 1em;
  39 + max-width: 960px;
28 } 40 }
29 41
30 -.colab-footer-links dt{  
31 - font-size: 18px;  
32 - font-weight: bold;  
33 - line-height: 1.3em;  
34 - margin-bottom: 8px;  
35 - font-family: 'Open Sans Regular', Arial, Helvetica, sans-serif; 42 +footer #doormat-container {
  43 + float: none;
  44 + width: 100%;
36 } 45 }
37 46
38 -.colab-footer-links dd{  
39 - padding-bottom: 3px 47 +footer #doormat-container dl {
  48 + border-left: 1px dotted #9CB5E2;
  49 + margin: 0 0 18px 0;
  50 + font-size: 13px;
40 } 51 }
41 52
42 -.footer-gov{  
43 - background: #0042b2; 53 +footer #doormat-container dt {
  54 + color: #2C65CD;
  55 + font-size: 18px;
  56 + font-family: "open_sansbold", Arial, Helvetica, sans-serif;
44 } 57 }
45 58
46 -.footer-gov > .container{  
47 - padding: 2em 0; 59 +footer #doormat-container dt,
  60 +footer #doormat-container dd {
  61 + padding-left: 10px;
  62 + margin-bottom: 4px;
48 } 63 }
49 64
50 -.footer-gov .institucionais a{  
51 - display:table-cell;  
52 - vertical-align: middle;  
53 - float: right; 65 +footer #doormat-container dd a {
  66 + color: #2C65CD;
54 } 67 }
55 68
56 -.footer-gov a:hover{  
57 - text-decoration: none; 69 +footer #doormat-container dd a:hover {
  70 + text-decoration: none;
  71 +}
  72 +
  73 +footer #doormat-container.columns-4 .doormatColumn {
  74 + width: 21%;
58 } 75 }
59 76
60 -.footer-gov span{  
61 - display: none; 77 +footer #doormat-container .doormatColumn {
  78 + float: left;
  79 + margin: 0 1.1em 0 0.8em;
  80 + text-align: left;
62 } 81 }
63 82
64 -.footer-gov .colab-logo-sgpr img, .logo-acesso img{  
65 - padding-top: 10px;  
66 - padding-right: 15%;  
67 - padding-bottom: 10px; 83 +#footer .footer-logos {
  84 + margin: 0 0 -20px;
  85 + padding: 1.6em 0;
  86 + max-width: 100%;
  87 + background: #0041B1;
68 } 88 }
69 89
70 -.colab-logo-sgpr img, .spb-definitions {  
71 - display: none; 90 +#footer .footer-logos div {
  91 + width: 960px;
  92 + margin: auto;
  93 + overflow: auto;
72 } 94 }
73 95
74 -.footer-gov .logo-brasil img{  
75 - padding-right: 0; 96 +#footer .footer-logos div .logo-acesso-footer {
  97 + background-image: url("../img/acesso-a-informacao.png");
  98 + float: left;
  99 + width: 107px;
  100 + height: 49px;
76 } 101 }
77 102
78 -.go-top{  
79 - font-size: 13px;  
80 - height: 2em; 103 +
  104 +#footer .footer-logos div .logo-brasil-footer {
  105 + background-image: url("../img/brasil.png");
  106 + float: right;
  107 + width: 153px;
  108 + height: 48px;
  109 + }
  110 +
  111 +footer #extra-footer p {
  112 + margin: 1em auto;
  113 + max-width: 960px;
  114 + font-size: 12px;
  115 + line-height: 1.8em;
81 } 116 }
82 117
83 -.go-top a{ 118 +footer #extra-footer a {
  119 + color: #2C65CD;
  120 +}
  121 +
  122 +footer #footer .clear {
  123 + clear: both;
  124 +}
  125 +
  126 +
  127 +footer .go-top a{
84 color: #717782; 128 color: #717782;
85 line-height: 2em; 129 line-height: 2em;
86 } 130 }
87 131
88 -.go-top i { 132 +footer .go-top i {
89 margin-right: 5px; 133 margin-right: 5px;
90 text-decoration: none; 134 text-decoration: none;
91 - font-size: 12px; 135 + font-size: 12px;
92 } 136 }
93 137
94 -.spb-definitions{  
95 - font-size: 10px;  
96 - padding: 10px 0; 138 +html footer div#wrap-footer-brasil {
  139 + padding: 0;
97 } 140 }
colab/templates/footer.html
@@ -2,68 +2,115 @@ @@ -2,68 +2,115 @@
2 {% load static from staticfiles %} 2 {% load static from staticfiles %}
3 3
4 <footer> 4 <footer>
5 - <div class="container"> 5 + <div id="btn-top" class="container">
6 <div class="pull-right go-top"> 6 <div class="pull-right go-top">
7 - <a id="link-top" href="#link-rodape"><i class="fa fa-chevron-up"></i>Voltar ao topo</a> 7 + <a id="link-top" href="#link-rodape">Voltar para o topo</a>
8 </div> 8 </div>
9 </div> 9 </div>
10 - <div class="container-fluid colab-footer-content">  
11 - <div class="container">  
12 - <dl class="col-md-2 col-md-offset-1 colab-footer-links">  
13 - <dt>Assuntos</dt>  
14 - <dd><a href="/social/spb/publique-seu-software" title="Publique seu software">Publique seu software</a></dd>  
15 - <dd><a href="http://www.softwarepublico.gov.br/mpv/" title="Prestadores de serviço">Prestadores de serviço</a></dd>  
16 - <dd><a href="http://www.softwarepublico.gov.br/4cmbr/xowiki/Principal" title="Espaço dos municípios">Espaço dos municípios</a></dd>  
17 - </dl>  
18 - <dl class="col-md-2 colab-footer-links">  
19 - <dt>Software Público</dt>  
20 - <dd class="colab-portalspb-item">  
21 - <a title="Entenda o que é" href="/social/spb/entenda-o-que-e">Entenda o que é</a> 10 + <div id="footer" role="contentinfo">
  11 + <a name="afooter" id="afooter"></a>
  12 + <div id="doormat-container" class="columns-4">
  13 + <div class="doormatColumn column-0">
  14 + <dl class="doormatSection">
  15 + <dt class="doormatSectionHeader">Assuntos</dt>
  16 + <dd class="doormatSectionBody">
  17 + <a href="/social/spb/publique-seu-software" class="external-link">Publique seu software</a>
22 </dd> 18 </dd>
23 - <dd class="colab-portalspb-item">  
24 - <a title="Eventos" href="/social/profile/spb/events">Eventos</a> 19 + <dd class="doormatSectionBody">
  20 + <a href="http://antigo.softwarepublico.gov.br/mpv/" class="external-link">Prestadores de serviço</a>
25 </dd> 21 </dd>
26 - <dd class="colab-portalspb-item">  
27 - <a title="Prêmios" href="/social/spb/premios">Prêmios</a> 22 + <dd class="doormatSectionBody">
  23 + <a href="http://antigo.softwarepublico.gov.br/4cmbr/xowiki/Principal" class="external-link">Espaços dos municípios</a>
28 </dd> 24 </dd>
29 - <dd class="colab-portalspb-item">  
30 - <a title="Publicações" href="/social/spb/publicacoes">Publicações</a> 25 + </dl>
  26 + </div>
  27 + <div class="doormatColumn column-1">
  28 + <dl class="doormatSection">
  29 + <dt class="doormatSectionHeader">Software Público</dt>
  30 + <dd class="doormatSectionBody">
  31 + <a href="/social/spb/entenda-o-que-e" class="external-link">Entenda o que é</a>
31 </dd> 32 </dd>
32 - </dl>  
33 - <dl class="col-md-2 colab-footer-links">  
34 - <dt>Serviços</dt>  
35 - <dd>  
36 - <a href="/social/spb/ajuda#faq" title="FAQ">FAQ</a>  
37 - </dd>  
38 - <dd>  
39 - <a href="/social/spb/contato" title="Contato">Contato</a>  
40 - </dd>  
41 - <dd>  
42 - <a href="/archives/thread/spb-usuarios/relatar-erros#msg-1635" title="Relatar erros">Relatar erros</a>  
43 - </dd>  
44 - </dl>  
45 - <dl class="col-md-2 colab-footer-links">  
46 - <dt>RSS</dt>  
47 - <dd><a href="/social/spb/rss/o-que-e" title="O que é?">O que é</a></dd>  
48 - <dd><a href="/rss/colab/latest" title="Assine">Assine</a></dd>  
49 - </dl>  
50 - <dl class="col-md-2 colab-footer-links">  
51 - <dt>Navegação</dt>  
52 - <dd><a href="/social/spb/acessibilidade">Acessibilidade</a></dd>  
53 - <dd><a href="/social/spb/mapa-do-site">Mapa do site</a></dd>  
54 - </dl>  
55 - </div>  
56 -  
57 - <div class="footer-gov">  
58 - <div class="container">  
59 - <div class="col-md-7">  
60 - <a class="logo-acesso" href="http://www.acessoainformacao.gov.br/" target="_blank"><img class="img-responsive pull-left" src="{% static 'img/acesso-a-informacao.png' %}" ><span>Acesso a Informação</span></a> 33 + <dd class="doormatSectionBody">
  34 + <a href="/social/profile/spb/events" class="external-link">Eventos</a>
  35 + </dd>
  36 + <dd class="doormatSectionBody">
  37 + <a href="/social/spb/premios" class="external-link">Prêmios</a>
  38 + </dd>
  39 + <dd class="doormatSectionBody">
  40 + <a href="/social/spb/publicacoes" class="external-link">Publicações</a>
  41 + </dd>
  42 + </dl>
61 </div> 43 </div>
62 - <div class="col-md-5 institucionais">  
63 - <a class="logo-brasil" href="http://www.brasil.gov.br/" target="_blank"><img class="img-responsive" src="{% static 'img/brasil.png' %}" ><span>Brasil - Governo Federal</span></a>  
64 - <a class="colab-logo-sgpr" href="http://www.secretariageral.gov.br/" target="_blank"><img class="img-responsive" src="{% static 'img/sgpr.png' %}" ><span>Secretaria-geral da Presidência da República</span></a> 44 + <div class="doormatColumn column-2">
  45 + <dl class="doormatSection">
  46 + <dt class="doormatSectionHeader">Serviços</dt>
  47 + <dd class="doormatSectionBody">
  48 + <a href="/social/spb/ajuda#faq" class="external-link">FAQ</a>
  49 + </dd>
  50 + <dd class="doormatSectionBody">
  51 + <a href="/social/spb/contato" class="external-link">Contato</a>
  52 + </dd>
  53 + <dd class="doormatSectionBody">
  54 + <a href="/archives/thread/spb-usuarios/relatar-erros#msg-1635" class="external-link">Relatar erros</a>
  55 + </dd>
  56 + </dl>
  57 + </div>
  58 + <div class="doormatColumn column-3">
  59 + <dl class="doormatSection">
  60 + <dt class="doormatSectionHeader">RSS</dt>
  61 + <dd class="doormatSectionBody">
  62 + <a href="/social/spb/rss/o-que-e" class="external-link">O que é?</a>
  63 + </dd>
  64 + <dd class="doormatSectionBody">
  65 + <a href="/rss/colab/latest" class="external-link">Assine</a>
  66 + </dd>
  67 + </dl>
  68 + <dl class="doormatSection">
  69 + <dt class="doormatSectionHeader">Navegação</dt>
  70 + <dd class="doormatSectionBody">
  71 + <a href="/social/spb/acessibilidade" class="external-link">Acessibilidade</a>
  72 + </dd>
  73 + <dd class="doormatSectionBody">
  74 + <a href="/social/spb/mapa-do-site" class="external-link">Mapa do site</a>
  75 + </dd>
  76 + </dl>
65 </div> 77 </div>
66 </div> 78 </div>
67 - </div><!-- end footer-gov --> 79 + <div class="clear"></div>
  80 + <!-- <div id="footer-brasil" class="footer-logos">
  81 + <div>
  82 + <a href="http://www.acessoainformacao.gov.br/" class="logo-acesso">
  83 + <img src="{% static 'img/acesso-a-informacao.png' %}" alt="Acesso a Informação"></a>
  84 + <a href="http://www.brasil.gov.br/" class="logo-brasil">
  85 + <img src="{% static 'img/brasil.png' %}" alt="Brasil - Governo Federal"></a>
  86 + </div>
  87 + </div> -->
  88 + <div class="footer-logos">
  89 +
  90 +
  91 + <div>
  92 +
  93 + <a href="http://www.acessoainformacao.gov.br/">
  94 + <span class="logo-acesso-footer"></span>
  95 + </a>
  96 +
  97 +
  98 + <a href="http://www.brasil.gov.br/">
  99 + <span class="logo-brasil-footer"></span>
  100 + </a>
  101 +
  102 +
  103 + </div>
  104 +
  105 + </div>
  106 + </div>
  107 + <div id="extra-footer">
  108 + <p>
  109 + Desenvolvido com os projetos de software livre
  110 + <a href="http://github.com/colab/colab">Colab</a>,
  111 + <a href="http://gitlab.com">Gitlab</a>,
  112 + <a href="http://www.gnu.org/software/mailman/">Mailman</a> e
  113 + <a href="http://noosfero.org">Noosfero</a>
  114 + </p>
68 </div> 115 </div>
69 </footer> 116 </footer>