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 1 /*Footer*/
2 2  
3 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 128 color: #717782;
85 129 line-height: 2em;
86 130 }
87 131  
88   -.go-top i {
  132 +footer .go-top i {
89 133 margin-right: 5px;
90 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 2 {% load static from staticfiles %}
3 3  
4 4 <footer>
5   - <div class="container">
  5 + <div id="btn-top" class="container">
6 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 8 </div>
9 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 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 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 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 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 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 77 </div>
66 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 115 </div>
69 116 </footer>
... ...