Commit ba7b387b1b7f130b1fdef12aeb28f17875998f58

Authored by Adabriand Furtado
1 parent 5072ad72
Exists in master

Add new sections: VLibras and Sponsors.

assets/css/base.css
... ... @@ -159,6 +159,7 @@ img {
159 159 font-size: 24px;
160 160 font-weight: bold;
161 161 color: white;
  162 + margin: 0;
162 163 padding: 5px 0;
163 164 background-color: #0f78a7;
164 165 -webkit-border-radius: 6px;
... ... @@ -171,7 +172,7 @@ img {
171 172 }
172 173  
173 174 .wl-section-description {
174   - margin-top: 90px;
  175 + margin-top: 40px;
175 176 font-size: 14px;
176 177 line-height: 24px;
177 178 text-align: center;
... ... @@ -231,10 +232,10 @@ img {
231 232 /* Contribution Overview Section */
232 233 #wl-overview {
233 234 position: relative;
234   - min-height: 680px;
235 235 color: #2d2d2d;
236 236 background: #ffffff;
237 237 z-index: 1;
  238 + padding-bottom: 30px;
238 239 }
239 240  
240 241 .wl-overview-progress-wrapper {
... ... @@ -290,21 +291,10 @@ img {
290 291 /* Features Section */
291 292 #wl-features {
292 293 position: relative;
293   - min-height: 500px;
294 294 background: #ffffff;
295 295 z-index: 1;
296 296 }
297 297  
298   -.wl-zigzag-border {
299   - background: url('../img/zigzag-border.png') repeat-x;
300   - height: 7px;
301   - width: 100%;
302   - position: absolute;
303   - z-index: 1;
304   - left: 0;
305   - top: 0;
306   -}
307   -
308 298 .wl-features-container {
309 299 display: flex;
310 300 flex-direction: row;
... ... @@ -319,7 +309,7 @@ img {
319 309 flex-direction: row;
320 310 align-items: center;
321 311 flex: 1;
322   - padding: 25px 0;
  312 + padding: 75px 0;
323 313 }
324 314  
325 315 .wl-feature {
... ... @@ -349,8 +339,8 @@ img {
349 339 text-align: center;
350 340 }
351 341  
352   -.wl-features-wrapper.-salmon {
353   - background: #fac389;
  342 +.wl-features-wrapper.-green {
  343 + background: #99f35d;
354 344 }
355 345  
356 346 .wl-features-wrapper.-yellow {
... ... @@ -390,6 +380,7 @@ img {
390 380 flex-wrap: wrap;
391 381 position: relative;
392 382 padding: 0;
  383 + min-height: 184px;
393 384 }
394 385  
395 386 .wl-volunteers-wrapper {
... ... @@ -410,19 +401,22 @@ img {
410 401 flex-direction: row;
411 402 flex-wrap: wrap;
412 403 background: white;
413   - height: 100vh;
  404 + padding-bottom: 25px;
414 405 }
415 406  
416 407 .wl-signs-and-ranking-wrapper {
417 408 flex: 1;
418 409 position: relative;
419   - min-width: 330px;
420 410 }
421 411  
422 412 .wl-signs-and-ranking-wrapper .wl-section-title {
423 413 padding: 0 15px;
424 414 }
425 415  
  416 +.wl-signs-and-ranking-wrapper .wl-section-description {
  417 + margin-top: 60px;
  418 +}
  419 +
426 420 /* Sign Section */
427 421 .wl-signs-container {
428 422 display: flex;
... ... @@ -503,16 +497,84 @@ img {
503 497 padding-bottom: 20px;
504 498 }
505 499  
506   -.star-wrapper {
  500 +.wl-rank .star-wrapper {
507 501 position: absolute;
508 502 margin-top: -2px;
509 503 height: 14px;
510 504 }
511 505  
512   -.position-wrapper {
  506 +.wl-rank .position-wrapper {
513 507 padding-left: 50px;
514 508 }
515 509  
  510 +/* VLibras section */
  511 +#wl-vlibras {
  512 + position: relative;
  513 + z-index: 1;
  514 + background: #f4f4f4;
  515 +}
  516 +
  517 +.wl-vlibras-container {
  518 + padding-top: 25px;
  519 + padding-bottom: 60px;
  520 +}
  521 +
  522 +.wl-vlibras-description {
  523 + margin-bottom: 40px;
  524 +}
  525 +
  526 +.wl-vlibras-description .title {
  527 + margin-bottom: 20px;
  528 +}
  529 +
  530 +.wl-vlibras-video {
  531 + width: 100%;
  532 + height: 100%;
  533 +}
  534 +
  535 +/* Sponsors section */
  536 +#wl-sponsors {
  537 + position: relative;
  538 + z-index: 1;
  539 + background: white;
  540 +}
  541 +
  542 +.wl-sponsors-container {
  543 + text-align: center;
  544 + padding: 50px 0;
  545 +}
  546 +
  547 +.wl-sponsors-container a {
  548 + text-decoration: none;
  549 +}
  550 +
  551 +.wl-sponsors-container img {
  552 + margin-right: 35px;
  553 + margin-bottom: 20px;
  554 +}
  555 +
  556 +.wl-sponsors-container a:last-child {
  557 + margin-right: 0;
  558 +}
  559 +
  560 +/* Sponsors section */
  561 +#wl-contact {
  562 + position: relative;
  563 + z-index: 1;
  564 + background: #0042b1;
  565 +}
  566 +
  567 +.wl-contact-container {
  568 + text-align: center;
  569 + padding: 35px 0;
  570 +}
  571 +
  572 +.wl-contact-description {
  573 + color: white;
  574 + line-height: 32px;
  575 + padding: 65px 0;
  576 +}
  577 +
516 578 /* Responsiveness */
517 579 @media screen and (min-width: 768px) {
518 580 .wl-section-title {
... ... @@ -525,23 +587,12 @@ img {
525 587 padding: 6px 0;
526 588 }
527 589  
528   - /* Overview */
529   - #wl-overview {
530   - height: 100vh;
531   - }
532   -
533 590 /* Features */
534   - #wl-features {
535   - height: 100vh;
536   - }
537 591 .wl-features-container {
538   - height: 100vh;
539 592 padding-top: 0;
540 593 padding-bottom: 0;
541 594 }
542 595  
543   - /* Volunteers */
544   -
545 596 /* Signs and Ranking */
546 597 .wl-signs-and-ranking-wrapper .wl-section-title .title {
547 598 width: 100%;
... ... @@ -554,11 +605,20 @@ img {
554 605 .wl-signs-and-ranking-wrapper {
555 606 padding: 0 15px;
556 607 }
  608 +
  609 + /* VLibras section */
  610 + .wl-vlibras-container {
  611 + padding-top: 50px;
  612 + }
  613 + .wl-vlibras-description {
  614 + margin-bottom: 0;
  615 + margin-top: 50px;
  616 + }
557 617 }
558 618  
559 619 @media screen and (min-width: 992px) {
560   - #wl-overview .container,
561   - #wl-header .container {
  620 + #wl-header .container, #wl-overview .container,
  621 + #wl-vlibras .container {
562 622 width: 970px;
563 623 }
564 624 }
... ...
assets/img/brasil-logo.png 0 → 100644

2.06 KB

assets/img/camara-logo.png 0 → 100644

17.3 KB

assets/img/govbr-logo.png 0 → 100644

15.1 KB

assets/img/information-access-logo.png 0 → 100644

1.86 KB

assets/img/lavid-logo.png 0 → 100644

21.5 KB

assets/img/lsd-logo.png 0 → 100644

27.6 KB

assets/img/mpog-logo.png 0 → 100644

4.77 KB

assets/img/rnp-logo.png 0 → 100644

14.2 KB

assets/img/sti-logo.png 0 → 100644

2.12 KB

assets/img/ufcg-logo.png 0 → 100644

25.6 KB

assets/img/ufpb-logo.png 0 → 100644

33 KB

assets/img/zigzag-border.png

1 KB

assets/templates/sections.html
... ... @@ -126,7 +126,6 @@
126 126 </div>
127 127 </section>
128 128 <section id="wl-features">
129   - <span class="wl-zigzag-border"></span>
130 129 <div class="container-fluid">
131 130 <div class="row">
132 131 <div class="col-xs-12 wl-section-title">
... ... @@ -138,7 +137,7 @@
138 137 </a>
139 138 </div>
140 139 <div class="col-xs-12 wl-features-container">
141   - <div class="wl-features-wrapper -salmon">
  140 + <div class="wl-features-wrapper -green">
142 141 <div class="wl-feature">
143 142 <div class="wl-feature-img">
144 143 <img src="assets/img/wl-feature-send-video.png" alt="Ícone de envio de vídeos">
... ... @@ -392,4 +391,125 @@
392 391 </div>
393 392 </div>
394 393 </div>
395   -</section>
396 394 \ No newline at end of file
  395 +</section>
  396 +<section id="wl-vlibras">
  397 + <div class="container-fluid container">
  398 + <div class="row">
  399 + <div class="col-xs-12">
  400 + <div class="wl-section-title">
  401 + <a href="#wl-vlibras" du-smooth-scroll>
  402 + <h2 class="title">
  403 + Conheça o VLibras
  404 + </h2>
  405 + </a>
  406 + </div>
  407 + </div>
  408 + </div>
  409 + <div class="wl-vlibras-container">
  410 + <div class="row">
  411 + <div class="col-xs-12 col-md-6">
  412 + <div class="wl-vlibras-description">
  413 + <h1 class="title">VLibras</h1>
  414 + <span>Resultado de uma parceria entre o Ministério do Planejamento, Orçamento e Gestão (MP), por meio da Secretaria de Tecnologia da Informação (STI) e a Universidade Federal da Paraíba (UFPB)
  415 + </span>
  416 + </div>
  417 + </div>
  418 + <div class="col-xs-12 col-md-6">
  419 + <div class="wl-vlibras-video-wrapper">
  420 + <video class="wl-vlibras-video" controls>
  421 + <source src="http://vlibras.gov.br/video/VLibras-Demo2_com_AD.mp4" type="video/mp4">
  422 + Seu navegador não oferece suporte a videos HTML5!
  423 + </video>
  424 + </div>
  425 + </div>
  426 + </div>
  427 + </div>
  428 + </div>
  429 +</section>
  430 +<section id="wl-sponsors">
  431 + <div class="container-fluid">
  432 + <div class="row">
  433 + <div class="col-xs-12 wl-section-title">
  434 + <a href="#wl-sponsors" du-smooth-scroll>
  435 + <h2 class="title">
  436 + Realizadores
  437 + </h2>
  438 + </a>
  439 + </div>
  440 + </div>
  441 + <div class="wl-sponsors-container">
  442 + <div class="row">
  443 + <div class="col-xs-12">
  444 + <a href="http://www.planejamento.gov.br/acesso-a-informacao/institucional/unidades/sti">
  445 + <img src="assets/img/sti-logo.png" alt="Secretaria de Tecnologia da Informação">
  446 + </a>
  447 + <a href="http://www.planejamento.gov.br/">
  448 + <img src="assets/img/mpog-logo.png" alt="Ministério Planejamento">
  449 + </a>
  450 + <a href="http://www.justica.gov.br/">
  451 + <img src="assets/img/govbr-logo.png" alt="Ministério da Justiça e Cidadania">
  452 + </a>
  453 + <a href="http://www2.camara.leg.br/">
  454 + <img src="assets/img/camara-logo.png" alt="Câmara dos Deputados">
  455 + </a>
  456 + </div>
  457 + <div class="col-xs-12">
  458 + <a href="http://lavid.ufpb.br/">
  459 + <img src="assets/img/lavid-logo.png" alt="Laboratório de aplicações de vídeo digital - Lavid">
  460 + </a>
  461 + <a href="http://www.ufpb.br/">
  462 + <img src="assets/img/ufpb-logo.png" alt="Universidade Federal da Paraíba - UFPB">
  463 + </a>
  464 + <a href="https://www.rnp.br/">
  465 + <img src="assets/img/rnp-logo.png" alt="Rede Nacional de Ensino e Pesquisa - RNP">
  466 + </a>
  467 + <a href="https://www.lsd.ufcg.edu.br/">
  468 + <img src="assets/img/lsd-logo.png" alt="Laboratório de Sistemas Distribuídos. - LSD">
  469 + </a>
  470 + <a href="http://www.ufcg.edu.br/">
  471 + <img src="assets/img/ufcg-logo.png" alt="Universidade Federal de Campina Grande - UFCG">
  472 + </a>
  473 + </div>
  474 + </div>
  475 + </div>
  476 + </div>
  477 +</section>
  478 +<section id="wl-contact">
  479 + <div class="container-fluid">
  480 + <div class="row">
  481 + <div class="col-xs-12 wl-section-title">
  482 + <a href="wl-sponsors" du-smooth-scroll>
  483 + <h2 class="title">
  484 + Contato
  485 + </h2>
  486 + </a>
  487 + </div>
  488 + </div>
  489 + <div class="wl-contact-container">
  490 + <div class="row">
  491 + <div class="col-xs-12">
  492 + <div class="wl-contact-description">
  493 + Ministério do Planejamento, Desenvolvimento e Gestão<br>
  494 + Secretaria de Tecnologia da Informação<br>
  495 + Departamento de Governo Digital<br>
  496 + Endereço: Esplanada dos Ministérios Bloco "C"<br>
  497 + E-mail: govbr@planejamento.gov.br<br>
  498 + Telefone: 61) 2020-8546 / (61) 2020-1666
  499 + </div>
  500 + </div>
  501 + </div>
  502 + <div class="row">
  503 + <div class="col-xs-6">
  504 + <a href="http://www.acessoainformacao.gov.br/">
  505 + <img src="assets/img/information-access-logo.png" alt="Logo acesso à informação">
  506 + </a>
  507 + </div>
  508 + <div class="col-xs-6">
  509 + <a href="http://www.brasil.gov.br/">
  510 + <img src="assets/img/brasil-logo.png" alt="Logo Brasil governo federal">
  511 + </a>
  512 + </div>
  513 + </div>
  514 + </div>
  515 + </div>
  516 +</section>
... ...