Revision 3eef2922

b/cloudcms/static/cloudcms/css/styles.css
460 460
a.button:hover {
461 461
  color: #fff !important;
462 462
}
463
/*
464
    ColorBox Core Style:
465
    The following CSS is consistent between example themes and should not be altered.
466
*/
467
#colorbox, #cboxOverlay, #cboxWrapper {
468
  position: absolute;
469
  top: 0;
470
  left: 0;
471
  z-index: 9999;
472
  overflow: hidden;
473
}
474
#cboxOverlay {
475
  position: fixed;
476
  width: 100%;
477
  height: 100%;
478
}
479
#cboxMiddleLeft, #cboxBottomLeft {
480
  clear: left;
481
}
482
#cboxContent {
483
  position: relative;
484
}
485
#cboxLoadedContent {
486
  overflow: auto;
487
}
488
#cboxTitle {
489
  margin: 0;
490
}
491
#cboxLoadingOverlay, #cboxLoadingGraphic {
492
  position: absolute;
493
  top: 0;
494
  left: 0;
495
  width: 100%;
496
  height: 100%;
497
}
498
#cboxPrevious,
499
#cboxNext,
500
#cboxClose,
501
#cboxSlideshow {
502
  cursor: pointer;
503
}
504
.cboxPhoto {
505
  float: left;
506
  margin: auto;
507
  border: 0;
508
  display: block;
509
}
510
.cboxIframe {
511
  width: 100%;
512
  height: 100%;
513
  display: block;
514
  border: 0;
515
}
516
/* 
517
    User Style:
518
    Change the following styles to modify the appearance of ColorBox.  They are
519
    ordered & tabbed in a way that represents the nesting of the generated HTML.
520
*/
521
#cboxOverlay {
522
  background: #000;
523
}
524
#cboxContent {
525
  margin-top: 20px;
526
}
527
.cboxIframe {
528
  background: #fff;
529
}
530
#cboxError {
531
  padding: 50px;
532
  border: 1px solid #ccc;
533
}
534
#cboxLoadedContent {
535
  border: 5px solid #000;
536
  background: #fff;
537
}
538
#cboxTitle {
539
  position: absolute;
540
  top: -20px;
541
  left: 0;
542
  color: #ccc;
543
}
544
#cboxCurrent {
545
  position: absolute;
546
  top: -20px;
547
  right: 0px;
548
  color: #ccc;
549
}
550
#cboxSlideshow {
551
  position: absolute;
552
  top: -20px;
553
  right: 90px;
554
  color: #fff;
555
}
556
#cboxPrevious {
557
  position: absolute;
558
  top: 50%;
559
  left: 5px;
560
  margin-top: -32px;
561
  background: url(../images/colorbox/controls.png) no-repeat top left;
562
  width: 28px;
563
  height: 65px;
564
  text-indent: -9999px;
565
}
566
#cboxPrevious:hover {
567
  background-position: bottom left;
568
}
569
#cboxNext {
570
  position: absolute;
571
  top: 50%;
572
  right: 5px;
573
  margin-top: -32px;
574
  background: url(../images/colorbox/controls.png) no-repeat top right;
575
  width: 28px;
576
  height: 65px;
577
  text-indent: -9999px;
578
}
579
#cboxNext:hover {
580
  background-position: bottom right;
581
}
582
#cboxLoadingOverlay {
583
  background: #000;
584
}
585
#cboxLoadingGraphic {
586
  background: url(../images/colorbox/loading.gif) no-repeat center center;
587
}
588
#cboxClose {
589
  position: absolute;
590
  top: 5px;
591
  right: 5px;
592
  display: block;
593
  background: url(../images/colorbox/controls.png) no-repeat top center;
594
  width: 38px;
595
  height: 19px;
596
  text-indent: -9999px;
597
}
598
#cboxClose:hover {
599
  background-position: bottom center;
600
}
601 463
.border-box {
602 464
  -moz-box-sizing: border-box;
603 465
  -webkit-box-sizing: border-box;
......
626 488
  font-weight: normal;
627 489
  line-height: 22px;
628 490
  letter-spacing: 1px;
491
  font-size: 12px;
629 492
}
630 493
.topbar {
631 494
  background-color: #cfcdc7;
632 495
}
633 496
.topbar .head {
634 497
  float: left;
635
  padding: 6px;
498
  padding: 2.333333333333333px;
636 499
}
637 500
.topbar .links {
638 501
  zoom: 1;
......
652 515
  display: block;
653 516
  float: left;
654 517
  margin-left: 10px;
655
  padding: 12px;
518
  padding: 8.333333333333332px;
656 519
}
657 520
.topbar .links a:hover {
658 521
  background-color: #1a1a1a;
......
737 600
}
738 601
div.header {
739 602
  position: relative;
740
  margin-top: 88px;
741
  margin-bottom: 22px;
603
  margin-top: 36.666666666666664px;
604
  margin-bottom: 14.666666666666666px;
742 605
}
743 606
div.header h1 {
744 607
  color: #cfcdc7;
......
759 622
.footer {
760 623
  border-bottom: 1px solid #808080;
761 624
  border-top: 1px solid #a6a6a6;
762
  padding-top: 22px;
763
  padding-bottom: 22px;
625
  padding-top: 14.666666666666666px;
626
  padding-bottom: 14.666666666666666px;
764 627
}
765 628
ul.inline {
766 629
  zoom: 1;
......
781 644
.mainnav.quicknav {
782 645
  position: absolute;
783 646
  right: 0;
784
  top: -57.2px;
647
  top: -38.13333333333333px;
785 648
  margin: 0;
786 649
}
787 650
.mainnav.quicknav li {
......
790 653
}
791 654
.navigation {
792 655
  height: 83px;
656
  position: absolute;
657
  right: -15px;
658
  top: -23px;
793 659
}
794 660
.mainnav {
795
  font-size: 1.2em;
661
  font-size: 1.3em;
796 662
}
797 663
.mainnav.subnav {
798
  margin-bottom: -22px;
664
  margin-bottom: -14.666666666666666px;
799 665
}
800 666
.mainnav.subnav li {
801
  margin-top: 1.2em;
667
  margin-top: 5.866666666666667px;
668
  float: right;
802 669
}
803 670
.mainnav li {
804
  margin-top: 66px;
671
  margin-top: 29.333333333333332px;
805 672
}
806 673
.mainnav li.active a {
807 674
  /*border-bottom: 1px solid @linkColor;*/
......
850 717
  margin-left: -22px;
851 718
  zoom: 1;
852 719
  margin-left: -22px;
853
  margin-top: 132px;
720
  margin-top: 73.33333333333333px;
854 721
  font-size: 1.1em;
855 722
}
856 723
div.page:before, div.page:after {
......
989 856
  background-color: #f89a1c !important;
990 857
}
991 858
.section {
992
  margin-bottom: 66px;
859
  margin-bottom: 44px;
993 860
}
994 861
.section em {
995 862
  color: #3582ac;
......
1014 881
}
1015 882
.section.positioned h3 {
1016 883
  font-size: 1.2em;
1017
  margin-bottom: 22px;
884
  margin-bottom: 14.666666666666666px;
1018 885
}
1019 886
.section.positioned .text {
1020 887
  color: #000000;
......
1072 939
  background-image: none !important;
1073 940
}
1074 941
form.login {
1075
  margin-bottom: 33px;
942
  margin-bottom: 22px;
1076 943
}
1077 944
form h2 {
1078 945
  color: #000000;
1079
  margin-bottom: 22px;
946
  margin-bottom: 14.666666666666666px;
1080 947
  font-size: 1.1em;
1081 948
}
1082 949
form h2 span {
1083 950
  padding-bottom: 3px;
1084 951
}
1085 952
form .form-row {
1086
  min-height: 44px;
953
  min-height: 29.333333333333332px;
1087 954
  position: relative;
1088 955
}
1089 956
form .form-row.submit {
1090
  margin-top: 33px;
957
  margin-top: 22px;
1091 958
}
1092 959
form .form-row .extra-link {
1093 960
  color: #808080;
......
1097 964
  margin-top: 1.3em;
1098 965
  float: right;
1099 966
}
967
form .form-row label {
968
  font-size: 1.1em;
969
}
1100 970
form.innerlabels label {
1101 971
  position: absolute;
1102
  top: 1em;
972
  top: 1.1em;
1103 973
  left: 1.5em;
1104 974
  color: #aaa;
1105 975
}
......
1209 1079
  background-image: url("../images/dashed_border.png");
1210 1080
  background-repeat: repeat-x;
1211 1081
  background-position: left bottom;
1212
  padding-bottom: 44px;
1213
  margin-bottom: 44px;
1082
  padding-bottom: 29.333333333333332px;
1083
  margin-bottom: 29.333333333333332px;
1214 1084
}
1215 1085
.section h2 {
1216 1086
  font-size: 1.1em;
1217 1087
  line-height: 1.3em;
1218
  margin-bottom: 33px;
1088
  margin-bottom: 22px;
1219 1089
}
1220 1090
.section h2 a {
1221 1091
  color: #4085A6;
......
1225 1095
.section h3 {
1226 1096
  font-size: 1.1em;
1227 1097
  line-height: 1.3em;
1228
  margin-bottom: 33px;
1098
  margin-bottom: 22px;
1229 1099
}
1230 1100
.section p {
1231 1101
  line-height: 1.7em;
1232 1102
}
1233 1103
.section .section-img {
1234
  margin-bottom: 22px;
1104
  margin-bottom: 14.666666666666666px;
1235 1105
}
1236 1106
.messages {
1237 1107
  display: inline;
......
1241 1111
  margin: 2em 0;
1242 1112
  background-color: #ddd;
1243 1113
  margin-left: 0;
1114
  font-size: 1.1em;
1244 1115
}
1245 1116
.messages li {
1246 1117
  padding: 1em;
......
1324 1195
  color: #000 !important;
1325 1196
}
1326 1197
.footer li {
1327
  margin-bottom: 11px;
1198
  margin-bottom: 7.333333333333333px;
1328 1199
}
1329 1200
.footer li.header {
1330
  margin-bottom: 22px;
1201
  margin-bottom: 14.666666666666666px;
1331 1202
}
1332 1203
.footer .col {
1333 1204
  display: inline;
......
1407 1278
}
1408 1279
/*blog styles*/
1409 1280
.blog-entry {
1410
  margin-bottom: 66px;
1411
  zoom: 1;
1412 1281
  margin-bottom: 44px;
1282
  zoom: 1;
1283
  margin-bottom: 29.333333333333332px;
1413 1284
}
1414 1285
.blog-entry em {
1415 1286
  color: #3582ac;
......
1434 1305
}
1435 1306
.blog-entry.positioned h3 {
1436 1307
  font-size: 1.2em;
1437
  margin-bottom: 22px;
1308
  margin-bottom: 14.666666666666666px;
1438 1309
}
1439 1310
.blog-entry.positioned .text {
1440 1311
  color: #000000;
......
1463 1334
.blog-entry h2 {
1464 1335
  font-size: 1.1em;
1465 1336
  line-height: 1.3em;
1466
  margin-bottom: 33px;
1337
  margin-bottom: 22px;
1467 1338
}
1468 1339
.blog-entry h2 a {
1469 1340
  color: #4085A6;
......
1473 1344
.blog-entry h3 {
1474 1345
  font-size: 1.1em;
1475 1346
  line-height: 1.3em;
1476
  margin-bottom: 33px;
1347
  margin-bottom: 22px;
1477 1348
}
1478 1349
.blog-entry p {
1479 1350
  line-height: 1.7em;
1480 1351
}
1481 1352
.blog-entry .section-img {
1482
  margin-bottom: 22px;
1353
  margin-bottom: 14.666666666666666px;
1483 1354
}
1484 1355
.blog-entry:before, .blog-entry:after {
1485 1356
  display: table;
......
1498 1369
  border: 1px solid #808080;
1499 1370
}
1500 1371
.blog-entry .intro-content, .blog-entry .content {
1501
  margin-top: 22px;
1372
  margin-top: 14.666666666666666px;
1502 1373
}
1503 1374
.blog-entry .intro-content object, .blog-entry .content object {
1504
  margin: 22px 0;
1375
  margin: 14.666666666666666px 0;
1505 1376
}
1506 1377
.blog-entry .entry-info {
1507 1378
  font-size: 0.7em;
1508
  margin-top: 22px;
1379
  margin-top: 14.666666666666666px;
1509 1380
}
1510 1381
.blog-entry.single .entry-info {
1511 1382
  margin-top: 0;
1512
  margin-bottom: 22px;
1383
  margin-bottom: 14.666666666666666px;
1384
}
1385
.section.twitter-feed {
1386
  font-size: 1.1em;
1513 1387
}
1514 1388
.section.twitter-feed .tweet {
1515 1389
  line-height: 1.3em;
1516 1390
  font-size: 0.9em;
1517
  margin-bottom: 22px;
1391
  margin-bottom: 14.666666666666666px;
1518 1392
  color: #808080;
1519 1393
}
1520 1394
.section.twitter-feed .tweet:last-child {
......
1562 1436
  float: left;
1563 1437
}
1564 1438
.resources .categories .title {
1565
  margin-bottom: 11px;
1439
  margin-bottom: 7.333333333333333px;
1566 1440
}
1567 1441
.resources .categories ul li a {
1568 1442
  text-decoration: none;
......
1570 1444
  margin-right: 22px;
1571 1445
}
1572 1446
.resources .list {
1573
  margin-top: 88px;
1447
  margin-top: 58.666666666666664px;
1574 1448
}
1575 1449
.resources .list .resource {
1576 1450
  -moz-box-sizing: border-box;
......
1578 1452
  box-sizing: border-box;
1579 1453
  *behavior: url(boxsizing.htc);
1580 1454
  width: 33%;
1581
  padding: 44px;
1455
  padding: 29.333333333333332px;
1582 1456
  float: left;
1583 1457
  border: 1px solid #faaf40;
1584
  height: 264px;
1458
  height: 176px;
1585 1459
}
1586 1460
.resources .list .resource .description {
1587 1461
  display: none;
......
1608 1482
  display: block;
1609 1483
  float: left;
1610 1484
  cursor: pointer;
1611
  margin-top: 9px;
1485
  margin-top: 5.333333333333333px;
1612 1486
}
b/cloudcms/static/cloudcms/less/styles.less
2 2
@import "../less/django_forms.less";
3 3
@import "../less/tables.less";
4 4
@import "../less/xtra.less";
5
@import "../less/colorbox.less";
6 5

  
7 6

  
8 7
// mixins
......
16 15

  
17 16
.clearme { .clearfix() }
18 17

  
18
@verticalSpacing: @gridGutterWidth/1.5;
19 19
@gradCol: #ddd;
20 20
body {
21 21
    #font.main();
22
    font-size: 12px;
22 23
}
23 24

  
24 25
.topbar {
25 26
    background-color: @shadowColor;
26 27
    .head {
27 28
        float: left;    
28
            padding: @gridGutterWidth/2-5;
29
            padding: @verticalSpacing/2-5;
29 30
    }
30 31
    .links {
31 32
        .clearfix();
......
35 36
            display: block;
36 37
            float: left;
37 38
            margin-left: 10px;
38
            padding: @gridGutterWidth/2+1;
39
            padding: @verticalSpacing/2+1;
39 40

  
40 41
            &:hover {
41 42
                background-color: lighten(@black, 10%);
......
107 108

  
108 109
div.header {
109 110
    position: relative;
110
    margin-top: 4*@gridGutterWidth;
111
    margin-bottom: @gridGutterWidth;
111
    margin-top: 2.5*@verticalSpacing;
112
    margin-bottom: @verticalSpacing;
112 113
    h1 {
113 114
        color: @shadowColor;
114 115
        display: inline;
......
129 130
.footer {
130 131
    border-bottom: 1px solid @mainBorderColor;
131 132
    border-top: 1px solid lighten(@mainBorderColor, 15%);
132
    padding-top: @gridGutterWidth;
133
    padding-bottom: @gridGutterWidth;
133
    padding-top: @verticalSpacing;
134
    padding-bottom: @verticalSpacing;
134 135
}
135 136

  
136 137
ul.inline {
......
145 146
.mainnav.quicknav {
146 147
    position: absolute;
147 148
    right: 0;
148
    top: -2.6*@gridGutterWidth;
149
    top: -2.6*@verticalSpacing;
149 150
    margin:0;
150 151

  
151 152
    li {
......
156 157

  
157 158
.navigation {
158 159
    height: 83px;    
160
    position: absolute;
161
    right: -15px;
162
    top: -23px;
159 163
}
160 164

  
161 165
.mainnav {
162
    font-size: 1.2em;
166
    font-size: 1.3em;
163 167
    
164 168
    &.subnav {
165
        margin-bottom: -@gridGutterWidth;
169
        margin-bottom: -@verticalSpacing;
166 170
        li {
167
            margin-top: 1.2em;
171
            margin-top: 0.4*@verticalSpacing;
172
            float: right;
168 173
        }
169 174
    }
170 175

  
171 176
    li {
172
        margin-top: 3*@gridGutterWidth;
177
        margin-top: 2*@verticalSpacing;
173 178
    }
174 179

  
175 180
    li.active {
......
210 215

  
211 216
div.page {
212 217
    .makeRow();
213
    margin-top: 6*@gridGutterWidth;
218
    margin-top: 5*@verticalSpacing;
214 219
    font-size: 1.1em;
215 220
    .page-inner {
216 221
        position: relative;    
......
329 334
        
330 335
        h3 {
331 336
            font-size: 1.2em;
332
            margin-bottom: @gridGutterWidth;    
337
            margin-bottom: @verticalSpacing;    
333 338
        }
334 339

  
335 340
        .text {
......
337 342
        }
338 343
    }
339 344

  
340
    margin-bottom: 3*@gridGutterWidth; 
345
    margin-bottom: 3*@verticalSpacing; 
341 346

  
342 347
    .left, .right {
343 348
        width: 50%;
......
405 410
form {
406 411
    
407 412
    &.login {
408
        margin-bottom: 1.5*@gridGutterWidth; 
413
        margin-bottom: 1.5*@verticalSpacing; 
409 414
    }
410 415

  
411 416
    h2 {
412 417
        color: @black;
413
        margin-bottom: @gridGutterWidth;
418
        margin-bottom: @verticalSpacing;
414 419
        font-size: 1.1em;
415 420

  
416 421
        span {
......
419 424
    }
420 425

  
421 426
    .form-row {
422
        min-height: 2*@gridGutterWidth;
427
        min-height: 2*@verticalSpacing;
423 428
        position: relative;
424 429
        &.submit {
425
            margin-top: 1.5*@gridGutterWidth;
430
            margin-top: 1.5*@verticalSpacing;
426 431
        }
427 432

  
428 433
        .extra-link {
......
433 438
            margin-top: 1.3em;
434 439
            float: right;
435 440
        }
441

  
442
        label {
443
            font-size: 1.1em;    
444
        }
436 445
    }
437 446
    
438 447
    &.innerlabels label { 
439 448
        position: absolute;
440
        top:1em;
441
        left:1.5em;
449
        top: 1.1em;
450
        left: 1.5em;
442 451
        color: #aaa;
443 452
    }
444 453

  
......
494 503
    background-image: url("../images/dashed_border.png");
495 504
    background-repeat: repeat-x;
496 505
    background-position: left bottom;
497
    padding-bottom: 2*@gridGutterWidth;
498
    margin-bottom: 2*@gridGutterWidth;
506
    padding-bottom: 2*@verticalSpacing;
507
    margin-bottom: 2*@verticalSpacing;
499 508

  
500 509
}
501 510

  
......
503 512
    h2 {
504 513
        font-size: 1.1em;
505 514
        line-height: 1.3em;
506
        margin-bottom: 1.5*@gridGutterWidth;    
515
        margin-bottom: 1.5*@verticalSpacing;    
507 516

  
508 517
        a {
509 518
            color: #4085A6;
......
515 524
    h3 {
516 525
        font-size: 1.1em;    
517 526
        line-height: 1.3em;
518
        margin-bottom: 1.5*@gridGutterWidth;    
527
        margin-bottom: 1.5*@verticalSpacing;    
519 528
    }
520 529

  
521 530
    p {
......
523 532
    }
524 533

  
525 534
    .section-img {
526
        margin-bottom: 1*@gridGutterWidth;    
535
        margin-bottom: 1*@verticalSpacing;    
527 536
    }
528 537
}
529 538

  
......
535 544
    margin: 2em 0;
536 545
    background-color: #ddd;
537 546
    margin-left: 0;
538

  
547
    font-size: 1.1em;
539 548
    li {
540 549
        padding: 1em;    
541 550

  
......
595 604
    }
596 605

  
597 606
    li {
598
        margin-bottom: @gridGutterWidth/2;
607
        margin-bottom: @verticalSpacing/2;
599 608

  
600 609
        &.header {
601
            margin-bottom: @gridGutterWidth;    
610
            margin-bottom: @verticalSpacing;    
602 611
        }
603 612
    }
604 613

  
......
664 673

  
665 674
    .section();
666 675
    .clearfix();
667
    margin-bottom: 2*@gridGutterWidth;    
676
    margin-bottom: 2*@verticalSpacing;    
668 677

  
669 678
    .title {
670 679
        margin-bottom: 1em;    
......
679 688
    }
680 689
    
681 690
    .intro-content, .content {
682
        margin-top: @gridGutterWidth;
691
        margin-top: @verticalSpacing;
683 692

  
684 693
        object {
685
            margin: @gridGutterWidth 0;    
694
            margin: @verticalSpacing 0;    
686 695
        }
687 696
    }
688 697

  
689 698
    .entry-info {
690 699
        font-size: 0.7em;
691
        margin-top: @gridGutterWidth;    
700
        margin-top: @verticalSpacing;    
692 701
    }
693 702

  
694 703
    &.single {
695 704
        .entry-info {
696 705
            margin-top: 0;
697
            margin-bottom: @gridGutterWidth;
706
            margin-bottom: @verticalSpacing;
698 707
        }    
699 708
    }
700 709
}
701 710

  
702 711
.section.twitter-feed {
703 712
    
713
    font-size: 1.1em;
704 714
    .tweet {
705 715
        &:last-child { margin-bottom:0; padding-bottom:0; border-bottom: none }
706 716
        line-height: 1.3em;
707 717
        font-size: 0.9em;
708
        margin-bottom: @gridGutterWidth;
718
        margin-bottom: @verticalSpacing;
709 719
        color: @gray;
710 720

  
711 721
        .date {
......
754 764
        ul { .clearfix() }
755 765
        ul li { float: left; }
756 766
        .title {
757
            margin-bottom: @gridGutterWidth/2;    
767
            margin-bottom: @verticalSpacing/2;    
758 768
        }
759 769

  
760 770
        ul li a {
......
766 776

  
767 777
    .list {
768 778
        
769
        margin-top: 4*@gridGutterWidth;
779
        margin-top: 4*@verticalSpacing;
770 780

  
771 781
        .resource {
772 782
            .border-box();
773 783
            width: 33%;
774
            padding: 2*@gridGutterWidth;
784
            padding: 2*@verticalSpacing;
775 785
            float: left;
776 786
            border: 1px solid @resCol;
777
            height: 12*@gridGutterWidth;
787
            height: 12*@verticalSpacing;
778 788

  
779 789
            .description {
780 790
                display: none;    
......
810 820
    display: block;
811 821
    float: left;
812 822
    cursor: pointer;
813
    margin-top: @gridGutterWidth/2 - 2;
823
    margin-top: @verticalSpacing/2 - 2;
814 824
}
815 825

  
816 826

  

Also available in: Unified diff