Commit 0819c8535058ee8f3d67207b88d104a522cdf87f
1 parent
d9918355
Exists in
master
and in
79 other branches
Small adjustments in blog community secondary page
Showing
3 changed files
with
107 additions
and
59 deletions
Show diff stats
html-cms/blog.html
... | ... | @@ -11,29 +11,50 @@ |
11 | 11 | <div class="blog-main-content" > |
12 | 12 | <div id="date" >Hoje</div> |
13 | 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"> | |
14 | +<div id="image-container"> | |
15 | + <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" /> | |
16 | +</div> | |
15 | 17 | <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 | 18 | </div> |
17 | 19 | <div class="blog-event-list"> |
18 | 20 | <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> | |
21 | + <div class="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> | |
22 | + <div class="blog-event-information"> | |
23 | + <div class="date">Ontem</div> | |
24 | + <div class="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div> | |
25 | + <div class="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div> | |
26 | + </div> | |
23 | 27 | </div> |
24 | 28 | <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 class="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> | |
30 | + <div class="blog-event-information"> | |
31 | + <div class="date">Ontem</div> | |
32 | + <div class="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div> | |
33 | + <div class="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div> | |
34 | + </div> | |
29 | 35 | </div> |
30 | 36 | <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> | |
37 | + <div class="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> | |
38 | + <div class="blog-event-information"> | |
39 | + <div class="date">Ontem</div> | |
40 | + <div class="title">Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit</div> | |
41 | + <div class="description" >Lorem ipsum dolor sit amlor sit amet, contur adipiscing elit.</div> | |
42 | + </div> | |
35 | 43 | </div> |
36 | 44 | </div> |
45 | +<div class="community-content-footer"> | |
46 | + <ul id="indexes"> | |
47 | + <li id="previous"> | |
48 | + <span id="left-arrow"></span> | |
49 | +<a href>Anteriores</a></li> | |
50 | + <li id="first-index" class="active-index"><a href>1</a></li> | |
51 | + <li id="second-index" class="default-index"><a href>2</a></li> | |
52 | + <li id="third-index" class="default-index"><a href>3</a></li> | |
53 | + <li id="fourth-index" class="default-index"><a href>4</a></li> | |
54 | + <li id="fifth-index" class="default-index"><a href>5</a></li> | |
55 | + <li id="next"><a href>Próximos</a><span id="right-arrow"></span></li> | |
56 | + </ul> | |
57 | +</div> | |
37 | 58 | </div> |
38 | 59 | |
39 | 60 | <!-- LEFT SIDE BAR --> |
... | ... | @@ -55,23 +76,11 @@ |
55 | 76 | <!-- RIGHT SIDE BOX --> |
56 | 77 | <div id="temp"> |
57 | 78 | <div class="community-side-box"> |
58 | - <div class="community-logo"> | |
59 | - | |
79 | + <div class="community-logo-container"> | |
80 | + <img src="https://beta.softwarepublico.gov.br/social/image_uploads/0000/0766/www.softwarepublico.gov_.br47_big_big.gif?1432145671" /> | |
60 | 81 | </div> |
61 | 82 | <div class="community-name"> |
62 | 83 | <p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p> |
63 | 84 | </div> |
64 | 85 | </div> |
65 | -</div> | |
66 | - | |
67 | -<div class="community-content-footer"> | |
68 | - <ul id="indexes"> | |
69 | - <li id="previous">Anteriores</li> | |
70 | - <li class="index">1</li> | |
71 | - <li class="index">2</li> | |
72 | - <li class="index">3</li> | |
73 | - <li class="index">4</li> | |
74 | - <li class="index">5</li> | |
75 | - <li id="next">Próximos</li> | |
76 | - </ul> | |
77 | 86 | </div> |
78 | 87 | \ No newline at end of file | ... | ... |
images/left-arrow.png
pagina_comunidade.css
... | ... | @@ -658,24 +658,33 @@ ul#itens-legend-grafic{ |
658 | 658 | overflow: hidden; |
659 | 659 | } |
660 | 660 | |
661 | -.community-logo { | |
662 | - content: url('images/logo-participa.png'); /* LOGOTIPO DA COMUNIDADE */ | |
663 | - /*content: url('images/bg-bloco-de-trilhas.png');*/ | |
664 | - width: 100%; | |
661 | +.community-logo-container { | |
662 | + height: 150px; | |
663 | + width: 200px; | |
665 | 664 | border-bottom: 4px solid #3E67B1; |
665 | + overflow: hidden; | |
666 | + text-align: center; | |
667 | + display: table-cell; | |
668 | + vertical-align: middle; | |
669 | +} | |
670 | + | |
671 | +.community-logo-container img { | |
672 | + height: auto; | |
673 | + width: 70%; | |
666 | 674 | } |
667 | 675 | |
668 | 676 | .community-name { |
669 | 677 | font-family: Arial; |
670 | 678 | font-size: 14px; |
671 | 679 | font-weight: 700; |
672 | - padding: 13px 15px 0px 15px; | |
673 | - text-align: center; | |
680 | + padding: 13px 10px 0px 10px; | |
681 | + text-align: center; | |
674 | 682 | height: 100%; |
675 | 683 | background-color: #ECEDF1; |
676 | 684 | } |
677 | 685 | |
678 | 686 | .community-name p { |
687 | + font-family: open sans; | |
679 | 688 | font-size: 16px; |
680 | 689 | line-height: 17px; |
681 | 690 | letter-spacing: 0px; |
... | ... | @@ -720,7 +729,7 @@ ul#itens-legend-grafic{ |
720 | 729 | #community-blog { |
721 | 730 | width: 500px; |
722 | 731 | height: 2200px; |
723 | - background-image: url('images/blog-teste.png'); | |
732 | + /*background-image: url('images/blog-teste.png');*/ | |
724 | 733 | background-repeat: no-repeat; |
725 | 734 | } |
726 | 735 | |
... | ... | @@ -761,29 +770,19 @@ ul#itens-legend-grafic{ |
761 | 770 | float: left; |
762 | 771 | margin-right: 9px; |
763 | 772 | padding: 5px 12px 4px 9px; |
764 | - border: 1px solid #ECEDF1; | |
773 | + border: 1px solid #D3D6DE; | |
765 | 774 | border-radius: 4px; |
766 | 775 | color: #2C66CE; |
767 | 776 | } |
768 | 777 | |
769 | 778 | .blog-main-content { |
770 | 779 | font-family: Arial; |
780 | + color: #172738; | |
771 | 781 | margin-top: 46px; |
772 | 782 | } |
773 | 783 | |
774 | -.blog-main-content img { | |
775 | - margin-left: auto; | |
776 | - margin-right: auto; | |
777 | - max-height: 208px; | |
778 | - width: 100%; | |
779 | - height: 100%; | |
780 | - margin-top: 13px; | |
781 | - border-radius: 2px; | |
782 | - overflow: hidden; | |
783 | -} | |
784 | - | |
785 | 784 | .blog-main-content #date { |
786 | - font-size: 14px; | |
785 | + font-size: 12px; | |
787 | 786 | text-transform: uppercase; |
788 | 787 | } |
789 | 788 | |
... | ... | @@ -795,6 +794,19 @@ ul#itens-legend-grafic{ |
795 | 794 | letter-spacing: 0.4px; |
796 | 795 | } |
797 | 796 | |
797 | +.blog-main-content #image-container { | |
798 | + border-radius: 6px; | |
799 | + margin-top: 13px; | |
800 | + overflow: hidden; | |
801 | + height: 210px; | |
802 | + width: 490px; | |
803 | +} | |
804 | + | |
805 | +.blog-main-content #image-container img { | |
806 | + height: auto; | |
807 | + width: 490px; | |
808 | +} | |
809 | + | |
798 | 810 | .blog-main-content #description { |
799 | 811 | font-size: 15px; |
800 | 812 | margin-top: 11px; |
... | ... | @@ -808,32 +820,39 @@ ul#itens-legend-grafic{ |
808 | 820 | } |
809 | 821 | |
810 | 822 | .blog-event-item{ |
823 | + position: relative; | |
824 | + float: left; | |
811 | 825 | width: 500px; |
812 | - height: 110px; | |
813 | 826 | border-top: 1px solid #D3D6DE; |
814 | 827 | padding-top: 25px; |
828 | + margin-bottom: 25px; | |
815 | 829 | } |
816 | 830 | |
817 | -.blog-event-item #date { | |
831 | +.blog-event-item .blog-event-information .date { | |
818 | 832 | font-size: 12px; |
819 | 833 | margin-top: -1px; |
820 | 834 | text-transform: uppercase; |
821 | 835 | } |
822 | 836 | |
823 | -.blog-event-item #title { | |
824 | - font-weight: 700; | |
837 | +.blog-event-item .blog-event-information .title { | |
838 | + font-weight: 700 !important; | |
825 | 839 | font-size: 15px; |
826 | 840 | margin-top: 6px; |
827 | 841 | letter-spacing: 0.5px; |
828 | 842 | } |
829 | 843 | |
830 | -.blog-event-item #description { | |
844 | +.blog-event-item .blog-event-information .description { | |
831 | 845 | font-size: 14px; |
832 | 846 | margin-top: 5px; |
833 | 847 | letter-spacing: -0.2px; |
834 | 848 | } |
835 | 849 | |
836 | -.blog-event-item #item-image { | |
850 | +.blog-event-item .blog-event-information { | |
851 | + float: left; | |
852 | + width: 370px; | |
853 | +} | |
854 | + | |
855 | +.blog-event-item .item-image { | |
837 | 856 | float: left; |
838 | 857 | height: 100%; |
839 | 858 | margin-right: 20px; |
... | ... | @@ -844,11 +863,11 @@ ul#itens-legend-grafic{ |
844 | 863 | height: 63px; |
845 | 864 | border-radius: 5px; |
846 | 865 | padding-left: 4px; |
847 | - | |
848 | 866 | } |
849 | 867 | |
850 | 868 | .community-content-footer { |
851 | - margin-top: 783px; | |
869 | + position: relative; | |
870 | + float: left; | |
852 | 871 | padding-left: 2px; |
853 | 872 | width: 100%; |
854 | 873 | border-top: 1px solid #D3D6DE; |
... | ... | @@ -861,7 +880,7 @@ ul#itens-legend-grafic{ |
861 | 880 | border: 1px solid #D3D6DE; |
862 | 881 | } |
863 | 882 | |
864 | -.community-content-footer ul .index { | |
883 | +.community-content-footer ul .default-index { | |
865 | 884 | padding: 7px 11px 7px 11px; |
866 | 885 | border-radius: 4px; |
867 | 886 | margin-right: 4px; |
... | ... | @@ -890,10 +909,30 @@ ul#itens-legend-grafic{ |
890 | 909 | letter-spacing: 0.6px; |
891 | 910 | } |
892 | 911 | |
893 | -.community-content-footer #indexes li a{ | |
894 | - color: black; | |
912 | +.community-content-footer #indexes li a { | |
913 | + color: #172738; | |
895 | 914 | } |
896 | 915 | |
897 | -.community-content-footer li:active .index { | |
916 | +.community-content-footer #indexes .active-index { | |
898 | 917 | background-color: #ECEDF1; |
918 | + padding: 7px 11px 7px 11px; | |
919 | + border-radius: 4px; | |
920 | + margin-right: 4px; | |
921 | + font-family: Arial; | |
922 | + font-weight: 700; | |
923 | + font-size: 16px; | |
924 | +} | |
925 | + | |
926 | +.community-content-footer #indexes #previous #left-arrow { | |
927 | + position: absolute; | |
928 | + content: url('images/left-arrow-black.png'); | |
929 | + margin-left: -25px; | |
930 | + margin-top: 3px; | |
931 | +} | |
932 | + | |
933 | +.community-content-footer #indexes #next #right-arrow { | |
934 | + position: absolute; | |
935 | + content: url('images/right-arrow-black.png'); | |
936 | + margin-left: 18px; | |
937 | + margin-top: 3px; | |
899 | 938 | } |
900 | 939 | \ No newline at end of file | ... | ... |