Merge branch 'restructuring_css' of https://gitlab.com/softwarepublico/noosfero-…

…spb-theme into restructuring_css

Merge branch 'restructuring_css' of https://gitlab.com/softwarepublico/noosfero-…
…spb-theme into restructuring_css
Melissa Wen
2 parents 28b11109 47d99aeb
Showing 8 changed files with 480 additions and 64 deletions Show diff stats
css/home-page.css
css/left-bar.css
css/news-page.css
css/popover.css
css/software-pages.css
footer.html.erb
style.css
theme.js
@@ -148,7 +148,7 @@
   display:none;
 }
  
-.action-home-index #content .software-block { 
+.action-home-index #content .software-block {
   width: 145px;
   height: 218px;
   margin: 0px 18px 14px 0px;
@@ -236,7 +236,7 @@
 /*** News block - display content block **/
  
 .action-home-index #content .display-content-block .block-title {
-  margin: 0px;  
+  margin: 0px;
   border-top: 4px solid #643C67;
   background: #eee;
   color: #643C67;
@@ -293,7 +293,7 @@
 }
  
 .action-home-index #content .display-content-block .lead {
-  max-height: 56px;
+  max-height: 47px;
   overflow: hidden;
 }
  
@@ -302,8 +302,8 @@
   font: 15px/1.3em arial;
 }
  
-.action-home-index #content .display-content-block .lead a:visited, 
-.action-home-index #content .lead a:visited, 
+.action-home-index #content .display-content-block .lead a:visited,
+.action-home-index #content .lead a:visited,
 .action-home-index #content .lead dl.portlet a:visited {
   color: #172738;
 }
@@ -331,7 +331,7 @@
  
 /*** What Is block - Article block **/
  
-.action-home-index #content .article-block .block-title {
+.template-default .action-home-index #content .box-3 .article-block .block-title {
   border-top: 4px solid #08A649;
   border-bottom: none;
   padding: 6px 8px 22px 10px;
@@ -342,20 +342,20 @@
   text-transform: none;
 }
  
-.action-home-index #content .article-block .read-more {
+.template-default .action-home-index #content .box-3 .article-block .read-more {
   margin-top: 30px;
   border-top: 1px solid #08A649;
 }
  
-.action-home-index #content .article-block .read-more a::after {
+.template-default .action-home-index #content .box-3 .article-block .read-more a::after {
   background: #08A649;
 }
  
-.action-home-index #content .article-block .short-post {
+.template-default .action-home-index #content .box-3 .article-block .short-post {
   padding-top: 23px;
 }
  
-.action-home-index #content .article-block p {
+.template-default .action-home-index #content .box-3 .article-block p {
   margin: 0px 0px 14px 0px;
   padding: 0px;
   font: 15px/18px arial, helvetica, sans-serif;
@@ -371,7 +371,7 @@
  
 .action-home-index #content .highlights-border {
   border: 1px solid #c0c1c1;
-  border-radius: 8px 8px 8px 8px;
+  border-radius: 8px;
   width: auto;
   height: 248px;
   max-height: 250px;
@@ -384,15 +384,15 @@
 }
  
 .action-home-index #content .highlights-container {
-  border-radius: 8px 8px 8px 8px;
+  border-radius: 8px;
   border-width: 0px 0px 1px 0px;
   border-bottom: none;
-  padding: 0px 0px 0px 0px;
+  padding: 0;
   width: 100% !important;
   max-height: 230px;
   background: transparent;
   position: relative;
-  top: 0px;
+  top: 0;
 }
  
 .action-home-index #content .highlights-image-link {
@@ -422,11 +422,9 @@
 }
  
 .action-home-index #content .highlights-block-pager {
-  border: 0;
-  padding: 0px 0px 0px 0px;
-  width: 232px;
-  float: left;
-  position: static;
+  float: none;
+  display: block;
+  text-align: center;
 }
  
 .action-home-index #content .highlights-block-pager a {
@@ -448,6 +446,24 @@
   color: transparent;
 }
  
+/*** software highlights block ***/
+
+.action-home-index #content a.toggle-popover,
+.action-home-index #content a.toggle-popover:hover {
+  margin: 0 0 0 55px;
+  color: #3867b7;
+  cursor: pointer;
+}
+
+.action-home-index #content span.popover-span {
+  padding: 1px 6px;
+  border-radius: 50%;
+  background-color: #3867b7;
+  color: #ffffff;
+  font-weight: bold;
+  cursor: pointer;
+}
+
 /*** mais software block **/
 .action-home-index #content #mais-software-block {
   margin: 11px 0px;
 /******************** Box-2 ********************/
  
-.box-2{
+/*** WARNING - WITHOUT BOX-4 ***/
+
+.template-default .box-2 {
   width:150px;
 }
  
-#content .box-2 .block-outer .block-title {
+.template-default #content .box-2 .block-outer .block-title {
 	background: #eee;
 	color: #4562b1;
 	border-top: 4px solid #4562b1;
@@ -13,14 +15,86 @@
  
 /*** Menus - Link list block ***/
  
-#content .box-2 .link-list-block li {
+.template-default #content .box-2 .link-list-block li {
+  margin: 0;
+  padding: 0;
+  border-bottom: 1px solid #ddd;
+  border-top: none;
+}
+
+.template-default #content .box-2 .link-list-block li a {
+  width: auto;
+  padding: 6px 5px 8px 18px;
+  background-color: #fff;
+  background-position: 0px 50%;
+  color: #2C66CE;
+  border-right: none;
+  border-top: 0px solid #64946E;
+  border-radius: 0 0 0 0;
+  font-weight: normal;
+  font-size: 14px;
+  line-height: 17px;
+}
+
+.template-default #content .box-2 .link-list-block h3.empty + ul {
+  border-top: 1px solid #ddd;
+}
+
+.template-default #content .box-2 .link-list-block h3.empty + ul li a {
+  padding-left: 0px;
+  padding-right: 0px;
+  background-image: none;
+}
+
+.template-default #content .box-2 .link-list-block li a.link-this-page,
+.template-default #content .box-2 .link-list-block li a.link-this-page:hover {
+  border-right: none;
+}
+
+.template-default #content .box-2 .link-list-block li a:hover {
+  background-color: #FFFFFF;
+  color: #000;
+}
+.template-default #content .box-2 .link-list-block li a.link-this-page {
+  width: auto;
+  margin-left: 0px;
+  background-color: #ffffff;
+  font-weight: bold;
+}
+
+/*** END OF WARNING - WITHOUT BOX-4 ***/
+
+/*** WARNING - WITH BOX-4 ***/
+
+/************ DUPLICATE ************
+
+    This part of the code is duplicated because, if there is
+    a change of layout from template-default to lefttopright
+    the CSS fit without many complication.
+
+ */
+
+.template-lefttopright .box-3 {
+  width:150px;
+}
+
+.template-lefttopright #content .box-3 .block-outer .block-title {
+  background: #eee;
+  color: #4562b1;
+  border-top: 4px solid #4562b1;
+  line-height: 15px;
+}
+
+/*** Menus - Link list block ***/
+
+.template-lefttopright #content .box-3 .link-list-block li {
   margin: 0;
   padding: 0;
   border-bottom: 1px solid #ddd;
   border-top: none;
 }
  
-#content .box-2 .link-list-block li a {
+.template-lefttopright #content .box-3 .link-list-block li a {
   width: auto;
   padding: 6px 5px 8px 18px;
   background-color: #fff;
@@ -34,33 +108,41 @@
   line-height: 17px;
 }
  
-#content .box-2 .link-list-block h3.empty + ul {
+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul {
   border-top: 1px solid #ddd;
 }
  
-#content .box-2 .link-list-block h3.empty + ul li a {
+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul li a {
   padding-left: 0px;
   padding-right: 0px;
   background-image: none;
 }
  
-#content .box-2 .link-list-block li a.link-this-page,
-#content .box-2 .link-list-block li a.link-this-page:hover {
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page,
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page:hover {
   border-right: none;
 }
  
-#content .box-2 .link-list-block li a:hover {
+.template-lefttopright #content .box-3 .link-list-block li a:hover {
   background-color: #FFFFFF;
   color: #000;
 }
-#content .box-2 .link-list-block li a.link-this-page {
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page {
   width: auto;
   margin-left: 0px;
   background-color: #ffffff;
   font-weight: bold;
 }
  
+/************ END OF DUPLICATE ************
+
+/*** END OF WARNING - WITH BOX-4 ***/
+
 /*** Statistics block **/
+.template-default #content .box-2 .statistics-block {
+  padding: 10px 0px 10px 10px
+}
+
 .statistics-block-data ul {
   margin-top: 10px;
 }
@@ -83,6 +165,9 @@ span.amount {
 span.label {
   font-size: 14px;
 }
+
 /*** end of statistics block **/
  
+/*** WARNING - WITH BOX-4 ***/
+
 /******************** end Box-2 ********************/
@@ -2,18 +2,15 @@
  
 /** Header's Block **/
 #content .blog #article-header h1.title {
-  margin: 0px 0px 10px 0px;
-  border: none;
-  padding: 0px 0px 0px 0px;
-  color: #FF0366;
-  text-transform: uppercase;
-  font: normal normal normal 16px/37px 'open_sansregular';
+  margin: 20px 0px 10px 0px;
+  padding: 0px 0px 10px 0px;
+  font: normal normal bold 35px/37px arial;
 }
  
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  */
 #content .blog #article-header .publishing-info .date,
@@ -63,7 +60,7 @@
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  */
 #content .blog .blog-post .author {
@@ -100,7 +97,7 @@
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  *   The correct is the text is sensitive to lead to the complete text.
  */
@@ -142,9 +139,9 @@
 #content .blog .page-1 .position-3,
 #content .blog .page-1 .position-4 {
   margin: 0px 0px 0px 0px;
-  padding: 20px 30px 45px 0px;
+  padding: 20px  21px 45px 0px;
   height: 235px;
-  width: 30.5%; 
+  width: 30.5%;
   display: block;
   float: left;
 }
@@ -0,0 +1,191 @@
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1060;
+  display: none;
+  max-width: 276px;
+  padding: 1px;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1.42857143;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+  white-space: normal;
+  background-color: #fff;
+  -webkit-background-clip: padding-box;
+          background-clip: padding-box;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, .2);
+  border-radius: 6px;
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
+          box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
+
+  line-break: auto;
+}
+.popover.top {
+  margin-top: -12px;
+}
+.popover.right {
+  margin-left: 10px;
+}
+.popover.bottom {
+  margin-top: 10px;
+}
+.popover.left {
+  margin-left: -10px;
+}
+.popover-title {
+  padding: 8px 14px;
+  margin: 0;
+  font-size: 14px;
+  background-color: #f7f7f7;
+  border-bottom: 1px solid #ebebeb;
+  border-radius: 5px 5px 0 0;
+}
+.popover-content {
+  padding: 9px 14px;
+}
+.popover > .arrow,
+.popover > .arrow:after {
+  position: absolute;
+  display: block;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+.popover > .arrow {
+  border-width: 11px;
+}
+.popover > .arrow:after {
+  content: "";
+  border-width: 10px;
+}
+.popover.top > .arrow {
+  bottom: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-top-color: #999;
+  border-top-color: rgba(0, 0, 0, .25);
+  border-bottom-width: 0;
+}
+.popover.top > .arrow:after {
+  bottom: 1px;
+  margin-left: -10px;
+  content: " ";
+  border-top-color: #fff;
+  border-bottom-width: 0;
+}
+.popover.right > .arrow {
+  top: 50%;
+  left: -11px;
+  margin-top: -11px;
+  border-right-color: #999;
+  border-right-color: rgba(0, 0, 0, .25);
+  border-left-width: 0;
+}
+.popover.right > .arrow:after {
+  bottom: -10px;
+  left: 1px;
+  content: " ";
+  border-right-color: #fff;
+  border-left-width: 0;
+}
+.popover.bottom > .arrow {
+  top: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-top-width: 0;
+  border-bottom-color: #999;
+  border-bottom-color: rgba(0, 0, 0, .25);
+}
+.popover.bottom > .arrow:after {
+  top: 1px;
+  margin-left: -10px;
+  content: " ";
+  border-top-width: 0;
+  border-bottom-color: #fff;
+}
+.popover.left > .arrow {
+  top: 50%;
+  right: -11px;
+  margin-top: -11px;
+  border-right-width: 0;
+  border-left-color: #999;
+  border-left-color: rgba(0, 0, 0, .25);
+}
+.popover.left > .arrow:after {
+  right: 1px;
+  bottom: -10px;
+  content: " ";
+  border-right-width: 0;
+  border-left-color: #fff;
+}
+
+/*** popover in software highlights block ***/
+
+.highlights-popover {
+  max-width: 280px;
+  margin: 0 0 0 -75px;
+  background: #172638;
+  color: #FFFFFF;
+}
+
+.highlights-popover .popover-content {
+  padding: 0;
+}
+
+.highlights-popover p {
+  padding: 13px 13px 15px;
+  margin: 0px;
+  font-size: 14px;
+  line-height: 20px;
+}
+    
+.highlights-popover span {
+  font-weight: bold;
+  border-bottom: 1px dotted #FFFFFF;
+}
+
+#content .highlights-popover a,
+#content .highlights-popover a:visited,
+#content .highlights-popover a:hover,
+#content .highlights-popover a:link {
+  font-weight: bold;
+  color: #FFFFFF;
+  display: block;
+  padding: 8px 15px;
+  border-top: 1px dotted rgba(255,255,255,0.1);
+}
+
+.highlights-popover a:before {
+  font-family: "FontAwesome";
+  content: "\f067";
+  vertical-align: middle;
+  color: #ff0066;
+  padding: 0 5px 0 0;
+}
+
+.highlights-popover.top > .arrow,
+.highlights-popover.right > .arrow,
+.highlights-popover.bottom > .arrow,
+.highlights-popover.left > .arrow {
+  margin-left: 64px;
+}
+
+.highlights-popover.top > .arrow:after,
+.highlights-popover.right > .arrow:after,
+.highlights-popover.bottom > .arrow:after,
+.highlights-popover.left > .arrow:after {
+  border-top-color: #172638;
+}
@@ -50,7 +50,7 @@
 }
  
 #content .download-block .download-list li {
-  padding: 30px 10px 30px 10px;
+  padding: 30px 10px 25px 10px;
   border-top: 1px solid #D3D6DE;
   clear: both;
 }
@@ -104,7 +104,7 @@
   font-size: 12px;
 }
  
-#content .download-block .download-info .req_min_spb a {
+#content .download-block .download-info .min-requirements a {
   line-height: 40px;
   color: #3E67B1;
   text-decoration: underline;
@@ -180,7 +180,6 @@
 }
  
 #content .box-1 .categories-and-tags-block .block-title {
-  display: inline-flex;
   margin: 13px 10px 10px 0;
   padding: 3px 0px;
   background: none;
@@ -188,16 +187,18 @@
   font-family: Arial;
   font-size: 12px;
   font-weight: 300;
+  float: left;
 }
  
 #content .box-1 .categories-and-tags-block .category_cloud {
-  margin: 13px 10px 10px 0px;
-  display: inline-flex;
+  margin: 13px 0 10px 0;
+  float: left;
+  max-width: 87%;
 }
  
 #content .box-1 .categories-and-tags-block .category_cloud a {
   padding: 3px 10px;
-  margin: 0;
+  margin: 5px;
   float: left;
   color: #3E67B1;
   background-color: #ECEDF1;
@@ -220,22 +221,123 @@
  
 /*** Right bar ***/
  
+/*** WARNING - WHITOUT BOX-4 ***/
+
+/* Link-list block */
+.template-default #content .box-3 .block-title {
+  border-top: 4px solid #4562b1;
+  line-height: 15px;
+  background: #eee;
+  color: #4562b1;
+}
+
+.template-default #content .box-3 .link-list-block li {
+  margin: 0px;
+  padding: 0px;
+  border-bottom: 1px solid #ddd;
+  border-top: none;
+}
+
+.template-default #content .box-3 .link-list-block li a {
+  border-right: none;
+  border-top: 0px solid #64946E;
+  border-radius: 0px 0px 0px 0px;
+  padding: 6px 5px 8px 18px;
+  width: auto;
+  line-height: 17px;
+  background-color: #fff;
+  background-position: 0px 50%;
+  color: #2C66CE;
+  font-weight: normal;
+  font-size: 14px;
+}
+
+.template-default #content .box-3 .link-list-block h3.empty + ul {
+  border-top: 1px solid #ddd;
+}
+
+.template-default #content .box-3 .link-list-block li a.link-this-page,
+.template-default #content .box-3 .link-list-block li a.link-this-page:hover {
+  border-right: none;
+}
+
+.template-default #content .box-3 .link-list-block li a:hover {
+  background-color: #FFFFFF;
+  color: #000;
+}
+
+.template-default #content .box-3 .link-list-block li a.link-this-page {
+  margin-left: 0px;
+  width: auto;
+  background-color: #ffffff;
+  font-weight: bold;
+}
+
+/* Repository block */
+.template-default .box-3 #bt_repositorio,
+.template-default .box-3 #bt_repositorio:active,
+.template-default .box-3 #bt_repositorio:visited {
+  border-radius: 4px;
+  padding: 12px 10px;
+  background: #EAEBEE;
+  font: normal normal bold 12px 'open_sansbold', arial, helvetica, sans-serif;
+  text-transform: uppercase;
+  display: block;
+  position: relative;
+}
+
+.template-default .box-3 #bt_repositorio::after {
+  margin-top: -2px;
+  padding: 4px 0px 4px 2px;
+  border-radius: 4px;
+  width: 18px;
+  right: 10px;
+  line-height: 20px;
+  position: absolute;
+  background: #2C66CE;
+  color: #FFF;
+  font-size: 16px;
+  text-align: center;
+  content: url('../images/right-arrow.png');
+}
+
+.template-default .box-3 #content #bt_repositorio:hover {
+  color: #FFF;
+  background: #2C66CE;
+  text-decoration: none;
+}
+/*** END - WARNING - WHITOUT BOX-4 ***/
+
+/*** end of right bar ***/
+
+/************ DUPLICATE ************/
+
+/*
+    This part of the code is duplicated because, if there is
+    a change of layout from template-default to lefttopright
+    the CSS fit without many complication.
+ */
+
+/*** Right bar ***/
+
+/*** WARNING - WITH BOX-4 ***/
+
 /* Link-list block */
-#content .box-3 .block-title {
+.template-lefttopright #content .box-2 .block-title {
   border-top: 4px solid #4562b1;
   line-height: 15px;
   background: #eee;
   color: #4562b1;
 }
  
-#content .box-3 .link-list-block li {
+.template-lefttopright #content .box-2 .link-list-block li {
   margin: 0px;
   padding: 0px;
   border-bottom: 1px solid #ddd;
   border-top: none;
 }
  
-#content .box-3 .link-list-block li a {
+.template-lefttopright #content .box-2 .link-list-block li a {
   border-right: none;
   border-top: 0px solid #64946E;
   border-radius: 0px 0px 0px 0px;
@@ -249,21 +351,21 @@
   font-size: 14px;
 }
  
-#content .box-3 .link-list-block h3.empty + ul {
+.template-lefttopright #content .box-2 .link-list-block h3.empty + ul {
   border-top: 1px solid #ddd;
 }
  
-#content .box-3 .link-list-block li a.link-this-page,
-#content .box-3 .link-list-block li a.link-this-page:hover {
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page,
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page:hover {
   border-right: none;
 }
  
-#content .box-3 .link-list-block li a:hover {
+.template-lefttopright #content .box-2 .link-list-block li a:hover {
   background-color: #FFFFFF;
   color: #000;
 }
  
-#content .box-3 .link-list-block li a.link-this-page {
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page {
   margin-left: 0px;
   width: auto;
   background-color: #ffffff;
@@ -271,9 +373,9 @@
 }
  
 /* Repository block */
-.box-3 #bt_repositorio, 
-.box-3 #bt_repositorio:active, 
-.box-3 #bt_repositorio:visited {
+.template-lefttopright .box-2 #bt_repositorio,
+.template-lefttopright .box-2 #bt_repositorio:active,
+.template-lefttopright .box-2 #bt_repositorio:visited {
   border-radius: 4px;
   padding: 12px 10px;
   background: #EAEBEE;
@@ -283,7 +385,7 @@
   position: relative;
 }
  
-.box-3 #bt_repositorio::after {
+.template-lefttopright .box-2 #bt_repositorio::after {
   margin-top: -2px;
   padding: 4px 0px 4px 2px;
   border-radius: 4px;
@@ -298,13 +400,19 @@
   content: url('../images/right-arrow.png');
 }
  
-.box-3 #content #bt_repositorio:hover {
+.template-lefttopright .box-2 #content #bt_repositorio:hover {
   color: #FFF;
   background: #2C66CE;
   text-decoration: none;
 }
+
+/*** WARNING - WITH BOX-4 ***/
+
 /*** end of right bar ***/
  
+/************ END DUPLICATE ************/
+
+
 /*** Software internal pages ***/
  
 /* FAQ page */
@@ -120,4 +120,4 @@
  
  <!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->
    <script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript>&nbsp;<!-- item para fins de acessibilidade --></noscript>
-
+   <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
@@ -19,11 +19,11 @@
 @import url(css/article-page.css);
 @import url(css/software-pages.css);
 @import url(css/community-pages.css);
-@import url(css/use-report.css);
 @import url(css/news-page.css);
 @import url(css/search-pages.css);
 @import url(css/software-catalog-page.css);
 @import url(css/tooltip.css);
+@import url(css/popover.css);
  
 @font-face{
   font-weight: normal;
@@ -250,11 +250,31 @@ $(&#39;#link-buscar&#39;).click(function(e) {
     });
   }
  
-  $(document).ready(function(){
+  function add_popovers() {
+    var span = $('span[data-toggle="popover"]');
+    var place = span.attr("data-placement");
+    var elementClass = span.attr("data-class");
+    var popover =  span.popover({
+      html:true,
+      placement: place,
+      content: function() {
+        return $(this).next().html();
+      }
+    })
+    .data('bs.popover');
+    if(popover) {
+      popover.tip()
+      .addClass(elementClass);
+      $('a.toggle-popover').on("click",function() {
+        span.trigger("click");
+      });
+    }
+  }
  
+  $(document).ready(function(){
+    add_popovers();
     add_top_tooltips();
     move_article_buttons();
-    add_link_to_article_div();
     insert_notice_div();
     set_uploaded_files_names();
     set_tooltip_content();
@@ -263,4 +283,3 @@ $(&#39;#link-buscar&#39;).click(function(e) {
     setEvents();
     });
 })(jQuery);
-
...	...	@@ -148,7 +148,7 @@
148	148	display:none;
149	149	}
150	150
151		-.action-home-index #content .software-block {
	151	+.action-home-index #content .software-block {
152	152	width: 145px;
153	153	height: 218px;
154	154	margin: 0px 18px 14px 0px;
...	...	@@ -236,7 +236,7 @@
236	236	/* News block - display content block /
237	237
238	238	.action-home-index #content .display-content-block .block-title {
239		- margin: 0px;
	239	+ margin: 0px;
240	240	border-top: 4px solid #643C67;
241	241	background: #eee;
242	242	color: #643C67;
...	...	@@ -293,7 +293,7 @@
293	293	}
294	294
295	295	.action-home-index #content .display-content-block .lead {
296		- max-height: 56px;
	296	+ max-height: 47px;
297	297	overflow: hidden;
298	298	}
299	299
...	...	@@ -302,8 +302,8 @@
302	302	font: 15px/1.3em arial;
303	303	}
304	304
305		-.action-home-index #content .display-content-block .lead a:visited,
306		-.action-home-index #content .lead a:visited,
	305	+.action-home-index #content .display-content-block .lead a:visited,
	306	+.action-home-index #content .lead a:visited,
307	307	.action-home-index #content .lead dl.portlet a:visited {
308	308	color: #172738;
309	309	}
...	...	@@ -331,7 +331,7 @@
331	331
332	332	/* What Is block - Article block /
333	333
334		-.action-home-index #content .article-block .block-title {
	334	+.template-default .action-home-index #content .box-3 .article-block .block-title {
335	335	border-top: 4px solid #08A649;
336	336	border-bottom: none;
337	337	padding: 6px 8px 22px 10px;
...	...	@@ -342,20 +342,20 @@
342	342	text-transform: none;
343	343	}
344	344
345		-.action-home-index #content .article-block .read-more {
	345	+.template-default .action-home-index #content .box-3 .article-block .read-more {
346	346	margin-top: 30px;
347	347	border-top: 1px solid #08A649;
348	348	}
349	349
350		-.action-home-index #content .article-block .read-more a::after {
	350	+.template-default .action-home-index #content .box-3 .article-block .read-more a::after {
351	351	background: #08A649;
352	352	}
353	353
354		-.action-home-index #content .article-block .short-post {
	354	+.template-default .action-home-index #content .box-3 .article-block .short-post {
355	355	padding-top: 23px;
356	356	}
357	357
358		-.action-home-index #content .article-block p {
	358	+.template-default .action-home-index #content .box-3 .article-block p {
359	359	margin: 0px 0px 14px 0px;
360	360	padding: 0px;
361	361	font: 15px/18px arial, helvetica, sans-serif;
...	...	@@ -371,7 +371,7 @@
371	371
372	372	.action-home-index #content .highlights-border {
373	373	border: 1px solid #c0c1c1;
374		- border-radius: 8px 8px 8px 8px;
	374	+ border-radius: 8px;
375	375	width: auto;
376	376	height: 248px;
377	377	max-height: 250px;
...	...	@@ -384,15 +384,15 @@
384	384	}
385	385
386	386	.action-home-index #content .highlights-container {
387		- border-radius: 8px 8px 8px 8px;
	387	+ border-radius: 8px;
388	388	border-width: 0px 0px 1px 0px;
389	389	border-bottom: none;
390		- padding: 0px 0px 0px 0px;
	390	+ padding: 0;
391	391	width: 100% !important;
392	392	max-height: 230px;
393	393	background: transparent;
394	394	position: relative;
395		- top: 0px;
	395	+ top: 0;
396	396	}
397	397
398	398	.action-home-index #content .highlights-image-link {
...	...	@@ -422,11 +422,9 @@
422	422	}
423	423
424	424	.action-home-index #content .highlights-block-pager {
425		- border: 0;
426		- padding: 0px 0px 0px 0px;
427		- width: 232px;
428		- float: left;
429		- position: static;
	425	+ float: none;
	426	+ display: block;
	427	+ text-align: center;
430	428	}
431	429
432	430	.action-home-index #content .highlights-block-pager a {
...	...	@@ -448,6 +446,24 @@
448	446	color: transparent;
449	447	}
450	448
	449	+/* software highlights block */
	450	+
	451	+.action-home-index #content a.toggle-popover,
	452	+.action-home-index #content a.toggle-popover:hover {
	453	+ margin: 0 0 0 55px;
	454	+ color: #3867b7;
	455	+ cursor: pointer;
	456	+}
	457	+
	458	+.action-home-index #content span.popover-span {
	459	+ padding: 1px 6px;
	460	+ border-radius: 50%;
	461	+ background-color: #3867b7;
	462	+ color: #ffffff;
	463	+ font-weight: bold;
	464	+ cursor: pointer;
	465	+}
	466	+
451	467	/* mais software block /
452	468	.action-home-index #content #mais-software-block {
453	469	margin: 11px 0px;
...	...
1	1	/****************** Box-2 ******************/
2	2
3		-.box-2{
	3	+/* WARNING - WITHOUT BOX-4 */
	4	+
	5	+.template-default .box-2 {
4	6	width:150px;
5	7	}
6	8
7		-#content .box-2 .block-outer .block-title {
	9	+.template-default #content .box-2 .block-outer .block-title {
8	10	background: #eee;
9	11	color: #4562b1;
10	12	border-top: 4px solid #4562b1;
...	...	@@ -13,14 +15,86 @@
13	15
14	16	/* Menus - Link list block */
15	17
16		-#content .box-2 .link-list-block li {
	18	+.template-default #content .box-2 .link-list-block li {
	19	+ margin: 0;
	20	+ padding: 0;
	21	+ border-bottom: 1px solid #ddd;
	22	+ border-top: none;
	23	+}
	24	+
	25	+.template-default #content .box-2 .link-list-block li a {
	26	+ width: auto;
	27	+ padding: 6px 5px 8px 18px;
	28	+ background-color: #fff;
	29	+ background-position: 0px 50%;
	30	+ color: #2C66CE;
	31	+ border-right: none;
	32	+ border-top: 0px solid #64946E;
	33	+ border-radius: 0 0 0 0;
	34	+ font-weight: normal;
	35	+ font-size: 14px;
	36	+ line-height: 17px;
	37	+}
	38	+
	39	+.template-default #content .box-2 .link-list-block h3.empty + ul {
	40	+ border-top: 1px solid #ddd;
	41	+}
	42	+
	43	+.template-default #content .box-2 .link-list-block h3.empty + ul li a {
	44	+ padding-left: 0px;
	45	+ padding-right: 0px;
	46	+ background-image: none;
	47	+}
	48	+
	49	+.template-default #content .box-2 .link-list-block li a.link-this-page,
	50	+.template-default #content .box-2 .link-list-block li a.link-this-page:hover {
	51	+ border-right: none;
	52	+}
	53	+
	54	+.template-default #content .box-2 .link-list-block li a:hover {
	55	+ background-color: #FFFFFF;
	56	+ color: #000;
	57	+}
	58	+.template-default #content .box-2 .link-list-block li a.link-this-page {
	59	+ width: auto;
	60	+ margin-left: 0px;
	61	+ background-color: #ffffff;
	62	+ font-weight: bold;
	63	+}
	64	+
	65	+/* END OF WARNING - WITHOUT BOX-4 */
	66	+
	67	+/* WARNING - WITH BOX-4 */
	68	+
	69	+/********** DUPLICATE **********
	70	+
	71	+ This part of the code is duplicated because, if there is
	72	+ a change of layout from template-default to lefttopright
	73	+ the CSS fit without many complication.
	74	+
	75	+ */
	76	+
	77	+.template-lefttopright .box-3 {
	78	+ width:150px;
	79	+}
	80	+
	81	+.template-lefttopright #content .box-3 .block-outer .block-title {
	82	+ background: #eee;
	83	+ color: #4562b1;
	84	+ border-top: 4px solid #4562b1;
	85	+ line-height: 15px;
	86	+}
	87	+
	88	+/* Menus - Link list block */
	89	+
	90	+.template-lefttopright #content .box-3 .link-list-block li {
17	91	margin: 0;
18	92	padding: 0;
19	93	border-bottom: 1px solid #ddd;
20	94	border-top: none;
21	95	}
22	96
23		-#content .box-2 .link-list-block li a {
	97	+.template-lefttopright #content .box-3 .link-list-block li a {
24	98	width: auto;
25	99	padding: 6px 5px 8px 18px;
26	100	background-color: #fff;
...	...	@@ -34,33 +108,41 @@
34	108	line-height: 17px;
35	109	}
36	110
37		-#content .box-2 .link-list-block h3.empty + ul {
	111	+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul {
38	112	border-top: 1px solid #ddd;
39	113	}
40	114
41		-#content .box-2 .link-list-block h3.empty + ul li a {
	115	+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul li a {
42	116	padding-left: 0px;
43	117	padding-right: 0px;
44	118	background-image: none;
45	119	}
46	120
47		-#content .box-2 .link-list-block li a.link-this-page,
48		-#content .box-2 .link-list-block li a.link-this-page:hover {
	121	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page,
	122	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page:hover {
49	123	border-right: none;
50	124	}
51	125
52		-#content .box-2 .link-list-block li a:hover {
	126	+.template-lefttopright #content .box-3 .link-list-block li a:hover {
53	127	background-color: #FFFFFF;
54	128	color: #000;
55	129	}
56		-#content .box-2 .link-list-block li a.link-this-page {
	130	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page {
57	131	width: auto;
58	132	margin-left: 0px;
59	133	background-color: #ffffff;
60	134	font-weight: bold;
61	135	}
62	136
	137	+/********** END OF DUPLICATE **********
	138	+
	139	+/* END OF WARNING - WITH BOX-4 */
	140	+
63	141	/* Statistics block /
	142	+.template-default #content .box-2 .statistics-block {
	143	+ padding: 10px 0px 10px 10px
	144	+}
	145	+
64	146	.statistics-block-data ul {
65	147	margin-top: 10px;
66	148	}
...	...	@@ -83,6 +165,9 @@ span.amount {
83	165	span.label {
84	166	font-size: 14px;
85	167	}
	168	+
86	169	/* end of statistics block /
87	170
	171	+/* WARNING - WITH BOX-4 */
	172	+
88	173	/****************** end Box-2 ******************/
...	...
...	...	@@ -2,18 +2,15 @@
2	2
3	3	/ Header's Block /
4	4	#content .blog #article-header h1.title {
5		- margin: 0px 0px 10px 0px;
6		- border: none;
7		- padding: 0px 0px 0px 0px;
8		- color: #FF0366;
9		- text-transform: uppercase;
10		- font: normal normal normal 16px/37px 'open_sansregular';
	5	+ margin: 20px 0px 10px 0px;
	6	+ padding: 0px 0px 10px 0px;
	7	+ font: normal normal bold 35px/37px arial;
11	8	}
12	9
13	10	/* WARNING:
14	11	* This solution is TEMPORARY. This informations shouldn't exist
15	12	* in this area.
16		- *
	13	+ *
17	14	* TODO: Remove this informations of the html and, then, from here.
18	15	*/
19	16	#content .blog #article-header .publishing-info .date,
...	...	@@ -63,7 +60,7 @@
63	60	/* WARNING:
64	61	* This solution is TEMPORARY. This informations shouldn't exist
65	62	* in this area.
66		- *
	63	+ *
67	64	* TODO: Remove this informations of the html and, then, from here.
68	65	*/
69	66	#content .blog .blog-post .author {
...	...	@@ -100,7 +97,7 @@
100	97	/* WARNING:
101	98	* This solution is TEMPORARY. This informations shouldn't exist
102	99	* in this area.
103		- *
	100	+ *
104	101	* TODO: Remove this informations of the html and, then, from here.
105	102	* The correct is the text is sensitive to lead to the complete text.
106	103	*/
...	...	@@ -142,9 +139,9 @@
142	139	#content .blog .page-1 .position-3,
143	140	#content .blog .page-1 .position-4 {
144	141	margin: 0px 0px 0px 0px;
145		- padding: 20px 30px 45px 0px;
	142	+ padding: 20px 21px 45px 0px;
146	143	height: 235px;
147		- width: 30.5%;
	144	+ width: 30.5%;
148	145	display: block;
149	146	float: left;
150	147	}
...	...
...	...	@@ -0,0 +1,191 @@
	1	+.popover {
	2	+ position: absolute;
	3	+ top: 0;
	4	+ left: 0;
	5	+ z-index: 1060;
	6	+ display: none;
	7	+ max-width: 276px;
	8	+ padding: 1px;
	9	+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	10	+ font-size: 14px;
	11	+ font-style: normal;
	12	+ font-weight: normal;
	13	+ line-height: 1.42857143;
	14	+ text-align: left;
	15	+ text-align: start;
	16	+ text-decoration: none;
	17	+ text-shadow: none;
	18	+ text-transform: none;
	19	+ letter-spacing: normal;
	20	+ word-break: normal;
	21	+ word-spacing: normal;
	22	+ word-wrap: normal;
	23	+ white-space: normal;
	24	+ background-color: #fff;
	25	+ -webkit-background-clip: padding-box;
	26	+ background-clip: padding-box;
	27	+ border: 1px solid #ccc;
	28	+ border: 1px solid rgba(0, 0, 0, .2);
	29	+ border-radius: 6px;
	30	+ -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	31	+ box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	32	+
	33	+ line-break: auto;
	34	+}
	35	+.popover.top {
	36	+ margin-top: -12px;
	37	+}
	38	+.popover.right {
	39	+ margin-left: 10px;
	40	+}
	41	+.popover.bottom {
	42	+ margin-top: 10px;
	43	+}
	44	+.popover.left {
	45	+ margin-left: -10px;
	46	+}
	47	+.popover-title {
	48	+ padding: 8px 14px;
	49	+ margin: 0;
	50	+ font-size: 14px;
	51	+ background-color: #f7f7f7;
	52	+ border-bottom: 1px solid #ebebeb;
	53	+ border-radius: 5px 5px 0 0;
	54	+}
	55	+.popover-content {
	56	+ padding: 9px 14px;
	57	+}
	58	+.popover > .arrow,
	59	+.popover > .arrow:after {
	60	+ position: absolute;
	61	+ display: block;
	62	+ width: 0;
	63	+ height: 0;
	64	+ border-color: transparent;
	65	+ border-style: solid;
	66	+}
	67	+.popover > .arrow {
	68	+ border-width: 11px;
	69	+}
	70	+.popover > .arrow:after {
	71	+ content: "";
	72	+ border-width: 10px;
	73	+}
	74	+.popover.top > .arrow {
	75	+ bottom: -11px;
	76	+ left: 50%;
	77	+ margin-left: -11px;
	78	+ border-top-color: #999;
	79	+ border-top-color: rgba(0, 0, 0, .25);
	80	+ border-bottom-width: 0;
	81	+}
	82	+.popover.top > .arrow:after {
	83	+ bottom: 1px;
	84	+ margin-left: -10px;
	85	+ content: " ";
	86	+ border-top-color: #fff;
	87	+ border-bottom-width: 0;
	88	+}
	89	+.popover.right > .arrow {
	90	+ top: 50%;
	91	+ left: -11px;
	92	+ margin-top: -11px;
	93	+ border-right-color: #999;
	94	+ border-right-color: rgba(0, 0, 0, .25);
	95	+ border-left-width: 0;
	96	+}
	97	+.popover.right > .arrow:after {
	98	+ bottom: -10px;
	99	+ left: 1px;
	100	+ content: " ";
	101	+ border-right-color: #fff;
	102	+ border-left-width: 0;
	103	+}
	104	+.popover.bottom > .arrow {
	105	+ top: -11px;
	106	+ left: 50%;
	107	+ margin-left: -11px;
	108	+ border-top-width: 0;
	109	+ border-bottom-color: #999;
	110	+ border-bottom-color: rgba(0, 0, 0, .25);
	111	+}
	112	+.popover.bottom > .arrow:after {
	113	+ top: 1px;
	114	+ margin-left: -10px;
	115	+ content: " ";
	116	+ border-top-width: 0;
	117	+ border-bottom-color: #fff;
	118	+}
	119	+.popover.left > .arrow {
	120	+ top: 50%;
	121	+ right: -11px;
	122	+ margin-top: -11px;
	123	+ border-right-width: 0;
	124	+ border-left-color: #999;
	125	+ border-left-color: rgba(0, 0, 0, .25);
	126	+}
	127	+.popover.left > .arrow:after {
	128	+ right: 1px;
	129	+ bottom: -10px;
	130	+ content: " ";
	131	+ border-right-width: 0;
	132	+ border-left-color: #fff;
	133	+}
	134	+
	135	+/* popover in software highlights block */
	136	+
	137	+.highlights-popover {
	138	+ max-width: 280px;
	139	+ margin: 0 0 0 -75px;
	140	+ background: #172638;
	141	+ color: #FFFFFF;
	142	+}
	143	+
	144	+.highlights-popover .popover-content {
	145	+ padding: 0;
	146	+}
	147	+
	148	+.highlights-popover p {
	149	+ padding: 13px 13px 15px;
	150	+ margin: 0px;
	151	+ font-size: 14px;
	152	+ line-height: 20px;
	153	+}
	154	+
	155	+.highlights-popover span {
	156	+ font-weight: bold;
	157	+ border-bottom: 1px dotted #FFFFFF;
	158	+}
	159	+
	160	+#content .highlights-popover a,
	161	+#content .highlights-popover a:visited,
	162	+#content .highlights-popover a:hover,
	163	+#content .highlights-popover a:link {
	164	+ font-weight: bold;
	165	+ color: #FFFFFF;
	166	+ display: block;
	167	+ padding: 8px 15px;
	168	+ border-top: 1px dotted rgba(255,255,255,0.1);
	169	+}
	170	+
	171	+.highlights-popover a:before {
	172	+ font-family: "FontAwesome";
	173	+ content: "\f067";
	174	+ vertical-align: middle;
	175	+ color: #ff0066;
	176	+ padding: 0 5px 0 0;
	177	+}
	178	+
	179	+.highlights-popover.top > .arrow,
	180	+.highlights-popover.right > .arrow,
	181	+.highlights-popover.bottom > .arrow,
	182	+.highlights-popover.left > .arrow {
	183	+ margin-left: 64px;
	184	+}
	185	+
	186	+.highlights-popover.top > .arrow:after,
	187	+.highlights-popover.right > .arrow:after,
	188	+.highlights-popover.bottom > .arrow:after,
	189	+.highlights-popover.left > .arrow:after {
	190	+ border-top-color: #172638;
	191	+}
...	...
...	...	@@ -50,7 +50,7 @@
50	50	}
51	51
52	52	#content .download-block .download-list li {
53		- padding: 30px 10px 30px 10px;
	53	+ padding: 30px 10px 25px 10px;
54	54	border-top: 1px solid #D3D6DE;
55	55	clear: both;
56	56	}
...	...	@@ -104,7 +104,7 @@
104	104	font-size: 12px;
105	105	}
106	106
107		-#content .download-block .download-info .req_min_spb a {
	107	+#content .download-block .download-info .min-requirements a {
108	108	line-height: 40px;
109	109	color: #3E67B1;
110	110	text-decoration: underline;
...	...	@@ -180,7 +180,6 @@
180	180	}
181	181
182	182	#content .box-1 .categories-and-tags-block .block-title {
183		- display: inline-flex;
184	183	margin: 13px 10px 10px 0;
185	184	padding: 3px 0px;
186	185	background: none;
...	...	@@ -188,16 +187,18 @@
188	187	font-family: Arial;
189	188	font-size: 12px;
190	189	font-weight: 300;
	190	+ float: left;
191	191	}
192	192
193	193	#content .box-1 .categories-and-tags-block .category_cloud {
194		- margin: 13px 10px 10px 0px;
195		- display: inline-flex;
	194	+ margin: 13px 0 10px 0;
	195	+ float: left;
	196	+ max-width: 87%;
196	197	}
197	198
198	199	#content .box-1 .categories-and-tags-block .category_cloud a {
199	200	padding: 3px 10px;
200		- margin: 0;
	201	+ margin: 5px;
201	202	float: left;
202	203	color: #3E67B1;
203	204	background-color: #ECEDF1;
...	...	@@ -220,22 +221,123 @@
220	221
221	222	/* Right bar */
222	223
	224	+/* WARNING - WHITOUT BOX-4 */
	225	+
	226	+/* Link-list block */
	227	+.template-default #content .box-3 .block-title {
	228	+ border-top: 4px solid #4562b1;
	229	+ line-height: 15px;
	230	+ background: #eee;
	231	+ color: #4562b1;
	232	+}
	233	+
	234	+.template-default #content .box-3 .link-list-block li {
	235	+ margin: 0px;
	236	+ padding: 0px;
	237	+ border-bottom: 1px solid #ddd;
	238	+ border-top: none;
	239	+}
	240	+
	241	+.template-default #content .box-3 .link-list-block li a {
	242	+ border-right: none;
	243	+ border-top: 0px solid #64946E;
	244	+ border-radius: 0px 0px 0px 0px;
	245	+ padding: 6px 5px 8px 18px;
	246	+ width: auto;
	247	+ line-height: 17px;
	248	+ background-color: #fff;
	249	+ background-position: 0px 50%;
	250	+ color: #2C66CE;
	251	+ font-weight: normal;
	252	+ font-size: 14px;
	253	+}
	254	+
	255	+.template-default #content .box-3 .link-list-block h3.empty + ul {
	256	+ border-top: 1px solid #ddd;
	257	+}
	258	+
	259	+.template-default #content .box-3 .link-list-block li a.link-this-page,
	260	+.template-default #content .box-3 .link-list-block li a.link-this-page:hover {
	261	+ border-right: none;
	262	+}
	263	+
	264	+.template-default #content .box-3 .link-list-block li a:hover {
	265	+ background-color: #FFFFFF;
	266	+ color: #000;
	267	+}
	268	+
	269	+.template-default #content .box-3 .link-list-block li a.link-this-page {
	270	+ margin-left: 0px;
	271	+ width: auto;
	272	+ background-color: #ffffff;
	273	+ font-weight: bold;
	274	+}
	275	+
	276	+/* Repository block */
	277	+.template-default .box-3 #bt_repositorio,
	278	+.template-default .box-3 #bt_repositorio:active,
	279	+.template-default .box-3 #bt_repositorio:visited {
	280	+ border-radius: 4px;
	281	+ padding: 12px 10px;
	282	+ background: #EAEBEE;
	283	+ font: normal normal bold 12px 'open_sansbold', arial, helvetica, sans-serif;
	284	+ text-transform: uppercase;
	285	+ display: block;
	286	+ position: relative;
	287	+}
	288	+
	289	+.template-default .box-3 #bt_repositorio::after {
	290	+ margin-top: -2px;
	291	+ padding: 4px 0px 4px 2px;
	292	+ border-radius: 4px;
	293	+ width: 18px;
	294	+ right: 10px;
	295	+ line-height: 20px;
	296	+ position: absolute;
	297	+ background: #2C66CE;
	298	+ color: #FFF;
	299	+ font-size: 16px;
	300	+ text-align: center;
	301	+ content: url('../images/right-arrow.png');
	302	+}
	303	+
	304	+.template-default .box-3 #content #bt_repositorio:hover {
	305	+ color: #FFF;
	306	+ background: #2C66CE;
	307	+ text-decoration: none;
	308	+}
	309	+/* END - WARNING - WHITOUT BOX-4 */
	310	+
	311	+/* end of right bar */
	312	+
	313	+/********** DUPLICATE **********/
	314	+
	315	+/*
	316	+ This part of the code is duplicated because, if there is
	317	+ a change of layout from template-default to lefttopright
	318	+ the CSS fit without many complication.
	319	+ */
	320	+
	321	+/* Right bar */
	322	+
	323	+/* WARNING - WITH BOX-4 */
	324	+
223	325	/* Link-list block */
224		-#content .box-3 .block-title {
	326	+.template-lefttopright #content .box-2 .block-title {
225	327	border-top: 4px solid #4562b1;
226	328	line-height: 15px;
227	329	background: #eee;
228	330	color: #4562b1;
229	331	}
230	332
231		-#content .box-3 .link-list-block li {
	333	+.template-lefttopright #content .box-2 .link-list-block li {
232	334	margin: 0px;
233	335	padding: 0px;
234	336	border-bottom: 1px solid #ddd;
235	337	border-top: none;
236	338	}
237	339
238		-#content .box-3 .link-list-block li a {
	340	+.template-lefttopright #content .box-2 .link-list-block li a {
239	341	border-right: none;
240	342	border-top: 0px solid #64946E;
241	343	border-radius: 0px 0px 0px 0px;
...	...	@@ -249,21 +351,21 @@
249	351	font-size: 14px;
250	352	}
251	353
252		-#content .box-3 .link-list-block h3.empty + ul {
	354	+.template-lefttopright #content .box-2 .link-list-block h3.empty + ul {
253	355	border-top: 1px solid #ddd;
254	356	}
255	357
256		-#content .box-3 .link-list-block li a.link-this-page,
257		-#content .box-3 .link-list-block li a.link-this-page:hover {
	358	+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page,
	359	+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page:hover {
258	360	border-right: none;
259	361	}
260	362
261		-#content .box-3 .link-list-block li a:hover {
	363	+.template-lefttopright #content .box-2 .link-list-block li a:hover {
262	364	background-color: #FFFFFF;
263	365	color: #000;
264	366	}
265	367
266		-#content .box-3 .link-list-block li a.link-this-page {
	368	+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page {
267	369	margin-left: 0px;
268	370	width: auto;
269	371	background-color: #ffffff;
...	...	@@ -271,9 +373,9 @@
271	373	}
272	374
273	375	/* Repository block */
274		-.box-3 #bt_repositorio,
275		-.box-3 #bt_repositorio:active,
276		-.box-3 #bt_repositorio:visited {
	376	+.template-lefttopright .box-2 #bt_repositorio,
	377	+.template-lefttopright .box-2 #bt_repositorio:active,
	378	+.template-lefttopright .box-2 #bt_repositorio:visited {
277	379	border-radius: 4px;
278	380	padding: 12px 10px;
279	381	background: #EAEBEE;
...	...	@@ -283,7 +385,7 @@
283	385	position: relative;
284	386	}
285	387
286		-.box-3 #bt_repositorio::after {
	388	+.template-lefttopright .box-2 #bt_repositorio::after {
287	389	margin-top: -2px;
288	390	padding: 4px 0px 4px 2px;
289	391	border-radius: 4px;
...	...	@@ -298,13 +400,19 @@
298	400	content: url('../images/right-arrow.png');
299	401	}
300	402
301		-.box-3 #content #bt_repositorio:hover {
	403	+.template-lefttopright .box-2 #content #bt_repositorio:hover {
302	404	color: #FFF;
303	405	background: #2C66CE;
304	406	text-decoration: none;
305	407	}
	408	+
	409	+/* WARNING - WITH BOX-4 */
	410	+
306	411	/* end of right bar */
307	412
	413	+/********** END DUPLICATE **********/
	414	+
	415	+
308	416	/* Software internal pages */
309	417
310	418	/* FAQ page */
...	...
...	...	@@ -120,4 +120,4 @@
120	120
121	121	<!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->
122	122	<script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript> <!-- item para fins de acessibilidade --></noscript>
123		-
	123	+ <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
...	...
...	...	@@ -19,11 +19,11 @@
19	19	@import url(css/article-page.css);
20	20	@import url(css/software-pages.css);
21	21	@import url(css/community-pages.css);
22		-@import url(css/use-report.css);
23	22	@import url(css/news-page.css);
24	23	@import url(css/search-pages.css);
25	24	@import url(css/software-catalog-page.css);
26	25	@import url(css/tooltip.css);
	26	+@import url(css/popover.css);
27	27
28	28	@font-face{
29	29	font-weight: normal;
...	...
...	...	@@ -250,11 +250,31 @@ $('#link-buscar').click(function(e) {
250	250	});
251	251	}
252	252
253		- $(document).ready(function(){
	253	+ function add_popovers() {
	254	+ var span = $('span[data-toggle="popover"]');
	255	+ var place = span.attr("data-placement");
	256	+ var elementClass = span.attr("data-class");
	257	+ var popover = span.popover({
	258	+ html:true,
	259	+ placement: place,
	260	+ content: function() {
	261	+ return $(this).next().html();
	262	+ }
	263	+ })
	264	+ .data('bs.popover');
	265	+ if(popover) {
	266	+ popover.tip()
	267	+ .addClass(elementClass);
	268	+ $('a.toggle-popover').on("click",function() {
	269	+ span.trigger("click");
	270	+ });
	271	+ }
	272	+ }
254	273
	274	+ $(document).ready(function(){
	275	+ add_popovers();
255	276	add_top_tooltips();
256	277	move_article_buttons();
257		- add_link_to_article_div();
258	278	insert_notice_div();
259	279	set_uploaded_files_names();
260	280	set_tooltip_content();
...	...	@@ -263,4 +283,3 @@ $('#link-buscar').click(function(e) {
263	283	setEvents();
264	284	});
265	285	})(jQuery);
266		-
...	...