Download as
Browse Code »

Commit ca4f434de5b1d2851b8f75b00dd8ee676b37723f

Authored by Melissa Wen
2 parents 28b11109 47d99aeb
Exists in master and in 9 other branches bootstrap_modal, bug_fix_40, code_block, design_41_backup, event_block, master_with_pkg_fixes, pkg_fixes, r4, r5_design

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

…spb-theme into restructuring_css
Showing 8 changed files with 480 additions and 64 deletions   Show diff stats
css/home-page.css
  Diff comments   View file @ca4f434
@@ -148,7 +148,7 @@ @@ -148,7 +148,7 @@
148 display:none; 148 display:none;
149 } 149 }
150 150
151 -.action-home-index #content .software-block { 151 +.action-home-index #content .software-block {
152 width: 145px; 152 width: 145px;
153 height: 218px; 153 height: 218px;
154 margin: 0px 18px 14px 0px; 154 margin: 0px 18px 14px 0px;
@@ -236,7 +236,7 @@ @@ -236,7 +236,7 @@
236 /*** News block - display content block **/ 236 /*** News block - display content block **/
237 237
238 .action-home-index #content .display-content-block .block-title { 238 .action-home-index #content .display-content-block .block-title {
239 - margin: 0px; 239 + margin: 0px;
240 border-top: 4px solid #643C67; 240 border-top: 4px solid #643C67;
241 background: #eee; 241 background: #eee;
242 color: #643C67; 242 color: #643C67;
@@ -293,7 +293,7 @@ @@ -293,7 +293,7 @@
293 } 293 }
294 294
295 .action-home-index #content .display-content-block .lead { 295 .action-home-index #content .display-content-block .lead {
296 - max-height: 56px; 296 + max-height: 47px;
297 overflow: hidden; 297 overflow: hidden;
298 } 298 }
299 299
@@ -302,8 +302,8 @@ @@ -302,8 +302,8 @@
302 font: 15px/1.3em arial; 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 .action-home-index #content .lead dl.portlet a:visited { 307 .action-home-index #content .lead dl.portlet a:visited {
308 color: #172738; 308 color: #172738;
309 } 309 }
@@ -331,7 +331,7 @@ @@ -331,7 +331,7 @@
331 331
332 /*** What Is block - Article block **/ 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 border-top: 4px solid #08A649; 335 border-top: 4px solid #08A649;
336 border-bottom: none; 336 border-bottom: none;
337 padding: 6px 8px 22px 10px; 337 padding: 6px 8px 22px 10px;
@@ -342,20 +342,20 @@ @@ -342,20 +342,20 @@
342 text-transform: none; 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 margin-top: 30px; 346 margin-top: 30px;
347 border-top: 1px solid #08A649; 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 background: #08A649; 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 padding-top: 23px; 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 margin: 0px 0px 14px 0px; 359 margin: 0px 0px 14px 0px;
360 padding: 0px; 360 padding: 0px;
361 font: 15px/18px arial, helvetica, sans-serif; 361 font: 15px/18px arial, helvetica, sans-serif;
@@ -371,7 +371,7 @@ @@ -371,7 +371,7 @@
371 371
372 .action-home-index #content .highlights-border { 372 .action-home-index #content .highlights-border {
373 border: 1px solid #c0c1c1; 373 border: 1px solid #c0c1c1;
374 - border-radius: 8px 8px 8px 8px; 374 + border-radius: 8px;
375 width: auto; 375 width: auto;
376 height: 248px; 376 height: 248px;
377 max-height: 250px; 377 max-height: 250px;
@@ -384,15 +384,15 @@ @@ -384,15 +384,15 @@
384 } 384 }
385 385
386 .action-home-index #content .highlights-container { 386 .action-home-index #content .highlights-container {
387 - border-radius: 8px 8px 8px 8px; 387 + border-radius: 8px;
388 border-width: 0px 0px 1px 0px; 388 border-width: 0px 0px 1px 0px;
389 border-bottom: none; 389 border-bottom: none;
390 - padding: 0px 0px 0px 0px; 390 + padding: 0;
391 width: 100% !important; 391 width: 100% !important;
392 max-height: 230px; 392 max-height: 230px;
393 background: transparent; 393 background: transparent;
394 position: relative; 394 position: relative;
395 - top: 0px; 395 + top: 0;
396 } 396 }
397 397
398 .action-home-index #content .highlights-image-link { 398 .action-home-index #content .highlights-image-link {
@@ -422,11 +422,9 @@ @@ -422,11 +422,9 @@
422 } 422 }
423 423
424 .action-home-index #content .highlights-block-pager { 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 .action-home-index #content .highlights-block-pager a { 430 .action-home-index #content .highlights-block-pager a {
@@ -448,6 +446,24 @@ @@ -448,6 +446,24 @@
448 color: transparent; 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 /*** mais software block **/ 467 /*** mais software block **/
452 .action-home-index #content #mais-software-block { 468 .action-home-index #content #mais-software-block {
453 margin: 11px 0px; 469 margin: 11px 0px;
css/left-bar.css
  Diff comments   View file @ca4f434
1 /******************** Box-2 ********************/ 1 /******************** Box-2 ********************/
2 2
3 -.box-2{ 3 +/*** WARNING - WITHOUT BOX-4 ***/
  4 +
  5 +.template-default .box-2 {
4 width:150px; 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 background: #eee; 10 background: #eee;
9 color: #4562b1; 11 color: #4562b1;
10 border-top: 4px solid #4562b1; 12 border-top: 4px solid #4562b1;
@@ -13,14 +15,86 @@ @@ -13,14 +15,86 @@
13 15
14 /*** Menus - Link list block ***/ 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 margin: 0; 91 margin: 0;
18 padding: 0; 92 padding: 0;
19 border-bottom: 1px solid #ddd; 93 border-bottom: 1px solid #ddd;
20 border-top: none; 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 width: auto; 98 width: auto;
25 padding: 6px 5px 8px 18px; 99 padding: 6px 5px 8px 18px;
26 background-color: #fff; 100 background-color: #fff;
@@ -34,33 +108,41 @@ @@ -34,33 +108,41 @@
34 line-height: 17px; 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 border-top: 1px solid #ddd; 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 padding-left: 0px; 116 padding-left: 0px;
43 padding-right: 0px; 117 padding-right: 0px;
44 background-image: none; 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 border-right: none; 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 background-color: #FFFFFF; 127 background-color: #FFFFFF;
54 color: #000; 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 width: auto; 131 width: auto;
58 margin-left: 0px; 132 margin-left: 0px;
59 background-color: #ffffff; 133 background-color: #ffffff;
60 font-weight: bold; 134 font-weight: bold;
61 } 135 }
62 136
  137 +/************ END OF DUPLICATE ************
  138 +
  139 +/*** END OF WARNING - WITH BOX-4 ***/
  140 +
63 /*** Statistics block **/ 141 /*** Statistics block **/
  142 +.template-default #content .box-2 .statistics-block {
  143 + padding: 10px 0px 10px 10px
  144 +}
  145 +
64 .statistics-block-data ul { 146 .statistics-block-data ul {
65 margin-top: 10px; 147 margin-top: 10px;
66 } 148 }
@@ -83,6 +165,9 @@ span.amount { @@ -83,6 +165,9 @@ span.amount {
83 span.label { 165 span.label {
84 font-size: 14px; 166 font-size: 14px;
85 } 167 }
  168 +
86 /*** end of statistics block **/ 169 /*** end of statistics block **/
87 170
  171 +/*** WARNING - WITH BOX-4 ***/
  172 +
88 /******************** end Box-2 ********************/ 173 /******************** end Box-2 ********************/
css/news-page.css
  Diff comments   View file @ca4f434
@@ -2,18 +2,15 @@ @@ -2,18 +2,15 @@
2 2
3 /** Header's Block **/ 3 /** Header's Block **/
4 #content .blog #article-header h1.title { 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 /* WARNING: 10 /* WARNING:
14 * This solution is TEMPORARY. This informations shouldn't exist 11 * This solution is TEMPORARY. This informations shouldn't exist
15 * in this area. 12 * in this area.
16 - * 13 + *
17 * TODO: Remove this informations of the html and, then, from here. 14 * TODO: Remove this informations of the html and, then, from here.
18 */ 15 */
19 #content .blog #article-header .publishing-info .date, 16 #content .blog #article-header .publishing-info .date,
@@ -63,7 +60,7 @@ @@ -63,7 +60,7 @@
63 /* WARNING: 60 /* WARNING:
64 * This solution is TEMPORARY. This informations shouldn't exist 61 * This solution is TEMPORARY. This informations shouldn't exist
65 * in this area. 62 * in this area.
66 - * 63 + *
67 * TODO: Remove this informations of the html and, then, from here. 64 * TODO: Remove this informations of the html and, then, from here.
68 */ 65 */
69 #content .blog .blog-post .author { 66 #content .blog .blog-post .author {
@@ -100,7 +97,7 @@ @@ -100,7 +97,7 @@
100 /* WARNING: 97 /* WARNING:
101 * This solution is TEMPORARY. This informations shouldn't exist 98 * This solution is TEMPORARY. This informations shouldn't exist
102 * in this area. 99 * in this area.
103 - * 100 + *
104 * TODO: Remove this informations of the html and, then, from here. 101 * TODO: Remove this informations of the html and, then, from here.
105 * The correct is the text is sensitive to lead to the complete text. 102 * The correct is the text is sensitive to lead to the complete text.
106 */ 103 */
@@ -142,9 +139,9 @@ @@ -142,9 +139,9 @@
142 #content .blog .page-1 .position-3, 139 #content .blog .page-1 .position-3,
143 #content .blog .page-1 .position-4 { 140 #content .blog .page-1 .position-4 {
144 margin: 0px 0px 0px 0px; 141 margin: 0px 0px 0px 0px;
145 - padding: 20px 30px 45px 0px; 142 + padding: 20px 21px 45px 0px;
146 height: 235px; 143 height: 235px;
147 - width: 30.5%; 144 + width: 30.5%;
148 display: block; 145 display: block;
149 float: left; 146 float: left;
150 } 147 }
css/popover.css 0 → 100644
  Diff comments   View file @ca4f434
@@ -0,0 +1,191 @@ @@ -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 +}
css/software-pages.css
  Diff comments   View file @ca4f434
@@ -50,7 +50,7 @@ @@ -50,7 +50,7 @@
50 } 50 }
51 51
52 #content .download-block .download-list li { 52 #content .download-block .download-list li {
53 - padding: 30px 10px 30px 10px; 53 + padding: 30px 10px 25px 10px;
54 border-top: 1px solid #D3D6DE; 54 border-top: 1px solid #D3D6DE;
55 clear: both; 55 clear: both;
56 } 56 }
@@ -104,7 +104,7 @@ @@ -104,7 +104,7 @@
104 font-size: 12px; 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 line-height: 40px; 108 line-height: 40px;
109 color: #3E67B1; 109 color: #3E67B1;
110 text-decoration: underline; 110 text-decoration: underline;
@@ -180,7 +180,6 @@ @@ -180,7 +180,6 @@
180 } 180 }
181 181
182 #content .box-1 .categories-and-tags-block .block-title { 182 #content .box-1 .categories-and-tags-block .block-title {
183 - display: inline-flex;  
184 margin: 13px 10px 10px 0; 183 margin: 13px 10px 10px 0;
185 padding: 3px 0px; 184 padding: 3px 0px;
186 background: none; 185 background: none;
@@ -188,16 +187,18 @@ @@ -188,16 +187,18 @@
188 font-family: Arial; 187 font-family: Arial;
189 font-size: 12px; 188 font-size: 12px;
190 font-weight: 300; 189 font-weight: 300;
  190 + float: left;
191 } 191 }
192 192
193 #content .box-1 .categories-and-tags-block .category_cloud { 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 #content .box-1 .categories-and-tags-block .category_cloud a { 199 #content .box-1 .categories-and-tags-block .category_cloud a {
199 padding: 3px 10px; 200 padding: 3px 10px;
200 - margin: 0; 201 + margin: 5px;
201 float: left; 202 float: left;
202 color: #3E67B1; 203 color: #3E67B1;
203 background-color: #ECEDF1; 204 background-color: #ECEDF1;
@@ -220,22 +221,123 @@ @@ -220,22 +221,123 @@
220 221
221 /*** Right bar ***/ 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 /* Link-list block */ 325 /* Link-list block */
224 -#content .box-3 .block-title { 326 +.template-lefttopright #content .box-2 .block-title {
225 border-top: 4px solid #4562b1; 327 border-top: 4px solid #4562b1;
226 line-height: 15px; 328 line-height: 15px;
227 background: #eee; 329 background: #eee;
228 color: #4562b1; 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 margin: 0px; 334 margin: 0px;
233 padding: 0px; 335 padding: 0px;
234 border-bottom: 1px solid #ddd; 336 border-bottom: 1px solid #ddd;
235 border-top: none; 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 border-right: none; 341 border-right: none;
240 border-top: 0px solid #64946E; 342 border-top: 0px solid #64946E;
241 border-radius: 0px 0px 0px 0px; 343 border-radius: 0px 0px 0px 0px;
@@ -249,21 +351,21 @@ @@ -249,21 +351,21 @@
249 font-size: 14px; 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 border-top: 1px solid #ddd; 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 border-right: none; 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 background-color: #FFFFFF; 364 background-color: #FFFFFF;
263 color: #000; 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 margin-left: 0px; 369 margin-left: 0px;
268 width: auto; 370 width: auto;
269 background-color: #ffffff; 371 background-color: #ffffff;
@@ -271,9 +373,9 @@ @@ -271,9 +373,9 @@
271 } 373 }
272 374
273 /* Repository block */ 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 border-radius: 4px; 379 border-radius: 4px;
278 padding: 12px 10px; 380 padding: 12px 10px;
279 background: #EAEBEE; 381 background: #EAEBEE;
@@ -283,7 +385,7 @@ @@ -283,7 +385,7 @@
283 position: relative; 385 position: relative;
284 } 386 }
285 387
286 -.box-3 #bt_repositorio::after { 388 +.template-lefttopright .box-2 #bt_repositorio::after {
287 margin-top: -2px; 389 margin-top: -2px;
288 padding: 4px 0px 4px 2px; 390 padding: 4px 0px 4px 2px;
289 border-radius: 4px; 391 border-radius: 4px;
@@ -298,13 +400,19 @@ @@ -298,13 +400,19 @@
298 content: url('../images/right-arrow.png'); 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 color: #FFF; 404 color: #FFF;
303 background: #2C66CE; 405 background: #2C66CE;
304 text-decoration: none; 406 text-decoration: none;
305 } 407 }
  408 +
  409 +/*** WARNING - WITH BOX-4 ***/
  410 +
306 /*** end of right bar ***/ 411 /*** end of right bar ***/
307 412
  413 +/************ END DUPLICATE ************/
  414 +
  415 +
308 /*** Software internal pages ***/ 416 /*** Software internal pages ***/
309 417
310 /* FAQ page */ 418 /* FAQ page */
footer.html.erb
  Diff comments   View file @ca4f434
@@ -120,4 +120,4 @@ @@ -120,4 +120,4 @@
120 120
121 <!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal --> 121 <!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->
122 <script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript>&nbsp;<!-- item para fins de acessibilidade --></noscript> 122 <script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript>&nbsp;<!-- 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,11 +19,11 @@
19 @import url(css/article-page.css); 19 @import url(css/article-page.css);
20 @import url(css/software-pages.css); 20 @import url(css/software-pages.css);
21 @import url(css/community-pages.css); 21 @import url(css/community-pages.css);
22 -@import url(css/use-report.css);  
23 @import url(css/news-page.css); 22 @import url(css/news-page.css);
24 @import url(css/search-pages.css); 23 @import url(css/search-pages.css);
25 @import url(css/software-catalog-page.css); 24 @import url(css/software-catalog-page.css);
26 @import url(css/tooltip.css); 25 @import url(css/tooltip.css);
  26 +@import url(css/popover.css);
27 27
28 @font-face{ 28 @font-face{
29 font-weight: normal; 29 font-weight: normal;
@@ -250,11 +250,31 @@ $(&#39;#link-buscar&#39;).click(function(e) { @@ -250,11 +250,31 @@ $(&#39;#link-buscar&#39;).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 add_top_tooltips(); 276 add_top_tooltips();
256 move_article_buttons(); 277 move_article_buttons();
257 - add_link_to_article_div();  
258 insert_notice_div(); 278 insert_notice_div();
259 set_uploaded_files_names(); 279 set_uploaded_files_names();
260 set_tooltip_content(); 280 set_tooltip_content();
@@ -263,4 +283,3 @@ $(&#39;#link-buscar&#39;).click(function(e) { @@ -263,4 +283,3 @@ $(&#39;#link-buscar&#39;).click(function(e) {
263 setEvents(); 283 setEvents();
264 }); 284 });
265 })(jQuery); 285 })(jQuery);
266 -