Projet

Général

Profil

Paste
Télécharger (16,4 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / themes / bootstrap / starterkits / sass / scss / _overrides.scss @ 7547bb19

1
// Media query variables.
2
$tablet:              "screen and (min-width: #{$screen-sm-min})";
3
$normal:              "screen and (min-width: #{$screen-md-min})";
4
$wide:                "screen and (min-width: #{$screen-lg-min})";
5
$grid-breakpoint:     "screen and (min-width: #{$grid-float-breakpoint})";
6

    
7
// Drop shadows.
8
@mixin box-shadow($shadow) {
9
  -webkit-box-shadow: $shadow;
10
     -moz-box-shadow: $shadow;
11
          box-shadow: $shadow;
12
}
13

    
14
html {
15
  &.overlay-open .navbar-fixed-top {
16
    z-index: 400;
17
  }
18
  &.js {
19
    // Collapsible fieldsets.
20
    fieldset.collapsed {
21
      border-left-width: 1px;
22
      border-right-width: 1px;
23
      height: auto;
24
    }
25
    // Throbbers.
26
    input.form-autocomplete {
27
      background-image: none;
28
    }
29
    // Autocomplete.
30
    input.form-autocomplete {
31
      background-image: none;
32
    }
33
    // Autocomplete (fallback throbber, no icon).
34
    .autocomplete-throbber {
35
      background-position: 100% 2px;
36
      background-repeat: no-repeat;
37
      display: inline-block;
38
      height: 15px;
39
      margin: 2px 0 0 2px;
40
      width: 15px;
41
    }
42
    .autocomplete-throbber.throbbing {
43
      background-position: 100% -18px;
44
    }
45
  }
46
}
47
body {
48
  // Fix horizontal scrolling on iOS devices.
49
  // http://drupal.org/node/1870076
50
  position: relative;
51
  &.admin-expanded.admin-vertical.admin-nw .navbar,
52
  &.admin-expanded.admin-vertical.admin-sw .navbar {
53
    margin-left: 260px;
54
  }
55
  // Add padding to body if various toolbar or navbars are fixed on top.
56
  &.navbar-is-fixed-top {
57
    padding-top: 64px;
58
  }
59
  &.navbar-is-fixed-bottom {
60
    padding-bottom: 64px !important;
61
  }
62
  &.toolbar {
63
    padding-top: 30px !important;
64
    .navbar-fixed-top {
65
      top: 30px;
66
    }
67
    &.navbar-is-fixed-top {
68
      padding-top: 94px !important;
69
    }
70
  }
71
  &.toolbar-drawer {
72
    padding-top: 64px !important;
73
    .navbar-fixed-top {
74
      top: 64px;
75
    }
76
    &.navbar-is-fixed-top {
77
      padding-top: 128px !important;
78
    }
79
  }
80
  // Admin_menu toolbar.
81
  &.admin-menu {
82
    .navbar-fixed-top {
83
      top: 29px;
84
    }
85
    &.navbar-is-fixed-top {
86
      padding-top: 93px !important;
87
    }
88
  }
89
  div#admin-toolbar {
90
    z-index: 1600;
91
  }
92
  // Override box-shadow styles on all "admin" menus.
93
  #toolbar, #admin-menu, #admin-toolbar {
94
    @include box-shadow(none);
95
  }
96
  // Override #admin-menu style.
97
  #admin-menu {
98
    margin: 0;
99
    padding: 0;
100
    position: fixed;
101
    z-index: 1600;
102
    .dropdown li {
103
      line-height: normal;
104
    }
105
  }
106
}
107

    
108
// Default navbar.
109
.navbar {
110
  &.container {
111
    @media #{$tablet} {
112
      max-width: (($container-sm - $grid-gutter-width));
113
    }
114
    @media #{$normal} {
115
      max-width: (($container-md - $grid-gutter-width));
116
    }
117
    @media #{$wide} {
118
      max-width: (($container-lg - $grid-gutter-width));
119
    }
120
  }
121
  &.container,
122
  &.container-fluid {
123
    margin-top: 20px;
124
  }
125
  &.container > .container,
126
  &.container-fluid > .container-fluid {
127
    margin: 0;
128
    padding: 0;
129
    width: auto;
130
  }
131
}
132

    
133
// Adjust z-index of core components.
134
#overlay-container,
135
.overlay-modal-background,
136
.overlay-element {
137
  z-index: 1500;
138
}
139
#toolbar {
140
  z-index: 1600;
141
}
142
// Adjust z-index of bootstrap modals
143
.modal {
144
  z-index: 1620;
145
}
146
.modal-dialog {
147
  z-index: 1630;
148
}
149
.ctools-modal-dialog .modal-body {
150
  width: 100% !important;
151
  overflow: auto;
152
}
153
.modal-backdrop {
154
  z-index: 1610;
155
}
156
.footer {
157
  margin-top: 45px;
158
  padding-top: 35px;
159
  padding-bottom: 36px;
160
  border-top: 1px solid #E5E5E5;
161
}
162

    
163
// Element invisible fix
164
.element-invisible {
165
  margin: 0;
166
  padding: 0;
167
  width: 1px;
168
}
169

    
170
// Branding.
171
.navbar .logo {
172
  margin-right: -15px;
173
  padding-left: 15px;
174
  padding-right: 15px;
175
  @media #{$grid-breakpoint} {
176
    margin-right: 0;
177
    padding-left: 0;
178
  }
179
}
180

    
181
// Navigation.
182
ul.secondary {
183
  float: left;
184
  @media #{$tablet} {
185
    float: right;
186
  }
187
}
188

    
189
// Page header.
190
.page-header {
191
  margin-top: 0;
192
}
193

    
194
// Sidebar blocks.
195
.region-sidebar-first,
196
.region-sidebar-second {
197
  .block:first-child h2.block-title {
198
    margin-top: 0;
199
  }
200
}
201

    
202
// Paragraphs.
203
p:last-child {
204
  margin-bottom: 0;
205
}
206

    
207
// Help region.
208
.region-help {
209
  > .glyphicon {
210
    font-size: $font-size-large;
211
    float: left;
212
    margin: -0.05em 0.5em 0 0;
213
  }
214
  .block {
215
    overflow: hidden;
216
  }
217
}
218

    
219
// Search form.
220
form#search-block-form {
221
  margin: 0;
222
}
223
.navbar #block-search-form {
224
  float: none;
225
  margin: 5px 0 5px 5px;
226
  @media #{$normal} {
227
    float: right;
228
  }
229

    
230
  .input-group-btn {
231
    width: auto;
232
  }
233
}
234
.navbar-search .control-group {
235
  margin-bottom:0px;
236
}
237

    
238
// Action Links
239
ul.action-links {
240
  margin: $padding-base-horizontal 0;
241
  padding: 0;
242
  li {
243
    display: inline;
244
    margin: 0;
245
    padding: 0 $padding-base-vertical 0 0;
246
  }
247
  .glyphicon {
248
    padding-right: 0.5em;
249
  }
250
}
251

    
252
// Form elements.
253
input, textarea, select, .uneditable-input {
254
  max-width: 100%;
255
  width: auto;
256
}
257
input.error {
258
  color: $state-danger-text;
259
  border-color: $state-danger-border;
260
}
261
fieldset legend.panel-heading {
262
  float: left;
263
  line-height: 1em;
264
  margin: 0;
265
}
266
fieldset .panel-body {
267
  clear: both;
268
  display: inherit;
269
}
270
fieldset .panel-heading a.panel-title {
271
  color: inherit;
272
  display: block;
273
  margin: -10px -15px;
274
  padding: 10px 15px;
275
  &:hover {
276
    text-decoration: none;
277
  }
278
}
279
.form-group:last-child,
280
.panel:last-child {
281
  margin-bottom: 0;
282
}
283
.form-horizontal .form-group {
284
  margin-left: 0;
285
  margin-right: 0;
286
}
287
.form-actions{
288
  clear: both;
289
}
290
.managed-files.table {
291
  td:first-child {
292
    width: 100%;
293
  }
294
}
295
div.image-widget-data {
296
  float: none;
297
  overflow: hidden;
298
}
299
table.sticky-header {
300
  z-index: 1;
301
}
302
.resizable-textarea textarea {
303
  border-radius: $border-radius-base $border-radius-base 0 0;
304
}
305
.text-format-wrapper {
306
  // Use same value as .form-group.
307
  margin-bottom: 15px;
308
  > .form-type-textarea,
309
  .filter-wrapper {
310
    margin-bottom: 0;
311
  }
312
}
313
.filter-wrapper {
314
  border-radius: 0 0 $border-radius-base $border-radius-base;
315
  .panel-body {
316
    padding: 7px;
317
  }
318
  .form-type-select {
319
    min-width: 30%;
320
    .filter-list {
321
      width: 100%;
322
    }
323
  }
324
}
325
.filter-help {
326
  margin-top: 5px;
327
  text-align: center;
328
  @media #{$tablet} {
329
    float: right;
330
  }
331
  .glyphicon {
332
    margin: 0 5px 0 0;
333
    vertical-align: text-top;
334
  }
335
}
336
.radio, .checkbox {
337
  &:first-child {
338
    margin-top: 0;
339
  }
340
  &:last-child {
341
    margin-bottom: 0;
342
  }
343
}
344
.help-block, .control-group .help-inline {
345
  color: $gray-light;
346
  font-size: 12px;
347
  margin: 5px 0 10px;
348
  padding: 0;
349
}
350
.panel-heading {
351
  display: block;
352
}
353
a.tabledrag-handle .handle {
354
  height: auto;
355
  width: auto;
356
}
357

    
358
// Error containers.
359
.error {
360
  color: $state-danger-text;
361
}
362
div.error,
363
table tr.error {
364
  background-color: $state-danger-bg;
365
  color: $state-danger-text;
366
}
367
.form-group.error,
368
.form-group.has-error {
369
  background: none;
370
  label, .control-label {
371
    color: $state-danger-text;
372
    font-weight: 600;
373
  }
374
  input, textarea, select, .uneditable-input {
375
    color: $input-color;
376
  }
377
  .help-block, .help-inline {
378
    color: $text-muted;
379
  }
380
}
381

    
382
// Lists
383
.nav-tabs {
384
  margin-bottom: 10px;
385
}
386
ul li.collapsed,
387
ul li.expanded,
388
ul li.leaf {
389
  list-style: none;
390
  list-style-image: none;
391
}
392
.tabs--secondary {
393
  margin: 0 0 10px;
394
}
395

    
396
// Submitted
397
.submitted {
398
  margin-bottom: 1em;
399
  font-style: italic;
400
  font-weight: normal;
401
  color: #777;
402
}
403

    
404
// Password strength/match.
405
.form-type-password-confirm {
406
  position: relative;
407
  label {
408
    display: block;
409
    .label {
410
      float: right;
411
    }
412
  }
413
  .password-help {
414
    padding-left: 2em;
415
    @media (min-width: $screen-sm-min) {
416
      border-left: 1px solid $table-border-color;
417
      left: percentage((6/12));
418
      margin-left: ($grid-gutter-width / 2);
419
      position: absolute;
420
    }
421
    @media (min-width: $screen-md-min) {
422
      left: percentage((4/12));
423
    }
424
  }
425
  .progress {
426
    background: transparent;
427
    -moz-border-radius: 0 0 5px 5px;
428
    -webkit-border-radius: 0 0 5px 5px;
429
    border-radius: 0 0 5px 5px;
430
    @include box-shadow(none);
431
    height: 4px;
432
    margin: -5px 0px 0;
433
  }
434
  .form-type-password {
435
    clear: left;
436
  }
437
  .form-control-feedback {
438
    right: 15px;
439
  }
440
  .help-block {
441
    clear: both;
442
  }
443
}
444

    
445
// Views AJAX pager.
446
ul.pagination li > a {
447
  &.progress-disabled {
448
    float: left;
449
  }
450
}
451

    
452
// Autocomplete and throbber
453
.form-autocomplete {
454
  .glyphicon {
455
    color: $gray-light;
456
    font-size: 120%;
457
    &.glyphicon-spin {
458
      color: $brand-primary;
459
    }
460
  }
461
  .input-group-addon {
462
    background-color: rgb(255, 255, 255);
463
  }
464
}
465

    
466
// AJAX "Progress bar".
467
.ajax-progress-bar {
468
  border-radius: 0 0 $border-radius-base $border-radius-base;
469
  border: 1px solid $input-group-addon-border-color;
470
  margin: -1px 0 0;
471
  padding: $padding-base-vertical $padding-base-horizontal;
472
  width: 100%;
473
  .progress {
474
    height: 8px;
475
    margin: 0;
476
  }
477
  .percentage,
478
  .message {
479
    color: $text-muted;
480
    font-size: $font-size-small;
481
    line-height: 1em;
482
    margin: 5px 0 0;
483
    padding: 0;
484
  }
485
}
486

    
487
.glyphicon-spin {
488
  display: inline-block;
489
  -moz-animation: spin 1s infinite linear;
490
  -o-animation: spin 1s infinite linear;
491
  -webkit-animation: spin 1s infinite linear;
492
  animation: spin 1s infinite linear;
493
}
494
a .glyphicon-spin {
495
  display: inline-block;
496
  text-decoration: none;
497
}
498
@-moz-keyframes spin {
499
  0% {
500
    -moz-transform: rotate(0deg);
501
  }
502
  100% {
503
    -moz-transform: rotate(359deg);
504
  }
505
}
506
@-webkit-keyframes spin {
507
  0% {
508
    -webkit-transform: rotate(0deg);
509
  }
510
  100% {
511
    -webkit-transform: rotate(359deg);
512
  }
513
}
514
@-o-keyframes spin {
515
  0% {
516
    -o-transform: rotate(0deg);
517
  }
518
  100% {
519
    -o-transform: rotate(359deg);
520
  }
521
}
522
@-ms-keyframes spin {
523
  0% {
524
    -ms-transform: rotate(0deg);
525
  }
526
  100% {
527
    -ms-transform: rotate(359deg);
528
  }
529
}
530
@keyframes spin {
531
  0% {
532
    transform: rotate(0deg);
533
  }
534
  100% {
535
    transform: rotate(359deg);
536
  }
537
}
538

    
539
/**
540
 * Missing Bootstrap 2 tab styling.
541
 * @see http://stackoverflow.com/questions/18432577/stacked-tabs-in-bootstrap-3
542
 * @see http://bootply.com/74926
543
 */
544
.tabbable {
545
  margin-bottom: 20px;
546
}
547
.tabs-below, .tabs-left, .tabs-right {
548
  > .nav-tabs {
549
    border-bottom: 0;
550
    .summary {
551
      color: $nav-disabled-link-color;
552
      font-size: $font-size-small;
553
    }
554
  }
555
}
556
.tab-pane > .panel-heading {
557
  display: none;
558
}
559
.tab-content > .active {
560
  display: block;
561
}
562

    
563
// Below.
564
.tabs-below {
565
  > .nav-tabs {
566
    border-top: 1px solid $nav-tabs-border-color;
567
    > li {
568
      margin-top: -1px;
569
      margin-bottom: 0;
570
      > a {
571
        border-radius: 0 0 $border-radius-base $border-radius-base;
572
        &:hover,
573
        &:focus {
574
          border-top-color: $nav-tabs-border-color;
575
          border-bottom-color: transparent;
576
        }
577
      }
578
    }
579
    > .active {
580
      > a,
581
      > a:hover,
582
      > a:focus {
583
        border-color: transparent $nav-tabs-border-color $nav-tabs-border-color $nav-tabs-border-color;
584
      }
585
    }
586
  }
587
}
588

    
589
// Left and right tabs.
590
.tabs-left,
591
.tabs-right {
592
  > .nav-tabs {
593
    padding-bottom: 20px;
594
    width: 220px;
595
    > li {
596
      float: none;
597
      &:focus {
598
        outline: 0;
599
      }
600
      > a {
601
        margin-right: 0;
602
        margin-bottom: 3px;
603
        &:focus {
604
          outline: 0;
605
        }
606
      }
607
    }
608
  }
609
  > .tab-content {
610
    border-radius: 0 $border-radius-base $border-radius-base $border-radius-base;
611
    @include box-shadow(0 1px 1px rgba(0,0,0,.05));
612
    border: 1px solid $nav-tabs-border-color;
613
    overflow: hidden;
614
    padding: 10px 15px;
615
  }
616
}
617

    
618
// Left tabs.
619
.tabs-left {
620
  > .nav-tabs {
621
    float: left;
622
    margin-right: -1px;
623
    > li > a {
624
      border-radius: $border-radius-base 0 0 $border-radius-base;
625
      &:hover,
626
      &:focus {
627
        border-color: $nav-tabs-link-hover-border-color $nav-tabs-border-color $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color;
628
      }
629
    }
630
    > .active > a,
631
    > .active > a:hover,
632
    > .active > a:focus {
633
      border-color: $nav-tabs-border-color transparent $nav-tabs-border-color $nav-tabs-border-color;
634
      @include box-shadow(-1px 1px 1px rgba(0,0,0,.05));
635
    }
636
  }
637
}
638

    
639
// Right tabs.
640
.tabs-right {
641
  > .nav-tabs {
642
    float: right;
643
    margin-left: -1px;
644
    > li > a {
645
      border-radius: 0 $border-radius-base $border-radius-base 0;
646
      &:hover,
647
      &:focus {
648
        border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
649
        @include box-shadow(1px 1px 1px rgba(0,0,0,.05));
650
      }
651
    }
652
    > .active > a,
653
    > .active > a:hover,
654
    > .active > a:focus {
655
      border-color: $nav-tabs-border-color $nav-tabs-border-color $nav-tabs-border-color transparent;
656
    }
657
  }
658
}
659

    
660
// Checkbox cell fix.
661
th.checkbox,
662
td.checkbox,
663
th.radio,
664
td.radio {
665
  display: table-cell;
666
}
667

    
668
// Views UI fixes.
669
.views-display-settings {
670
  .label {
671
    font-size: 100%;
672
    color:#666666;
673
  }
674
  .footer {
675
    padding:0;
676
    margin:4px 0 0 0;
677
  }
678
}
679
.views-exposed-form .views-exposed-widget .btn {
680
  margin-top: 1.8em;
681
}
682

    
683
// Radio and checkbox in table fixes
684
table {
685
  .radio input[type="radio"],
686
  .checkbox input[type="checkbox"] {
687
    max-width: inherit;
688
  }
689
}
690

    
691
// Exposed filters
692
.form-horizontal .form-group label {
693
  position: relative;
694
  min-height: 1px;
695
  margin-top: 0;
696
  margin-bottom: 0;
697
  padding-top: 7px;
698
  padding-left:  ($grid-gutter-width / 2);
699
  padding-right: ($grid-gutter-width / 2);
700
  text-align: right;
701

    
702
  @media (min-width: $screen-sm-min) {
703
    float: left;
704
    width: percentage((2 / $grid-columns));
705
  }
706
}
707

    
708
// Treat all links inside alert as .alert-link
709
.alert a {
710
  font-weight: $alert-link-font-weight;
711
}
712
.alert-success {
713
  a, a:hover, a:focus {
714
    color: darken($alert-success-text, 10%);
715
  }
716
}
717
.alert-info {
718
  a, a:hover, a:focus {
719
    color: darken($alert-info-text, 10%);
720
  }
721
}
722
.alert-warning {
723
  a, a:hover, a:focus {
724
    color: darken($alert-warning-text, 10%);
725
  }
726
}
727
.alert-danger {
728
  a, a:hover, a:focus {
729
    color: darken($alert-danger-text, 10%);
730
  }
731
}
732

    
733
// Override image module.
734
div.image-style-new,
735
div.image-style-new div {
736
  display: block;
737
}
738
div.image-style-new div.input-group {
739
  display: table;
740
}
741

    
742
td.module,
743
.table-striped>tbody>tr:nth-child(odd)>td.module,
744
.table>tbody>tr>td.module {
745
  background: $table-border-color;
746
  font-weight: 700;
747
}
748

    
749
// Book module.
750
.book-toc > .dropdown-menu {
751
  overflow: hidden;
752
  > .dropdown-header {
753
    white-space: nowrap;
754
  }
755
  > li:nth-child(1) > a {
756
    font-weight: bold;
757
  }
758
  .dropdown-menu {
759
    @include box-shadow(none);
760
    border: 0;
761
    display: block;
762
    font-size: $font-size-small;
763
    margin: 0;
764
    padding: 0;
765
    position: static;
766
    width: 100%;
767
    > li {
768
      padding-left: 20px;
769
      > a {
770
        margin-left: -40px;
771
        padding-left: 60px;
772
      }
773
    }
774
  }
775
}
776

    
777
// Features module.
778
#features-filter .form-item.form-type-checkbox {
779
  padding-left: 20px;
780
}
781
fieldset.features-export-component {
782
  font-size: $font-size-small;
783
  html.js #features-export-form &, & {
784
    margin: 0 0 ($line-height-computed / 2);
785
  }
786
  .panel-heading {
787
    padding: 5px 10px;
788
    a.panel-title {
789
      font-size: $font-size-small;
790
      font-weight: 500;
791
      margin: -5px -10px;
792
      padding: 5px 10px;
793
    }
794
  }
795
  .panel-body {
796
    padding: 0 10px;
797
  }
798
}
799
div.features-export-list {
800
  margin: -11px 0 10px;
801
  padding: 0 10px;
802
}
803

    
804
fieldset.features-export-component .component-select ,
805
div.features-export-list {
806
  .form-type-checkbox {
807
    line-height: 1em;
808
    margin: 5px 5px 5px 0 !important;
809
    min-height: 0;
810
    padding: 3px 3px 3px 25px!important;
811
    input[type=checkbox] {
812
      margin-top: 0;
813
    }
814
  }
815
}
816

    
817
// Navbar module.
818
body.navbar-is-fixed-top.navbar-administration.navbar-horizontal.navbar-tray-open .navbar-fixed-top {
819
  top: 79px;
820
}
821
body.navbar-is-fixed-top.navbar-administration .navbar-fixed-top {
822
  top: 39px;
823
}
824
/* Small devices (tablets, 768px and up) */
825
@media (min-width: $screen-sm-min) {
826
  body.navbar-is-fixed-top.navbar-administration.navbar-vertical.navbar-tray-open .navbar-fixed-top {
827
    left: 240px;
828
    left: 24rem;
829
  }
830
}
831
.navbar-administration #navbar-administration.navbar-oriented .navbar-bar{
832
  z-index: 1032;
833
}
834
.navbar-administration #navbar-administration .navbar-tray {
835
  z-index: 1031;
836
}
837
body.navbar-is-fixed-top.navbar-administration {
838
  padding-top: 103px!important;
839
}
840
body.navbar-is-fixed-top.navbar-administration.navbar-horizontal.navbar-tray-open {
841
  padding-top: 143px!important;
842
}
843
body.navbar-tray-open.navbar-vertical.navbar-fixed {
844
  margin-left: 240px;
845
  margin-left: 24rem;
846
}
847
#navbar-administration.navbar-oriented .navbar-tray-vertical {
848
  width: 24rem;
849
}
850

    
851
/**
852
 * Icon styles.
853
 */
854
a {
855
  &.icon-before .glyphicon {
856
    margin-right: .25em;
857
  }
858
  &.icon-after .glyphicon {
859
    margin-left: .25em;
860
  }
861
}
862

    
863
.btn {
864
  &.icon-before .glyphicon {
865
    margin-left: -.25em;
866
    margin-right: .25em;
867
  }
868
  &.icon-after .glyphicon {
869
    margin-left: .25em;
870
    margin-right: -.25em;
871
  }
872
}