Download as
Browse Code »

Commit ca81492c47dd28b1c3b6a5daaaf5df1f980a32f3

Authored by Fabio Teixeira
1 parent 24ef678d
Exists in news_style

Prototyping secondary blog community page 

Signed-off-by: Pedro de Lyra <pedrodelyra@gmail.com>
Signed-off-by: Simião Carvalho <simiaosimis@gmail.com>
Showing 3 changed files with 201 additions and 6 deletions   Show diff stats
html-cms/blog.html 0 → 100644
  Diff comments   View file @ca81492
... ... @@ -0,0 +1,65 @@
  1 +<!-- MAIN AREA -->
  2 +<div id="community-blog">
  3 +<div id="blog-header">
  4 + <h1>Blog</h1>
  5 + <p>Desenvolvimento CACIC</p>
  6 + <div id="community-action-button">
  7 + <a href=""><span>Entrar na comunidade</span></a>
  8 + <a href=""><span>Contactar administradores</span></a>
  9 + </div>
  10 +</div>
  11 +<div class="blog-main-content" >
  12 + <div id="date" >Hoje</div>
  13 + <div id="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div>
  14 + <img src="http://www2.planalto.gov.br/chamadas-da-home/banner-rotativo/lideres-dos-partidos-da-base-aliada-na-camara-dos-deputados/@@images/d77b711c-a9a3-4cd4-b7e5-0fc0d412b324.jpeg">
  15 + <div id="description" >Ambiente traz soluções que dispensam pagamentos de licença simples, de fácil utilização e com novas funcionalidades.</div>
  16 +</div>
  17 +<div class="blog-event-list">
  18 + <div class="blog-event-item">
  19 + <div id="item-image"><img src="http://www2.planalto.gov.br/chamadas-da-home/banner-rotativo/lideres-dos-partidos-da-base-aliada-na-camara-dos-deputados/@@images/d77b711c-a9a3-4cd4-b7e5-0fc0d412b324.jpeg"></div>
  20 + <div id="date">Ontem</div>
  21 + <div id="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div>
  22 + <div id="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div>
  23 + </div>
  24 +<div class="blog-event-item">
  25 + <div id="item-image"><img src="http://www2.planalto.gov.br/chamadas-da-home/banner-rotativo/lideres-dos-partidos-da-base-aliada-na-camara-dos-deputados/@@images/d77b711c-a9a3-4cd4-b7e5-0fc0d412b324.jpeg"></div>
  26 + <div id="date">Ontem</div>
  27 + <div id="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div>
  28 + <div id="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div>
  29 + </div>
  30 +<div class="blog-event-item">
  31 + <div id="item-image"><img src="http://www2.planalto.gov.br/chamadas-da-home/banner-rotativo/lideres-dos-partidos-da-base-aliada-na-camara-dos-deputados/@@images/d77b711c-a9a3-4cd4-b7e53uh3-0fc0d412b324.jpeg"></div>
  32 + <div id="date">Ontem</div>
  33 + <div id="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div>
  34 + <div id="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div>
  35 + </div>
  36 +</div>
  37 +</div>
  38 +
  39 +<!-- LEFT SIDE BAR -->
  40 +<div class="side-box">
  41 +<div class="box box-2" id="box-2"><div class="blocks">
  42 +
  43 + <div class="block-outer"><div class="block link-list-block" help="Este bloco pode ser usado para criar um menu de links. Você pode incluir, remove e atualizar links como quiser." id="block-1906"><div class="block-inner-1"><div class="block-inner-2"><h3 class="block-title empty"><span></span></h3><ul><li><a href="/search/software_infos" class="icon-no-icon" target="_self">Catálogo de Software</a></li></ul></div></div></div></div>
  44 +
  45 + <div class="block-outer"><div class="block link-list-block" help="Este bloco pode ser usado para criar um menu de links. Você pode incluir, remove e atualizar links como quiser." id="block-1481"><div class="block-inner-1"><div class="block-inner-2"><h3 class="block-title"><span>Software Público</span></h3><ul><li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Entenda o que é</a></li>
  46 +<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Publique seu software</a></li>
  47 +
  48 +<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Desenvolvimento colaborativo</a></li>
  49 +
  50 +<li><a href="/profile/e-sic" class="icon-no-icon" target="_self">Sobre o Portal</a></li><li><a href="/software-publico-brasileiro/publique-seu-software" class="icon-no-icon" target="_self">Prêmio Ação Coletiva</a></li></ul></div></div></div></div>
  51 +
  52 + <div class="block-outer"><div class="block link-list-block" help="Este bloco pode ser usado para criar um menu de links. Você pode incluir, remove e atualizar links como quiser." id="block-44"><div class="block-inner-1"><div class="block-inner-2"><h3 class="block-title"><span>Colaboração</span></h3><ul><li><a href="/software-publico-brasileiro/sobre-o-portal" class="icon-no-icon" target="_self">Comunidades</a></li><li><a href="/noticias/" class="icon-no-icon" target="_self">Projetos de software</a></li><li><a href="/software-publico-brasileiro/contato" class="icon-no-icon" target="_self">Usuários</a></li></ul></div></div></div></div>
  53 +</div></div></div>
  54 +
  55 +<!-- RIGHT SIDE BOX -->
  56 +<div id="temp">
  57 +<div class="community-side-box">
  58 + <div class="community-logo">
  59 +
  60 + </div>
  61 + <div class="community-name">
  62 + <p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>
  63 + </div>
  64 +</div>
  65 +</div>
0 66 \ No newline at end of file
... ...
images/blog-teste.png 0 → 100644
View file @ca81492

454 KB
pagina_comunidade.css
  Diff comments   View file @ca81492
... ... @@ -613,11 +613,15 @@ ul#itens-legend-grafic{
613 613 }
614 614  
615 615 .event-link {
616   - background: url('images/calendar-icon.png') no-repeat left center;
  616 + background: url('images/globe-icon.png') no-repeat left center;
617 617 margin-top: 18px;
618 618 letter-spacing: 0.48px;
619 619 }
620 620  
  621 +.event-link a {
  622 + text-decoration: underline;
  623 +}
  624 +
621 625 .event-address {
622 626 background: url('images/icone_pin.png') no-repeat left top;
623 627 }
... ... @@ -658,7 +662,7 @@ ul#itens-legend-grafic{
658 662 content: url('images/logo-participa.png'); /* LOGOTIPO DA COMUNIDADE */
659 663 /*content: url('images/bg-bloco-de-trilhas.png');*/
660 664 width: 100%;
661   - border-bottom: 3px solid #3E67B1;
  665 + border-bottom: 4px solid #3E67B1;
662 666 }
663 667  
664 668 .community-name {
... ... @@ -672,6 +676,7 @@ ul#itens-legend-grafic{
672 676 }
673 677  
674 678 .community-name p {
  679 + font-size: 16px;
675 680 line-height: 17px;
676 681 letter-spacing: 0px;
677 682 }
... ... @@ -684,7 +689,7 @@ ul#itens-legend-grafic{
684 689 font-weight: 700;
685 690 text-align: left;
686 691 font-family: Arial;
687   - font-size: 14px;
  692 + font-size: 16px;
688 693 text-transform: uppercase;
689 694 padding-top: 9px;
690 695 padding-left: 13px;
... ... @@ -702,17 +707,142 @@ ul#itens-legend-grafic{
702 707 }
703 708  
704 709 .another-events-date {
705   - color: #2C4B6B;
  710 + color: #4562b1;
706 711 font-weight: 700;
707 712 }
708 713  
709 714 .another-event {
710   - color: #172738;
  715 + color: #2C66CE;
711 716 }
712 717  
713 718 /************************** PÁGINA BLOG **************************/
714 719  
715 720 #community-blog {
  721 + width: 500px;
  722 + height: 2200px;
716 723 background-image: url('images/blog-teste.png');
717 724 background-repeat: no-repeat;
718   -}
719 725 \ No newline at end of file
  726 +}
  727 +
  728 +#blog-header {
  729 + width: 100%;
  730 + height: 129px;
  731 + border-bottom: 1.5px solid #D3D6DE;
  732 +}
  733 +
  734 +#blog-header > h1 {
  735 + font-family: Arial;
  736 + font-weight: 700;
  737 + font-size: 33px;
  738 + margin: 0px;
  739 + text-align: left;
  740 + padding-left: 2px;
  741 + letter-spacing: 1px;
  742 +}
  743 +
  744 +#community-blog p {
  745 + font-family: Arial;
  746 + font-size: 15px;
  747 + margin-top: 2px;
  748 + margin-left: 4px;
  749 + margin-bottom: 0px;
  750 + letter-spacing: 0.15px;
  751 +}
  752 +
  753 +#community-blog #community-action-button {
  754 + margin-left: 3px;
  755 + margin-top: 7px;
  756 +}
  757 +
  758 +#community-blog #community-action-button a {
  759 + text-align: center;
  760 + font-family: Arial;
  761 + font-size: 13px;
  762 + float: left;
  763 + margin-right: 9px;
  764 + padding: 5px 12px 4px 9px;
  765 + border: 1px solid #ECEDF1;
  766 + border-radius: 4px;
  767 + color: #2C66CE;
  768 +}
  769 +
  770 +.blog-main-content {
  771 + font-family: Arial;
  772 + margin-top: 46px;
  773 +}
  774 +
  775 +.blog-main-content img {
  776 + margin-left: auto;
  777 + margin-right: auto;
  778 + max-height: 208px;
  779 + width: 100%;
  780 + height: 100%;
  781 + margin-top: 13px;
  782 + border-radius: 2px;
  783 + overflow: hidden;
  784 +}
  785 +
  786 +.blog-main-content #date {
  787 + font-size: 14px;
  788 + text-transform: uppercase;
  789 +}
  790 +
  791 +.blog-main-content #title {
  792 + font-size: 22px;
  793 + font-weight: 700;
  794 + margin-top: 9px;
  795 + line-height: 25px;
  796 + letter-spacing: 0.4px;
  797 +}
  798 +
  799 +.blog-main-content #description {
  800 + font-size: 15px;
  801 + margin-top: 11px;
  802 + line-height: 21px;
  803 + letter-spacing: 0.1px;
  804 + padding-left: 3px;
  805 +}
  806 +
  807 +.blog-event-list {
  808 + margin-top: 24px;
  809 +}
  810 +
  811 +.blog-event-item{
  812 + width: 500px;
  813 + height: 110px;
  814 + border-top: solid 1px;
  815 + padding-top: 25px;
  816 +}
  817 +
  818 +.blog-event-item #date {
  819 + font-size: 12px;
  820 + margin-top: -1px;
  821 + text-transform: uppercase;
  822 +}
  823 +
  824 +.blog-event-item #title {
  825 + font-weight: 700;
  826 + font-size: 15px;
  827 + margin-top: 6px;
  828 + letter-spacing: 0.5px;
  829 +}
  830 +
  831 +.blog-event-item #description {
  832 + font-size: 14px;
  833 + margin-top: 5px;
  834 + letter-spacing: -0.2px;
  835 +}
  836 +
  837 +.blog-event-item #item-image {
  838 + float: left;
  839 + height: 100%;
  840 + margin-right: 20px;
  841 +}
  842 +
  843 +.blog-event-item img {
  844 + width: 106px;
  845 + height: 63px;
  846 + border-radius: 5px;
  847 + padding-left: 4px;
  848 +
  849 +}
... ...