Projet

Général

Profil

Paste
Télécharger (15,8 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / themes / bootstrap / starterkits / less / less / overrides.less @ 4eeb3b46

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

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

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

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

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

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

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

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

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

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

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

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

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

    
229
  .input-group-btn {
230
    width: auto;
231
  }
232
}
233

    
234
// Action Links
235
ul.action-links {
236
  margin: @padding-base-horizontal 0;
237
  padding: 0;
238
  li {
239
    display: inline;
240
    margin: 0;
241
    padding: 0 @padding-base-vertical 0 0;
242
  }
243
  .glyphicon {
244
    padding-right: 0.5em;
245
  }
246
}
247

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

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

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

    
392
// Submitted
393
.submitted {
394
  margin-bottom: 1em;
395
  font-style: italic;
396
  font-weight: normal;
397
  color: #777;
398
}
399

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

    
441
// Views AJAX pager.
442
ul.pagination li > a {
443
  &.progress-disabled {
444
    float: left;
445
  }
446
}
447

    
448
// Autocomplete and throbber
449
.form-autocomplete {
450
  .glyphicon {
451
    color: @gray-light;
452
    font-size: 120%;
453
    &.glyphicon-spin {
454
      color: @brand-primary;
455
    }
456
  }
457
  .input-group-addon {
458
    background-color: rgb(255, 255, 255);
459
  }
460
  .dropdown a {
461
    white-space: normal;
462
  }
463
}
464

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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