Download as
Browse Code »

Commit 4acc4a2395576da2085e23dd2ff74feeccba3267

Authored by Álvaro Fernando Matos de Souza
1 parent b3c92cdd

Fixing box-2 and box-3 to work with box-4 

Adding this calls to the rules:
	.template-leftbar
	.template-lefttopright

Signed-off-by: Álvaro Fernando <alvarofernandoms@gmail.com>
Signed-off-by: TomazMartins <tomaz.r.martins@gmail.com>
Showing 2 changed files with 211 additions and 23 deletions   Show diff stats
css/left-bar.css
  Diff comments   View file @4acc4a2
1 /******************** Box-2 ********************/ 1 /******************** Box-2 ********************/
2 2
3 -.box-2{ 3 +/*** WARNING - WITHOUT BOX-4 ***/
  4 +
  5 +.template-leftbar .box-2 {
4 width:150px; 6 width:150px;
5 } 7 }
6 8
7 -#content .box-2 .block-outer .block-title { 9 +.template-leftbar #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-leftbar #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-leftbar #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-leftbar #content .box-2 .link-list-block h3.empty + ul {
  40 + border-top: 1px solid #ddd;
  41 +}
  42 +
  43 +.template-leftbar #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-leftbar #content .box-2 .link-list-block li a.link-this-page,
  50 +.template-leftbar #content .box-2 .link-list-block li a.link-this-page:hover {
  51 + border-right: none;
  52 +}
  53 +
  54 +.template-leftbar #content .box-2 .link-list-block li a:hover {
  55 + background-color: #FFFFFF;
  56 + color: #000;
  57 +}
  58 +.template-leftbar #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-leftbar 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,32 +108,36 @@ @@ -34,32 +108,36 @@
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 **/
64 .statistics-block-data ul { 142 .statistics-block-data ul {
65 margin-top: 10px; 143 margin-top: 10px;
@@ -83,6 +161,9 @@ span.amount { @@ -83,6 +161,9 @@ span.amount {
83 span.label { 161 span.label {
84 font-size: 14px; 162 font-size: 14px;
85 } 163 }
  164 +
86 /*** end of statistics block **/ 165 /*** end of statistics block **/
87 166
  167 +/*** WARNING - WITH BOX-4 ***/
  168 +
88 /******************** end Box-2 ********************/ 169 /******************** end Box-2 ********************/
css/software-pages.css
  Diff comments   View file @4acc4a2
@@ -220,22 +220,24 @@ @@ -220,22 +220,24 @@
220 220
221 /*** Right bar ***/ 221 /*** Right bar ***/
222 222
  223 +/*** WARNING - WHITOUT BOX-4 ***/
  224 +
223 /* Link-list block */ 225 /* Link-list block */
224 -#content .box-3 .block-title { 226 +.template-leftbar #content .box-3 .block-title {
225 border-top: 4px solid #4562b1; 227 border-top: 4px solid #4562b1;
226 line-height: 15px; 228 line-height: 15px;
227 background: #eee; 229 background: #eee;
228 color: #4562b1; 230 color: #4562b1;
229 } 231 }
230 232
231 -#content .box-3 .link-list-block li { 233 +.template-leftbar #content .box-3 .link-list-block li {
232 margin: 0px; 234 margin: 0px;
233 padding: 0px; 235 padding: 0px;
234 border-bottom: 1px solid #ddd; 236 border-bottom: 1px solid #ddd;
235 border-top: none; 237 border-top: none;
236 } 238 }
237 239
238 -#content .box-3 .link-list-block li a { 240 +.template-leftbar #content .box-3 .link-list-block li a {
239 border-right: none; 241 border-right: none;
240 border-top: 0px solid #64946E; 242 border-top: 0px solid #64946E;
241 border-radius: 0px 0px 0px 0px; 243 border-radius: 0px 0px 0px 0px;
@@ -249,21 +251,21 @@ @@ -249,21 +251,21 @@
249 font-size: 14px; 251 font-size: 14px;
250 } 252 }
251 253
252 -#content .box-3 .link-list-block h3.empty + ul { 254 +.template-leftbar #content .box-3 .link-list-block h3.empty + ul {
253 border-top: 1px solid #ddd; 255 border-top: 1px solid #ddd;
254 } 256 }
255 257
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 { 258 +.template-leftbar #content .box-3 .link-list-block li a.link-this-page,
  259 +.template-leftbar #content .box-3 .link-list-block li a.link-this-page:hover {
258 border-right: none; 260 border-right: none;
259 } 261 }
260 262
261 -#content .box-3 .link-list-block li a:hover { 263 +.template-leftbar #content .box-3 .link-list-block li a:hover {
262 background-color: #FFFFFF; 264 background-color: #FFFFFF;
263 color: #000; 265 color: #000;
264 } 266 }
265 267
266 -#content .box-3 .link-list-block li a.link-this-page { 268 +.template-leftbar #content .box-3 .link-list-block li a.link-this-page {
267 margin-left: 0px; 269 margin-left: 0px;
268 width: auto; 270 width: auto;
269 background-color: #ffffff; 271 background-color: #ffffff;
@@ -271,9 +273,9 @@ @@ -271,9 +273,9 @@
271 } 273 }
272 274
273 /* Repository block */ 275 /* Repository block */
274 -.box-3 #bt_repositorio,  
275 -.box-3 #bt_repositorio:active,  
276 -.box-3 #bt_repositorio:visited { 276 +.template-leftbar .box-3 #bt_repositorio,
  277 +.template-leftbar .box-3 #bt_repositorio:active,
  278 +.template-leftbar .box-3 #bt_repositorio:visited {
277 border-radius: 4px; 279 border-radius: 4px;
278 padding: 12px 10px; 280 padding: 12px 10px;
279 background: #EAEBEE; 281 background: #EAEBEE;
@@ -283,7 +285,7 @@ @@ -283,7 +285,7 @@
283 position: relative; 285 position: relative;
284 } 286 }
285 287
286 -.box-3 #bt_repositorio::after { 288 +.template-leftbar .box-3 #bt_repositorio::after {
287 margin-top: -2px; 289 margin-top: -2px;
288 padding: 4px 0px 4px 2px; 290 padding: 4px 0px 4px 2px;
289 border-radius: 4px; 291 border-radius: 4px;
@@ -298,13 +300,118 @@ @@ -298,13 +300,118 @@
298 content: url('../images/right-arrow.png'); 300 content: url('../images/right-arrow.png');
299 } 301 }
300 302
301 -.box-3 #content #bt_repositorio:hover { 303 +.template-leftbar .box-3 #content #bt_repositorio:hover {
302 color: #FFF; 304 color: #FFF;
303 background: #2C66CE; 305 background: #2C66CE;
304 text-decoration: none; 306 text-decoration: none;
305 } 307 }
  308 +/*** END - WARNING - WHITOUT BOX-4 ***/
  309 +
306 /*** end of right bar ***/ 310 /*** end of right bar ***/
307 311
  312 +/************ DUPLICATE ************/
  313 +
  314 +/*
  315 + This part of the code is duplicated because, if there is
  316 + a change of layout from template-leftbar to lefttopright
  317 + the CSS fit without many complication.
  318 + */
  319 +
  320 +/*** Right bar ***/
  321 +
  322 +/*** WARNING - WITH BOX-4 ***/
  323 +
  324 +/* Link-list block */
  325 +.template-lefttopright #content .box-2 .block-title {
  326 + border-top: 4px solid #4562b1;
  327 + line-height: 15px;
  328 + background: #eee;
  329 + color: #4562b1;
  330 +}
  331 +
  332 +.template-lefttopright #content .box-2 .link-list-block li {
  333 + margin: 0px;
  334 + padding: 0px;
  335 + border-bottom: 1px solid #ddd;
  336 + border-top: none;
  337 +}
  338 +
  339 +.template-lefttopright #content .box-2 .link-list-block li a {
  340 + border-right: none;
  341 + border-top: 0px solid #64946E;
  342 + border-radius: 0px 0px 0px 0px;
  343 + padding: 6px 5px 8px 18px;
  344 + width: auto;
  345 + line-height: 17px;
  346 + background-color: #fff;
  347 + background-position: 0px 50%;
  348 + color: #2C66CE;
  349 + font-weight: normal;
  350 + font-size: 14px;
  351 +}
  352 +
  353 +.template-lefttopright #content .box-2 .link-list-block h3.empty + ul {
  354 + border-top: 1px solid #ddd;
  355 +}
  356 +
  357 +.template-lefttopright #content .box-2 .link-list-block li a.link-this-page,
  358 +.template-lefttopright #content .box-2 .link-list-block li a.link-this-page:hover {
  359 + border-right: none;
  360 +}
  361 +
  362 +.template-lefttopright #content .box-2 .link-list-block li a:hover {
  363 + background-color: #FFFFFF;
  364 + color: #000;
  365 +}
  366 +
  367 +.template-lefttopright #content .box-2 .link-list-block li a.link-this-page {
  368 + margin-left: 0px;
  369 + width: auto;
  370 + background-color: #ffffff;
  371 + font-weight: bold;
  372 +}
  373 +
  374 +/* Repository block */
  375 +.template-lefttopright .box-2 #bt_repositorio,
  376 +.template-lefttopright .box-2 #bt_repositorio:active,
  377 +.template-lefttopright .box-2 #bt_repositorio:visited {
  378 + border-radius: 4px;
  379 + padding: 12px 10px;
  380 + background: #EAEBEE;
  381 + font: normal normal bold 12px 'open_sansbold', arial, helvetica, sans-serif;
  382 + text-transform: uppercase;
  383 + display: block;
  384 + position: relative;
  385 +}
  386 +
  387 +.template-lefttopright .box-2 #bt_repositorio::after {
  388 + margin-top: -2px;
  389 + padding: 4px 0px 4px 2px;
  390 + border-radius: 4px;
  391 + width: 18px;
  392 + right: 10px;
  393 + line-height: 20px;
  394 + position: absolute;
  395 + background: #2C66CE;
  396 + color: #FFF;
  397 + font-size: 16px;
  398 + text-align: center;
  399 + content: url('../images/right-arrow.png');
  400 +}
  401 +
  402 +.template-lefttopright .box-2 #content #bt_repositorio:hover {
  403 + color: #FFF;
  404 + background: #2C66CE;
  405 + text-decoration: none;
  406 +}
  407 +
  408 +/*** WARNING - WITH BOX-4 ***/
  409 +
  410 +/*** end of right bar ***/
  411 +
  412 +/************ END DUPLICATE ************/
  413 +
  414 +
308 /*** Software internal pages ***/ 415 /*** Software internal pages ***/
309 416
310 /* FAQ page */ 417 /* FAQ page */