implemented event and blog community secondary pages html and css

Fabio Teixeira
1 parent ca81492c
Showing 3 changed files with 141 additions and 4 deletions Show diff stats
html-cms/blog.html
html-cms/event.html
pagina_comunidade.css
@@ -62,4 +62,16 @@
     <p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>
   </div>
 </div>
+</div>
+
+<div class="community-content-footer">
+  <ul id="indexes">
+    <li id="previous">Anteriores</li>
+    <li class="index">1</li>
+    <li class="index">2</li>
+    <li class="index">3</li>
+    <li class="index">4</li>
+    <li class="index">5</li>
+    <li id="next">Próximos</li>
+  </ul>
 </div>
 \ No newline at end of file
@@ -0,0 +1,74 @@
+<!-- Left SideBox -->
+<div class="side-box">
+<div class="box box-2" id="box-2"><div class="blocks">
+
+    <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>
+
+    <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>
+<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Publique seu software</a></li>
+
+<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Desenvolvimento colaborativo</a></li>
+
+<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>
+
+    <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>
+</div></div></div>
+
+<!-- Main Area -->
+<div id="community-page">
+  <h1>Título do evento</h1>
+  <div id="event-card">
+
+    <div id="event-image"> 
+    </div>
+
+    <div class="about-event">
+     <span class="event-date">7 de fevereiro à 18 de março de 2015</span>
+      <span class="event-link"><a href="ok.com">http://fga.unb.br/unb-gama/contato</a></span>
+      <span class="event-address">
+        <span id="area">Área Especial de Indústria Projeção A</span>
+        <span id="district">Gama - Setor Leste</span>
+        <span id="city">Brasília</span>
+        <span id="cep">CEP: 72.444-240</span>
+      </span>
+</span>
+    </div>
+  </div>
+
+<div class="event-body">
+<h2>Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem.</h2>
+<div class="event-content">
+<p>Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>
+
+<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.</p>
+
+<p>Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</p>
+</div>
+</div>
+</div>
+
+<!-- Right SideBox -->
+<div id="temp">
+<div class="community-side-box">
+  <div class="community-logo">
+    
+  </div>
+  <div class="community-name">
+    <p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>
+  </div>
+</div>
+
+<div class="community-side-box">
+  <table>
+    <tr>
+      <th>Outros Eventos</th>
+    </tr>
+    <tr>
+      <td><span class="another-events-date">29/03 - </span><span class="another-event">Encontro dos colaboradores DF</span></td>
+    </tr>
+    <tr>
+      <td><span class="another-events-date">29/03 - </span><span class="another-event">Lançamento da versão 2.0</span></td>
+    </tr>
+  </table>
+</div>
+</div>
 \ No newline at end of file
@@ -669,7 +669,7 @@ ul#itens-legend-grafic{
   font-family: Arial;
   font-size: 14px;
   font-weight: 700;
-  padding-top: 13px;
+  padding: 13px 15px 0px 15px;
   text-align: center; 
   height: 100%;
   background-color: #ECEDF1;
@@ -707,12 +707,12 @@ ul#itens-legend-grafic{
 }
 .another-events-date {
-  color: #4562b1;
+  color: #2C4B6B;
   font-weight: 700;
 }
 .another-event {
-  color: #2C66CE;
+  color: #2C4B6B;
 }
 /************************** PÁGINA BLOG **************************/
@@ -810,7 +810,7 @@ ul#itens-legend-grafic{
 .blog-event-item{
   width: 500px;
   height: 110px;
-  border-top: solid 1px;
+  border-top: 1px solid #D3D6DE;
   padding-top: 25px;
 }
@@ -846,3 +846,54 @@ ul#itens-legend-grafic{
   padding-left: 4px;
 }
+
+.community-content-footer {
+  margin-top: 783px;
+  padding-left: 2px;
+  width: 100%;
+  border-top: 1px solid #D3D6DE;
+  padding-top: 37px;
+  padding-bottom: 56px;
+}
+
+.community-content-footer ul li {
+  display: inline;
+  border: 1px solid #D3D6DE;
+}
+
+.community-content-footer ul .index {
+  padding: 7px 11px 7px 11px;
+  border-radius: 4px;
+  margin-right: 4px;
+  font-family: Arial;
+  font-weight: 700;
+  font-size: 16px;
+}
+
+.community-content-footer ul #previous {
+  padding: 7px 11px 7px 11px;
+  border-radius: 4px;
+  margin-right: 38px;
+  font-family: Arial;
+  font-size: 14px;
+  padding-left: 35px;
+}
+
+.community-content-footer ul #next {
+  padding: 7px 11px 7px 11px;
+  border-radius: 4px;
+  margin-left: 30px;
+  padding-left: 14px;
+  padding-right: 32px;
+  font-family: Arial;
+  font-size: 14px;
+  letter-spacing: 0.6px;
+}
+
+.community-content-footer #indexes li a{
+  color: black;
+} 
+
+.community-content-footer li:active .index {
+  background-color: #ECEDF1;
+}
 \ No newline at end of file
	@@ -62,4 +62,16 @@		@@ -62,4 +62,16 @@
62	<p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>	62	<p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>
63	</div>	63	</div>
64	</div>	64	</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>
65	</div>	77	</div>
66	\ No newline at end of file	78	\ No newline at end of file
	@@ -0,0 +1,74 @@		@@ -0,0 +1,74 @@
		1	+<!-- Left SideBox -->
		2	+<div class="side-box">
		3	+<div class="box box-2" id="box-2"><div class="blocks">
		4	+
		5	+ <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>
		6	+
		7	+ <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>
		8	+<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Publique seu software</a></li>
		9	+
		10	+<li><a href="/admin/environment_design" class="icon-no-icon" target="_self">Desenvolvimento colaborativo</a></li>
		11	+
		12	+<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>
		13	+
		14	+ <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>
		15	+</div></div></div>
		16	+
		17	+<!-- Main Area -->
		18	+<div id="community-page">
		19	+ <h1>Título do evento</h1>
		20	+ <div id="event-card">
		21	+
		22	+ <div id="event-image">
		23	+ </div>
		24	+
		25	+ <div class="about-event">
		26	+ <span class="event-date">7 de fevereiro à 18 de março de 2015</span>
		27	+ <span class="event-link"><a href="ok.com">http://fga.unb.br/unb-gama/contato</a></span>
		28	+ <span class="event-address">
		29	+ <span id="area">Área Especial de Indústria Projeção A</span>
		30	+ <span id="district">Gama - Setor Leste</span>
		31	+ <span id="city">Brasília</span>
		32	+ <span id="cep">CEP: 72.444-240</span>
		33	+ </span>
		34	+</span>
		35	+ </div>
		36	+ </div>
		37	+
		38	+<div class="event-body">
		39	+<h2>Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem.</h2>
		40	+<div class="event-content">
		41	+<p>Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>
		42	+
		43	+<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.</p>
		44	+
		45	+<p>Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</p>
		46	+</div>
		47	+</div>
		48	+</div>
		49	+
		50	+<!-- Right SideBox -->
		51	+<div id="temp">
		52	+<div class="community-side-box">
		53	+ <div class="community-logo">
		54	+
		55	+ </div>
		56	+ <div class="community-name">
		57	+ <p>CACIC - Configurador Automático e Coletor de Informações Computacionais</p>
		58	+ </div>
		59	+</div>
		60	+
		61	+<div class="community-side-box">
		62	+ <table>
		63	+ <tr>
		64	+ <th>Outros Eventos</th>
		65	+ </tr>
		66	+ <tr>
		67	+ <td><span class="another-events-date">29/03 - </span><span class="another-event">Encontro dos colaboradores DF</span></td>
		68	+ </tr>
		69	+ <tr>
		70	+ <td><span class="another-events-date">29/03 - </span><span class="another-event">Lançamento da versão 2.0</span></td>
		71	+ </tr>
		72	+ </table>
		73	+</div>
		74	+</div>
0	\ No newline at end of file	75	\ No newline at end of file
	@@ -669,7 +669,7 @@ ul#itens-legend-grafic{		@@ -669,7 +669,7 @@ ul#itens-legend-grafic{
669	font-family: Arial;	669	font-family: Arial;
670	font-size: 14px;	670	font-size: 14px;
671	font-weight: 700;	671	font-weight: 700;
672	- padding-top: 13px;	672	+ padding: 13px 15px 0px 15px;
673	text-align: center;	673	text-align: center;
674	height: 100%;	674	height: 100%;
675	background-color: #ECEDF1;	675	background-color: #ECEDF1;
	@@ -707,12 +707,12 @@ ul#itens-legend-grafic{		@@ -707,12 +707,12 @@ ul#itens-legend-grafic{
707	}	707	}
708		708
709	.another-events-date {	709	.another-events-date {
710	- color: #4562b1;	710	+ color: #2C4B6B;
711	font-weight: 700;	711	font-weight: 700;
712	}	712	}
713		713
714	.another-event {	714	.another-event {
715	- color: #2C66CE;	715	+ color: #2C4B6B;
716	}	716	}
717		717
718	/************************ PÁGINA BLOG ************************/	718	/************************ PÁGINA BLOG ************************/
	@@ -810,7 +810,7 @@ ul#itens-legend-grafic{		@@ -810,7 +810,7 @@ ul#itens-legend-grafic{
810	.blog-event-item{	810	.blog-event-item{
811	width: 500px;	811	width: 500px;
812	height: 110px;	812	height: 110px;
813	- border-top: solid 1px;	813	+ border-top: 1px solid #D3D6DE;
814	padding-top: 25px;	814	padding-top: 25px;
815	}	815	}
816		816
	@@ -846,3 +846,54 @@ ul#itens-legend-grafic{		@@ -846,3 +846,54 @@ ul#itens-legend-grafic{
846	padding-left: 4px;	846	padding-left: 4px;
847		847
848	}	848	}
		849	+
		850	+.community-content-footer {
		851	+ margin-top: 783px;
		852	+ padding-left: 2px;
		853	+ width: 100%;
		854	+ border-top: 1px solid #D3D6DE;
		855	+ padding-top: 37px;
		856	+ padding-bottom: 56px;
		857	+}
		858	+
		859	+.community-content-footer ul li {
		860	+ display: inline;
		861	+ border: 1px solid #D3D6DE;
		862	+}
		863	+
		864	+.community-content-footer ul .index {
		865	+ padding: 7px 11px 7px 11px;
		866	+ border-radius: 4px;
		867	+ margin-right: 4px;
		868	+ font-family: Arial;
		869	+ font-weight: 700;
		870	+ font-size: 16px;
		871	+}
		872	+
		873	+.community-content-footer ul #previous {
		874	+ padding: 7px 11px 7px 11px;
		875	+ border-radius: 4px;
		876	+ margin-right: 38px;
		877	+ font-family: Arial;
		878	+ font-size: 14px;
		879	+ padding-left: 35px;
		880	+}
		881	+
		882	+.community-content-footer ul #next {
		883	+ padding: 7px 11px 7px 11px;
		884	+ border-radius: 4px;
		885	+ margin-left: 30px;
		886	+ padding-left: 14px;
		887	+ padding-right: 32px;
		888	+ font-family: Arial;
		889	+ font-size: 14px;
		890	+ letter-spacing: 0.6px;
		891	+}
		892	+
		893	+.community-content-footer #indexes li a{
		894	+ color: black;
		895	+}
		896	+
		897	+.community-content-footer li:active .index {
		898	+ background-color: #ECEDF1;
		899	+}
849	\ No newline at end of file	900	\ No newline at end of file