Projet

Général

Profil

Paste
Télécharger (26,5 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / themes / adaptivetheme / at_subtheme / sass / global.styles.scss @ a08833bd

1 85ad3d82 Assos Assos
2
// _base.scss imports _custom.scss (variables and mixins) and other partials.
3
@import "base";
4
5
/*
6
 * @file
7
 * global.styles
8
 *
9
 * Styles you add here will load for all device sizes, they are "global", as
10
 * opposed to "responsive" styles, which only load for a given breakpoint (media
11
 * query) that you set in theme settings. See the README for more details.
12
 *
13
 *
14
 * How to use this file:
15
 * --------------------
16
 *
17
 * There are many empty selectors and some basic styles to act as a guide.
18
 * Nothing is set in stone and you can change anything - even delete all of it
19
 * and start with your own clean slate.
20
 *
21
 * To FORCE PRINT all selectors you can search and replace a single { (opening
22
 * curly brace) and insert an empty comment. This is very useful in conjuction
23
 * with FireSass: https://addons.mozilla.org/en-US/firefox/addon/firesass-for-firebug/
24
 *
25
 * See global.base also which includes normalize.css and some additional
26
 * helper classes and base styles.
27
 */
28
29
/* =============================================================================
30
 *   Base
31
 * ========================================================================== */
32
33 74f6bef0 Assos Assos
/*
34 85ad3d82 Assos Assos
 * To preserve theme settings never apply font properties to the HTML element.
35
 * This is critically important if you are using the Responsive JavaScript
36
 * feature as this relies on being able to set a pseudo font family on the HTML
37
 * element. If you need to set default font properties of any kind use the BODY
38
 * element as these can be overridden using font theme settings.
39
 */
40
41
html {
42
  background: $page;
43
}
44
45
body {
46
  font-family: $sans-serif-small; // Set from _custom.scss font variables
47
  font-size: 87.5%;
48
}
49
50
51
/* =============================================================================
52
 *   HTML Elements
53
 * ========================================================================== */
54
55
h1 {}
56
57
58
h2 {}
59
60
61
h3 {}
62
63
64
h4 {}
65
66
67
h5 {}
68
69
70
h6 {}
71
72
73
p {}
74
75
76
b,
77
strong {}
78
79
80
i,
81
em {}
82
83
84
dfn {}
85
86
87
sup {}
88
89
90
sub {}
91
92
93
del {}
94
95
96
ins {}
97
98
99
blockquote {}
100
101
102
cite {}
103
104
105
q {}
106
107
108
address {}
109
110
111
ul {}
112
113
114
ol {}
115
116
117
li {}
118
119
120
dl {}
121
122
123
dd {}
124
125
126
dt {}
127
128
129
abbr {}
130
131
132
acronym {}
133
134
135
pre,
136
code,
137
tt,
138
samp,
139
kbd,
140
var {
141
  font-family: $mono;
142
}
143
144
145
/* =============================================================================
146
 *   Wrappers
147
 * ========================================================================== */
148
149
/*
150 74f6bef0 Assos Assos
 * Outer wrappers:
151
 * - #page-wrapper: body > #page-wrapper
152
 * - #page: body > #page-wrapper > #page
153
 * - .container: body > #page-wrapper > #page.container
154
 *
155
 * The .container class holds the page width value from theme settings. You can
156
 * style the .container class but do not add width such as border, padding,
157
 * margins etc.
158 85ad3d82 Assos Assos
 */
159 74f6bef0 Assos Assos
160
#page-wrapper {}
161
162
163 85ad3d82 Assos Assos
#page  {
164 74f6bef0 Assos Assos
  &.container {}
165 85ad3d82 Assos Assos
}
166
167
168
/*
169
 * Wraps all header elements - branding and .region-header
170
 */
171
#header {}
172
173
174
/*
175
 * Wraps the sidebars the content column
176
 */
177
#columns {}
178
179
180
/*
181
 * Main content column wrapper
182
 */
183
#content-column {}
184
185
186
/*
187 74f6bef0 Assos Assos
 * Wraps the main-content-header, the content region and feed-icons. Use this
188
 * wrapper to style the entire main content column
189 85ad3d82 Assos Assos
 */
190
#main-content {}
191
192
193
/*
194 74f6bef0 Assos Assos
 * Wraps the content region, avoid applying styles to this wrapper, its used
195
 * mainly for position and invisible gutters and can be problematic to style
196 85ad3d82 Assos Assos
 */
197
#content {}
198
199
200
/*
201
 * Footer wrapper
202
 */
203
#footer {}
204
205
206
/*
207
 * Panels may need additional margin wrangling when in the $content region
208
 */
209
#content .panel-display {}
210
211
212
/*
213
 * Full Width Wrappers
214
 * These are used in the optional page--full-width-wrappers.tpl.php template.
215
 * All have internal .container classes. In the full width wrapper template the
216 74f6bef0 Assos Assos
 * .container classes set the width or max-width - you can style this but never
217
 * add any width/margin/padding/borders etc to .container
218 85ad3d82 Assos Assos
 */
219
220
/*
221
 * Wraps the leaderboard
222
 */
223
#leaderboard-wrapper {
224
  .container {}
225
}
226
227
228
/*
229
 * Wraps the header
230
 */
231
#header-wrapper {
232
  /* Debug styles, is this working */
233
  background: $debug;
234
  .container {}
235
}
236
237
238
/*
239
 * Wraps the nav elements
240
 */
241
#nav-wrapper {
242
  .container {}
243
}
244
245
246
/*
247
 * Wraps breadcrumb
248
 */
249
#breadcrumb-wrapper {
250
  .container {}
251
}
252
253
254
/*
255
 * Wraps messages and help
256
 */
257
#messages-help-wrapper {
258
  .container {}
259
}
260
261
262
/*
263
 * Wraps the secondary content/preface region
264
 */
265
#secondary-content-wrapper {
266
  .container {}
267
}
268
269
270
/*
271
 * Wraps the main content column
272
 */
273
#content-wrapper {
274
  .container {}
275
}
276
277
278
/*
279
 * Wraps the tertiary content/postfix region
280
 */
281
#tertiary-content-wrapper {
282
  .container {}
283
}
284
285
286
/*
287
 * Footer wrapper
288
 */
289
#footer-wrapper {
290
  /* Debug styles, is this working? */
291
  background: $debug;
292
293
  .container {}
294
}
295
296
297
/* =============================================================================
298
 *   Branding
299
 * ========================================================================== */
300
301
/*
302
 * Wraps all the branding elements, logo, name and slogan
303
 */
304
#branding {}
305
306
307
/*
308
 * Logo
309
 */
310
#logo {
311
  padding: 10px 0;
312
313
  img {
314
    vertical-align: bottom;
315
  }
316
}
317
318
319
/*
320 74f6bef0 Assos Assos
 * Wrapper for the site name and slogan
321 85ad3d82 Assos Assos
 */
322
#name-and-slogan {}
323
324
325
/*
326
 * Site name (h1)
327
 */
328
#site-name {
329
  margin: 0;
330
331
  a {
332
333
    &:link,
334
    &:visited {
335
      text-decoration: none;
336
    }
337
338
    &:hover,
339
    &:focus {
340
      text-decoration: underline;
341
    }
342
  }
343
}
344
345
346
/*
347
 * Site slogan (h2)
348
 */
349
#site-slogan {
350
  margin: 0;
351
}
352
353
354
/* =============================================================================
355
 *   Page content header
356
 * ========================================================================== */
357
358
/*
359
 * Main content header wraps the page title, tabs and actions links
360
 */
361
#main-content-header {}
362
363
364
/*
365
 * The main page title (h1)
366
 */
367
#page-title {
368
  margin: 0;
369
}
370
371
372
/* =============================================================================
373
 *   Misc Global Styles
374
 * ========================================================================== */
375
376
/*
377
 * Feed icons
378
 */
379
.feed-icon {}
380
381
382
/*
383
 * Aggregator feed source
384
 */
385
#aggregator .feed-source .feed-icon {
386
  display: inline;
387
  float: none;
388
  margin-right: 10px;
389
}
390
391
392
.feed-details dt,
393
.feed-details dd {
394
  display: inline;
395
  margin: 0;
396
}
397
398
399
/*
400
 * Generic styles for the more link
401
 */
402
.more-link {}
403
404
405
/*
406
 * Generic styles for links. See the ul.links declaration in node and comment stylesheets
407
 */
408
ul.links {
409
  margin: 0;
410
  padding: 0;
411
412
  &.inline {
413
    display: block;
414
  }
415
416
  li {
417
    display: inline;
418
    list-style: none;
419
    padding: 0 10px 0 0;
420
  }
421
}
422
423
424
/*
425
 * Search results are an ordered list so reset the margin
426
 */
427
.search-results {
428
  margin: 0;
429 74f6bef0 Assos Assos
  padding: 0;
430
}
431
432
433
/*
434
 * Attribution message and link
435
 */
436
.attribution {
437
  display: block;
438
  opacity: 0.65;
439
  padding: 1em 0;
440
  text-align: center;
441
442
  a {
443
    text-decoration: none;
444
    color: inherit;
445
446
    &:hover,
447
    &:focus {
448
      text-decoration: underline;
449
    }
450
  }
451 85ad3d82 Assos Assos
}
452
453
454
/* =============================================================================
455
 *   Regions
456
 * ========================================================================== */
457
458
/*
459
 * Standard region wrapper, don't add width to any regions, you will bork the layout - no margin, padding or borders etc
460
 */
461
.region {}
462
463
464
/*
465
 * Regions have an inner div - perfect for adding margin, padding or borders
466
 */
467
.region-inner {}
468
469
470
/*
471
 * Regions can be nested, such as when using Panels
472
 */
473
.region-inner .region-inner {}
474
475
476
/*
477
 * Header region, embedded in the #header
478
 */
479
.region-header {}
480
481
482
/*
483
 * Generally used to output Drupals help block, if the help module is enabled
484
 */
485
.region-help {}
486
487
488
/*
489
 * Secondary content
490
 */
491
.region-secondary-content {}
492
493
494
/*
495
 * Sits above the main content header, like a content-top region
496
 */
497
.region-highlighted {}
498
499
500
/*
501
 * Sits below the main content, like a content-bottom region
502
 */
503
.region-content-aside {}
504
505
506
/*
507
 * Sidebars - targets both
508
 */
509
.sidebar {}
510
511
512
/*
513
 * First sidebar
514
 */
515
.region-sidebar-first {}
516
517
518
/*
519
 * Second sidebar
520
 */
521
.region-sidebar-second {}
522
523
524
/*
525
 * Tertiary content
526
 */
527
.region-tertiary-content {}
528
529
530
/*
531
 * Footer region
532
 */
533
.region-footer {}
534
535
536
/* =============================================================================
537
 *   Links
538
 * ========================================================================== */
539
540
a {
541
  text-decoration: none;
542
543
  &:link,
544
  &:visited {}
545
546
  &:active,
547
  &.active {}
548
549
  &:hover,
550
  &:focus {
551
    text-decoration: underline;
552
  }
553
}
554
555
556
/* =============================================================================
557
 *   Primary, Secondary and Menu Bar region menus
558
 * ========================================================================== */
559
560
.nav {
561
  clear: both;
562
  margin: 10px 0;
563
564
  ul,
565
  ul.menu {
566
    margin: 0;
567
    padding: 0;
568
  }
569
570
  li,
571
  ul.menu li {
572
    display: inline;
573
    float: left;
574
    list-style: none;
575
    margin: 0;
576
    padding: 0;
577
  }
578
579
  li a,
580
  ul.menu li a {
581
    display: block;
582
    white-space: nowrap;
583
    padding: 0 10px;
584 74f6bef0 Assos Assos
585 85ad3d82 Assos Assos
    &:visited {}
586 74f6bef0 Assos Assos
587 85ad3d82 Assos Assos
    &:hover,
588
    &:focus {}
589
  }
590
591
  .block {
592
    margin-bottom: 0;
593
  }
594
}
595
596
597
/* =============================================================================
598
 *   Superfish
599
 * ========================================================================== */
600
601
ul.sf-menu {
602
  margin-bottom: 0;
603
604
  a {
605
    border-left: 0;
606
    border-top: 0;
607
    padding: 0 10px;
608
    text-decoration: none;
609
    height: 2.5em;
610
    line-height: 2.5em;
611
612
    &:link,
613
    &:visited {}
614
  }
615
616
  li {
617
    &:hover,
618
    &.sfHover {
619
      outline: 0;
620
    }
621
  }
622
623
  a {
624
    &:focus,
625
    &:hover,
626
    &:active {
627
      outline: 0;
628
    }
629
  }
630
}
631
632
633
/*
634
 * Superfish blocks
635
 */
636
.block-superfish {
637
638
  .block-inner .content {}
639
640
  ul {
641
    margin: 0 !important;
642
    padding: 0 !important;
643
644
    ul {
645
      ul {
646
        ul {}
647
      }
648
    }
649
  }
650
651
  li {
652
    margin: 0 !important;
653
    padding: 0 !important;
654
  }
655
}
656
657
658
/*
659
 * Vertical style
660
 */
661
.sf-vertical {
662
  width: 100%;
663
664
  li {
665
    width: 100%;
666
667
    &.last {}
668
669
    &:hover ul,
670
    &.sfHover ul {
671
      left: 100%;
672
      top: 0;
673
      margin: 0;
674
      padding: 0;
675
    }
676
677
    a {
678
      padding: 0 10px;
679
    }
680
  }
681
}
682
683
684
/*
685
 * Navbar style
686
 */
687
.sf-navbar {
688
  padding-bottom: 0 !important;
689
}
690
691
692
/*
693
 * Sensible padding for the default style
694
 */
695
.sf-menu.sf-style-default a {
696
  padding: 0 10px;
697
}
698
699
700 74f6bef0 Assos Assos
/* =============================================================================
701
 *   Menu Toggles
702
 * ========================================================================== */
703
// .at-mt is a page class
704
.at-mt {
705
  .at-menu-toggle,
706
  .at-menu-toggle ul,
707
  .at-menu-toggle ul.menu {
708
    margin-top: 0;
709
    margin-bottom: 0;
710
    padding: 0;
711
  }
712
713
  .at-menu-toggle-button {
714
    margin: 0;
715
  }
716
717
  .at-menu-toggle ul a {
718
    padding: 0 10px;
719
    white-space: nowrap;
720
  }
721
}
722
723
724 85ad3d82 Assos Assos
/* =============================================================================
725
 *   Menus, usually blocks
726
 * ========================================================================== */
727
728
ul.menu {
729
  padding-left: 15px;
730
731
  ul {
732
    padding-left: 15px;
733
734
    ul {
735
      ul {}
736
    }
737
  }
738
739
  li {
740
    margin: 0;
741
742
    &.collapsed,
743
    &.expanded,
744
    &.leaf {}
745
746
    a {
747
748
      &:link,
749
      &:visited {}
750
751
      &:active,
752
      &.active {}
753
754
      &:hover,
755
      &:focus {}
756
    }
757
758
    &.active a,
759
    &.active-trail a {}
760
761
    &.first,
762
    &.last {}
763
  }
764
}
765
766
767
/* If li.content exists it's a problem, so reset the padding */
768
.block .menu li.content {
769 74f6bef0 Assos Assos
  padding: 0;
770 85ad3d82 Assos Assos
}
771
772 74f6bef0 Assos Assos
773 85ad3d82 Assos Assos
/* =============================================================================
774
 *   Book navigation menu
775
 * ========================================================================== */
776
777
.book-navigation {
778
779
  .page-links {}
780
781
  .page-previous {}
782
783
  .page-next {}
784
785
  .page-up {
786
    /* Prevent text wrapping to a new line, assumes English "up" is used (two characters) */
787
    min-width: 2em;
788
    white-space: nowrap;
789
  }
790 74f6bef0 Assos Assos
791 85ad3d82 Assos Assos
  .menu {
792
    margin-left: 0;
793
  }
794
}
795
796
797
/* =============================================================================
798
 *   Breadcrumbs
799
 * ========================================================================== */
800
801
#breadcrumb {
802
  margin: 10px 0;
803
804
  /* If the label is set to show in theme settings the label class is added */
805
  .breadcrumb-label {
806
    font-size: 1em;
807
    display: inline;
808
    padding-right: 10px;
809
810
    &:after {
811
      content: ":";
812
    }
813
  }
814
815
  ol {
816
    margin: 0;
817
    padding: 0;
818
  }
819
820
  .with-breadcrumb-label ol {
821
    display: inline;
822
  }
823
824
  li {
825
    list-style: none;
826
    display: inline;
827
  }
828
829
  li.crumb-first {}
830
831
  li.crumb-last {}
832
833
  a {
834
835
    &:link,
836
    &:visited {}
837
838
    &:active,
839
    &.active {}
840
841
    &:hover,
842
    &:focus {}
843
  }
844
}
845
846
847
/* =============================================================================
848
 *   Pagers
849
 * ========================================================================== */
850
851
ul.pager {
852
  clear: both;
853
  margin: 0;
854
  text-align: center;
855
}
856
857
858
.item-list ul.pager li {
859
  margin: 0;
860
}
861
862
863
ul.pager li {
864
  background-image: none;
865
  display: inline;
866
  list-style-type: none;
867
  padding: .5em;
868
869
  &.pager-current {
870
    font-weight: 700;
871
  }
872
}
873
874
875
.block ul.pager li {
876
  margin: 0;
877
}
878
879
880
/*
881
 * Theme the various states of pager links
882
 */
883
ul.pager li {
884
885
  a {
886
887
    &:link,
888
    &:visited {}
889
890
    &:active,
891
    &.active {}
892
893
    &:hover,
894
    &:focus {}
895
  }
896
897
  &.pager-item {}
898
  &.first {}
899
  &.last {}
900
  &.pager-current {}
901
  &.pager-first {}
902
  &.pager-previous {}
903
  &.pager-next {}
904
  &.pager-last {}
905
}
906
907
908
/* =============================================================================
909
 *   Skip Navigation
910
 * ========================================================================== */
911
912
#skip-link {
913
  left: 50%;
914
  margin-left: -6.5em;
915
  margin-top: 0;
916
  padding: 0 0.5em;
917
  position: absolute;
918
  width: 12em;
919
  z-index: 50;
920
921
  a {
922
    background: #444;
923
    background: rgba(0, 0, 0, 0.6);
924
    color: $page;
925
    display: block;
926
    line-height: 2;
927
    padding: 0;
928
    text-align: center;
929
    text-decoration: none;
930
931
    &:link,
932
    &:visited {
933
      background: #444;
934
      background: rgba(0, 0, 0, 0.6);
935
      color: $page;
936
      display: block;
937
      line-height: 2;
938
      padding: 0;
939
      text-align: center;
940
      text-decoration: none;
941
    }
942
    &:hover,
943
    &:focus,
944
    &:active {
945
      outline: 0;
946
    }
947
  }
948
}
949
950
951
/* =============================================================================
952
 *   Tabs (local tasks)
953
 * ========================================================================== */
954
955
#tasks {
956
  margin-bottom: 15px;
957
}
958
959
960
ul.primary {
961
  border-bottom-color: $border;
962
  margin: 20px 0;
963
  padding: 0 0 0 5px;
964
965
  li {
966
    display: block;
967
    float: left;
968
    margin: 0 1px -1px;
969
970
    a {
971
      background-color: $ultralight;
972
      border-color: $border;
973
      margin-right: 1px;
974
      padding: 0 10px;
975
      display: block;
976
      float: left;
977
      height: 1.5em;
978
      line-height: 1.5em;
979
980
      &:hover,
981
      &:focus {
982
        background-color: $light;
983
        border-color: $border;
984
      }
985
    }
986
  }
987
988
  li.active {
989
    a,
990
    a:hover,
991
    a:focus {
992
      background-color: $page;
993
      border-bottom-color: $page;
994
    }
995
  }
996
}
997
998
999
ul.secondary {
1000
  border-bottom: 1px solid $border;
1001
  margin: 1em 0 0;
1002
  padding: 0 .3em 1em;
1003
1004
  li {
1005
    border-right: 0;
1006
    list-style: none;
1007
    padding: 0 10px 0 0;
1008
1009
    a {
1010
      &:hover,
1011
      &.active {
1012
        border-bottom: none;
1013
        text-decoration: underline;
1014
      }
1015
    }
1016
  }
1017
}
1018
1019
1020
/* =============================================================================
1021
 *   Action links
1022
 * ========================================================================== */
1023
1024
ul.action-links {
1025
  margin: 20px 0 0;
1026
  list-style: none;
1027
1028
  li {}
1029
}
1030
1031
1032
/* =============================================================================
1033
 *  Field Styling
1034
 * ========================================================================== */
1035
1036
/*
1037
 * Wrapper for any field
1038
 */
1039
.field {}
1040
1041
1042
/*
1043
 * Above and inline classes are on the field wrapper
1044
 */
1045
.field-label-above {}
1046
1047
1048
/*
1049
 * When labels are set to inline in field display settings the clearfix class is automatically added
1050
 */
1051 74f6bef0 Assos Assos
.field-label-inline {
1052 85ad3d82 Assos Assos
1053 74f6bef0 Assos Assos
  /* Remove the margin on inline field lables to preserve vertical formatting */
1054
  .field-label {
1055
    margin: 0;
1056
  }
1057
}
1058 85ad3d82 Assos Assos
1059
/*
1060
 * Labels are h2 in Adaptivetheme. Use a strong selector to mitigate unwanted ineritance issues
1061
 */
1062
.field-label {
1063
  font-size: 1em;
1064
  font-weight: 700;
1065
  font-family: inherit;
1066
  line-height: inherit;
1067
  margin-bottom: 0;
1068
}
1069
1070
1071
/*
1072
 * Field types (Core)
1073
 */
1074
1075
/*
1076
 * Image fields use the <figure> and <figcaption> elements from HTML5
1077
 */
1078
.field-type-image {
1079
1080
  .caption {}
1081
1082
  .full-caption {}
1083
1084
  .teaser-caption {}
1085
}
1086
1087
1088
/*
1089
 * Taxonomy
1090
 */
1091
.field-type-taxonomy-term-reference {
1092
1093
  /* The same bottom margin as p, blockquote, ul, ol and dl */
1094
  margin-bottom: 1.5em;
1095
1096
  &.field-label-inline .field-items {
1097
    margin: 0;
1098
    padding: 0;
1099
  }
1100
1101
  &.field-label-inline .field-item {
1102
    display: inline;
1103
    list-style: none;
1104
    padding: 0 10px 0 0;
1105
  }
1106
}
1107
1108
1109
/*
1110
 * Text
1111
 */
1112
.field-type-text {}
1113
1114
1115
/*
1116
 * Long text
1117
 */
1118
.field-type-text-long {}
1119
1120
1121
/*
1122
 * Text with summary
1123
 */
1124
.field-type-text-with-summary {}
1125
1126
1127
/*
1128
 * File
1129
 */
1130
.field-type-file {}
1131
1132
1133
/*
1134
 * Number/Integer
1135
 */
1136
.field-type-number-integer {}
1137
1138
1139
/*
1140
 * Decimal
1141
 */
1142
.field-type-number-decimal {}
1143
1144
1145
/*
1146
 * Number float
1147
 */
1148
.field-type-number-float {}
1149
1150
1151
/*
1152
 * List
1153
 */
1154
.field-type-list-text {}
1155
1156
1157
/*
1158
 * List boolean
1159
 */
1160
.field-type-list-boolean {}
1161
1162
1163
/*
1164
 * List integer
1165
 */
1166
.field-type-list-integer {}
1167
1168
1169
/*
1170
 * List float
1171
 */
1172
.field-type-list-float {}
1173
1174
1175
/*
1176
 * Field types (Contrib)
1177
 */
1178
.field-type-datetime {}
1179
1180
.field-type-node-reference {}
1181
1182
.field-type-user-reference {}
1183
1184
1185
/*
1186
 * Named fields
1187
 */
1188
.field-name-body {}
1189
1190
.field-name-field-image {}
1191
1192
.field-name-field-tags {}
1193
1194
1195
/*
1196
 * Underscores in field name are replaced with dashes
1197
 */
1198
.field-name-field-FIELDNAME {}
1199
1200
1201
/*
1202 74f6bef0 Assos Assos
 * Image Alignment Theme Settings - included here so you can easily override
1203 85ad3d82 Assos Assos
 */
1204
1205
/*
1206
 * Float none setting
1207
 */
1208
.ia-n .field-type-image,
1209
.iat-n .field-type-image {}
1210
1211
1212
/*
1213
 * Float left setting
1214
 */
1215
.ia-l .field-type-image figure,
1216
.iat-l .field-type-image figure {
1217
  margin: 5px 20px 15px 0;
1218
}
1219
1220
1221
/*
1222
 * Centered setting
1223
 */
1224
.ia-c .field-type-image figure,
1225
.iat-c .field-type-image figure {
1226
  margin: 5px auto 15px;
1227
}
1228
1229
1230
/*
1231
 * Float right setting
1232
 */
1233
.ia-r .field-type-image figure,
1234
.iat-r .field-type-image figure {
1235
  margin: 5px 0 15px 20px;
1236
}
1237
1238
1239
1240
/* =============================================================================
1241
 *   Block Styling
1242
 * ========================================================================== */
1243
1244
/*
1245
 * Main wrapper for most blocks, block_system_main does not have it
1246
 */
1247
.block {
1248
  margin-bottom: 20px;
1249
}
1250
1251
1252
/*
1253
 * Inner wrapper for most blocks, good for margin, padding and borders, block_system_main does not have it
1254
 */
1255
.block-inner {}
1256
1257
1258
/*
1259
 * The first block in the region
1260
 */
1261
.block.first {}
1262
1263
1264
/*
1265
 * The last block in the region
1266
 */
1267
.block.last {}
1268
1269
1270
/*
1271
 * Zebra striping for each block in the region
1272
 */
1273
.block.odd {}
1274
1275
1276
/*
1277
 * Zebra striping for each block in the region
1278
 */
1279
.block.even {}
1280
1281
1282
/*
1283
 * Block title
1284
 */
1285
.block-title {
1286
  margin: 0;
1287
}
1288
1289
1290
/*
1291
 * Block content wrapper
1292
 */
1293
.block-content {}
1294
1295
1296
/*
1297
 * Match item list and block menu margin and padding
1298
 */
1299
.block-content {
1300
1301
  ul,
1302
  ol {
1303
    padding: 0 0 0 15px;
1304
  }
1305
1306
  li {
1307
    margin: 0;
1308
    padding: 0;
1309
  }
1310
}
1311
1312
1313
/*
1314
 * Block for the latest news items in the first category
1315
 */
1316
#block-aggregator-category-1 {}
1317
1318
1319
/*
1320
 * Block for the latest news items in the first feed
1321
 */
1322
#block-aggregator-feed-1 {}
1323
1324
1325
/*
1326
 * First block created with "Add block" link
1327
 */
1328
#block-block-1 {}
1329
1330
1331
/*
1332
 * "Recent blog posts" block
1333
 */
1334
#block-blog-recent {}
1335
1336
1337
/*
1338
 * "Book navigation" block for the current book's table of contents
1339
 */
1340
#block-book-navigation {}
1341
1342
1343
/*
1344
 * "Recent comments" block
1345
 */
1346
#block-comment-recent {}
1347
1348
1349
/*
1350
 * "Active forum topics" block
1351
 */
1352
#block-forum-active {}
1353
1354
1355
/*
1356
 * "New forum topics" block
1357
 */
1358
#block-forum-new {}
1359
1360
1361
/*
1362
 * Language switcher block
1363
 */
1364
#block-locale-language {}
1365
1366
1367
/*
1368
 * Custom menu block
1369
 */
1370
#block-menu-menu-NAME {}
1371
1372
1373
/*
1374
 * "Recent content" block
1375
 */
1376
#block-node-recent {}
1377
1378
1379
/*
1380
 * "Syndicate" block for primary RSS feed; see also page.css's .feed-icon
1381
 */
1382
#block-node-syndicate {}
1383
1384
1385
/*
1386
 * "Most recent poll" block
1387
 */
1388
#block-poll-recent {}
1389
1390
1391
/*
1392
 * "Author information" block for the profile of the page's author
1393
 */
1394
#block-profile-author-information {}
1395
1396
1397
/*
1398
 * "Search form" block
1399
 */
1400
#block-search-form {}
1401
1402
1403
/*
1404
 * "Shortcuts" block
1405
 */
1406
#block-shortcut-shortcuts {}
1407
1408
1409
/*
1410
 * "Popular content" block
1411
 */
1412
#block-statistics-popular {}
1413
1414
1415
/*
1416
 * "Main menu" block
1417
 */
1418
#block-system-main-menu {}
1419
1420
1421
/*
1422
 * "Management" block for Drupal management menu
1423
 */
1424
#block-system-management {}
1425
1426
1427
/*
1428
 * "Navigation" block for Drupal navigation menu
1429
 */
1430
#block-system-navigation {}
1431
1432
1433
/*
1434
 * "User menu" block for Drupal user menu
1435
 */
1436
#block-system-user-menu {}
1437
1438
1439
/*
1440
 * "System help" block
1441
 */
1442
#block-system-help {}
1443
1444
1445
/*
1446
 * "Main page content" block
1447
 */
1448
#block-system-main {}
1449
1450
1451
/*
1452
 * "Powered by Drupal" block
1453
 */
1454
#block-system-powered-by {}
1455
1456
1457
/*
1458
 * "User login form" block
1459
 */
1460
#block-user-login {}
1461
1462
1463
/*
1464
 * "Who's new" block for a list of the newest users
1465
 */
1466
#block-user-new {}
1467
1468
1469
/*
1470
 * "Who's online" block for a list of the online users
1471
 */
1472
#block-user-online {}
1473
1474
1475
/* =============================================================================
1476
 *   Node Styling
1477
 * ========================================================================== */
1478
1479
.node {
1480
  margin-bottom: 20px;
1481
1482
  &.node-promoted {}
1483
1484
  &.node-sticky {}
1485
1486
  &.node-by-viewer {}
1487
1488
  &.node-teaser {}
1489
1490
  &.node-full {}
1491
1492
  &.odd {}
1493
1494
  &.even {}
1495
1496
  .node-title {
1497
    margin: 0;
1498
  }
1499
1500
  .user-picture {}
1501
1502
  .submitted {
1503
1504
    .username {}
1505
1506
    time {}
1507
  }
1508
1509
  .node-content {}
1510
1511
  ul.links {
1512
1513
    li {}
1514
    li a {}
1515
1516
    li.node-read-more a {}
1517
    li.comment-add a {}
1518
    li.comment-comments a {}
1519
    li.comment-new-comments a {}
1520
    li.blog-sernames-blog a {}
1521
    li.print-html a {}
1522
    li.print-email a {}
1523
    li.print-pdf a {}
1524
  }
1525
}
1526
1527
1528
.preview .node {}
1529
1530
1531
/*
1532
 * All nodes are given a node-FOO class that describes the type of content that
1533
 * it is. If you create a new content type called "my-custom-type", it will
1534
 * receive a "node-my-custom-type" class.
1535
 */
1536
.node-page {}
1537
1538
.node-article {}
1539
1540
.node-book {}
1541
1542
.node-forum {}
1543
1544
.node-poll {}
1545
1546
1547
/* =============================================================================
1548
 *   Comment Styling - Comments, comment wrapper, comment form
1549
 * ========================================================================== */
1550
1551
/*
1552
 * Wrapper for the list of comments and its titles
1553
 */
1554
#comments {
1555
  margin: 1.5em 0;
1556
1557
  h2 {
1558
    &.comment-title {
1559
      margin: 0;
1560
    }
1561
1562
    &.comment-form {
1563
      margin: 0;
1564
    }
1565
  }
1566
}
1567
1568
1569
/*
1570
 * Wrapper for a single comment
1571
 */
1572
.comment {
1573
  margin-bottom: 20px;
1574
1575
  &.first {}
1576
1577
  &.last {}
1578
1579
  &.odd {}
1580
1581
  &.even {}
1582
1583
  .user-picture {}
1584
1585
  .submitted {
1586
1587
    p {}
1588
1589
    .username {}
1590
1591
    time {}
1592
  }
1593
1594
  .user-signature {}
1595
1596
  ul.links {}
1597
}
1598
1599
1600
/*
1601
 * Comment title
1602
 */
1603
.comment-title {
1604
  margin: 0;
1605
}
1606
1607
1608
/*
1609
 * Comment states
1610
 */
1611
.comment-new {}
1612
1613
.comment-by-anonymous {}
1614
1615
.comment-by-node-author {}
1616
1617
.comment-by-viewer {}
1618
1619
.comment-title-hidden {}
1620
1621
.comment-with-picture {}
1622
1623
.comment-with-signature {}
1624
1625
1626
/*
1627
 * Preview of the comment before submitting new or updated comment
1628
 */
1629
.comment-preview {}
1630
1631
1632
/*
1633
 * "New" marker for comments that are new for the current user
1634
 */
1635
.new {
1636
  color: $highlight;
1637
}
1638
1639
1640
/*
1641
 * Nested comments are indented
1642
 */
1643
.indented {
1644
  margin-left: 40px;
1645
}
1646
1647
1648
/* =============================================================================
1649
 *   Forms
1650
 * ========================================================================== */
1651
1652
/*
1653
 * Wrapper for a form element (or group of form elements) and its label
1654
 */
1655 74f6bef0 Assos Assos
.form-item {
1656 85ad3d82 Assos Assos
1657
  input.error,
1658
  textarea.error,
1659
  select.error {
1660
    border: 1px solid $highlight;
1661
  }
1662
1663
  label {
1664
    font-weight: 700;
1665
  }
1666
1667 74f6bef0 Assos Assos
  label.option {
1668 85ad3d82 Assos Assos
  }
1669
1670
  .description {
1671
    font-size: 0.85em;
1672
  }
1673
1674
  &.form-checkboxes ,
1675
  &.form-radios {
1676
  }
1677
}
1678
1679
1680
/*
1681
 * Highlight marks and form required mark
1682
 */
1683
.marker,
1684
.form-required {
1685
  color: $highlight;
1686
}
1687
1688
1689
/*
1690
 * The submit button
1691
 */
1692 74f6bef0 Assos Assos
.form-submit {
1693 85ad3d82 Assos Assos
}
1694
1695
1696
.container-inline {
1697
  div,
1698
  label {
1699
    display: inline;
1700
  }
1701
}
1702
1703
/*
1704
 * Define consistent borders
1705
 */
1706
fieldset {
1707
  border: 1px solid $border;
1708
}
1709
1710
/*
1711
 * Tips for Drupal's input formats
1712
 */
1713 74f6bef0 Assos Assos
.tips {
1714 85ad3d82 Assos Assos
}
1715
1716
1717
/*
1718
 * Buttons used by contrib modules like Media
1719
 */
1720 74f6bef0 Assos Assos
a.button {
1721 85ad3d82 Assos Assos
  @include appearance(button);
1722
}
1723
1724
1725
/*
1726
 * Password confirmation
1727
 */
1728
.password-parent,
1729
.confirm-parent {
1730
  margin: 0;
1731
}
1732
1733
1734
/* =============================================================================
1735
 *   Tables
1736
 * ========================================================================== */
1737
1738
table {
1739
  margin: 10px 0;
1740
  padding: 0;
1741
  width: 100%;
1742
1743
  &.sticky-header {
1744
    z-index: 10;
1745
  }
1746
}
1747
1748
1749
table,
1750
thead,
1751
tbody,
1752
tr,
1753
th,
1754
td {
1755
  border-color: $border;
1756
}
1757
1758
1759
table,
1760
td,
1761
th {
1762
  vertical-align: middle;
1763
}
1764
1765
1766
caption,
1767
th,
1768
td {
1769
  text-align: left;
1770
}
1771
1772
1773
thead tr {
1774
  font-weight: 700;
1775
  background-color: $medium_dark;
1776
}
1777
1778
1779
td,
1780
th {
1781
  border-bottom: 0;
1782
  margin: 0;
1783
  padding: 5px 7px;
1784
}
1785
1786
1787
tbody {}
1788
1789
1790
tbody tr {
1791
  border-top: 1px solid $border;
1792
}
1793
1794
1795
tr {
1796
1797
  &.odd {
1798
    background: $page;
1799
  }
1800
1801
  /* Table row striping */
1802
  &.info,
1803
  &.even,
1804
  &:nth-child(2n+2)  {
1805
    border-bottom: 0;
1806
    background-color: $ultralight;
1807
  }
1808
1809
  &.drag {}
1810
1811
  &.drag-previous {}
1812
1813
  &.odd td.active {
1814
    background-color: $light;
1815
  }
1816
1817
  &.even td.active {
1818
    background-color: $medium_light;
1819
  }
1820
}
1821
1822
1823
.lt-ie8 tr {
1824
1825
  &.even,
1826
  &.odd {
1827
1828
    th,
1829
    td {
1830
    }
1831
  }
1832
}
1833
1834
1835
/*
1836
 * Forum tables
1837
 * Core sets white-space to nowrap, which makes no sense
1838
 */
1839
#forum td {
1840 74f6bef0 Assos Assos
  &.created,
1841
  &.posts,
1842
  &.topics,
1843
  &.last-reply,
1844
  &.replies,
1845
  &.pager {
1846
    white-space: normal;
1847 85ad3d82 Assos Assos
  }
1848
}
1849
1850
1851
/* =============================================================================
1852
 *   Messages
1853
 * ========================================================================== */
1854
1855
div {
1856
  &.messages {
1857
  // Left and right margin are set by the global gutter width
1858
  margin-bottom: 10px;
1859
  margin-top: 10px;
1860
1861
    ul {
1862
      margin-top: 0;
1863
      margin-bottom: 0;
1864
    }
1865
  }
1866
1867
  &.status {
1868
  }
1869
1870
  &.warning {
1871
  }
1872
}
1873
1874
tr.warning {
1875
}
1876
1877
1878
div.error,
1879
tr.error {
1880
}
1881
1882
1883
.error {
1884
}
1885
1886
1887
.warning {
1888
}
1889
1890
1891
/*
1892
 * Unpublished nodes
1893
 */
1894
.node-unpublished,
1895
.comment-unpublished {
1896
}
1897
1898
1899
.node-unpublished,
1900
.comment-unpublished {
1901
1902
  p.unpublished {
1903
    @include unpublished;
1904
  }
1905
}
1906
1907
1908
/* =============================================================================
1909
 *    Maintenance pages
1910
 * ========================================================================== */
1911
1912
.maintenance-page {
1913
  .container {
1914
    padding: 40px 0;
1915
  }
1916
1917
  #site-name,
1918
  #page-title {
1919
    margin: 0;
1920
  }
1921
}
1922
1923
1924
.db-offline {
1925
  .container {
1926
    margin: 0 auto;
1927
    padding: 40px 0;
1928
    width: 100%;
1929
    max-width: 960px;
1930
  }
1931
1932
  div.messages {
1933
    margin: 20px 0 0;
1934
  }
1935
1936
  #content {
1937
    padding: 20px 0;
1938
  }
1939
}
1940
1941
1942
/* =============================================================================
1943
 *   Misc overrides for contrib modules
1944
 * ========================================================================== */
1945
1946
/*
1947
 * Admin menu overrides
1948
 */
1949
#admin-menu {
1950
  margin: 0;
1951
  padding: 0;
1952
}
1953
1954
1955
/*
1956
 * Devel Module
1957
 */
1958
.dev-query {
1959
  background: $light;
1960
  padding: 30px;
1961
}
1962
1963
1964
/*
1965
 * Styleguide module tweaks
1966
 */
1967
#styleguide-header {
1968
  padding: 0 10px;
1969
1970
  .item-list {
1971
    font-family: inherit;
1972
    margin: 0 20px 20px 0;
1973
    min-height: 260px;
1974
    width: auto;
1975
  }
1976
}