Subversion Repositories eFlore/Applications.cel

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
3312 idir 1
@CHARSET "UTF-8";
2
 
3
body {
4
  font-family: Muli,sans-serif;
5
  font-size: 0.8rem;
6
  font-weight: 300;
7
}
8
 
9
#zone-appli {
10
  padding: 2rem;
11
  border-radius: 0.3rem;
12
  background-color: rgba(255, 255, 255, 0.9);
13
  margin-top: 2rem;
14
}
15
 
16
#zone-appli .zone-alerte{
17
  width: 100%;
18
}
19
 
20
#logo {
21
  max-width: 100%;
22
}
23
 
24
h1, h2, h3, h4, h5 {
25
  font-family: Muli,sans-serif;
26
  color: #606060;
27
  font-weight: 700;
28
}
29
 
30
form {
31
  font-family: Muli,sans-serif;
32
  float: none;
33
}
34
 
35
h1 {
36
  font-weight: 700;
37
  font-size: 2rem;
38
}
39
 
40
#zone-appli .form-block {
41
  margin-bottom: 2rem;
42
}
43
 
44
h2 {
45
  font-weight: 700;
46
  line-height: 1.15;
47
  font-size: 1.5rem;
48
}
49
 
50
h3 {
51
  font-size: 1.2rem;
52
}
53
 
54
ul {
55
  padding-inline-start: 0;
56
}
57
 
58
#zone-appli .obligatoire::before {
59
  content: '*';
60
  position: absolute;
61
  left: 0;
62
}
63
 
64
.btn.focus,
65
.btn:focus {
66
  box-shadow: none;
67
}
68
 
69
.btn.btn-primary,
70
.btn.btn-info,
71
.btn.btn-success,
72
.btn.btn-danger,
73
.btn.btn-inverse {
74
  color: #fff !important;
75
}
76
 
77
.btn.btn-primary,
78
.btn.btn-info,
79
.btn.btn-success,
80
.btn.btn-danger,
81
.btn.btn-inverse,
82
.btn.btn-outline-primary,
83
.btn.btn-outline-info,
84
.btn.btn-outline-success,
85
.btn.btn-outline-danger,
86
.btn.btn-outline-inverse {
87
  border-radius: 0.15rem;
88
}
89
 
90
button {
91
  -moz-border-bottom-colors: none;
92
  -moz-border-left-colors: none;
93
  -moz-border-right-colors: none;
94
  -moz-border-top-colors: none;
95
  background-color: #a2b93b;
96
  border-bottom-color: currentcolor;
97
  border-bottom-left-radius: 0.2rem;
98
  border-bottom-right-radius: 0.2rem;
99
  border-bottom-style: none;
100
  border-bottom-width: 0;
101
  border-image-outset: 0 0 0 0;
102
  border-image-repeat: stretch stretch;
103
  border-image-slice: 100% 100% 100% 100%;
104
  border-image-source: none;
105
  border-image-width: 1 1 1 1;
106
  border-left-color: currentcolor;
107
  border-left-style: none;
108
  border-left-width: 0;
109
  border-right-color: currentcolor;
110
  border-right-style: none;
111
  border-right-width: 0;
112
  border-top-color: currentcolor;
113
  border-top-left-radius: 0.2rem;
114
  border-top-right-radius: 0.2rem;
115
  border-top-style: none;
116
  border-top-width: 0;
117
  color: #fff;
118
  cursor: pointer;
119
  display: inline-block;
120
  font-family: Ubuntu,sans-serif;
121
  font-size: 1.3rem;
122
  font-weight: 500;
123
  letter-spacing: 0.1rem;
124
  line-height: 1.5rem;
125
  padding-bottom: 1.25rem;
126
  padding-left: 2rem;
127
  padding-right: 2rem;
128
  padding-top: 1.25rem;
129
  text-align: center;
130
  text-decoration-color: currentcolor;
131
  text-decoration-line: none;
132
  text-decoration-style: solid;
133
  text-transform: uppercase;
134
  transition-delay: 0s;
135
  transition-duration: 0.2s;
136
  transition-property: background;
137
  transition-timing-function: ease;
138
}
139
 
140
.table tr,
141
.table td,
142
.table th,
143
.table thead {
144
  border: none !important;
145
}
146
 
147
.mb2,
148
.mb-3 {
149
  align-self: start;
150
}
151
 
152
label,
153
#zone-appli  .list-label {
154
  color: #606060;
155
  display: block;
156
  font-size: 0.9rem;
157
  font-weight: 700;
158
}
159
 
160
#zone-appli .form-inline label,
161
#zone-appli .form-inline .list-label {
162
  align-items: start;
163
  align-self: start;
164
  justify-content: left;
165
  align-content: flex-start;
166
}
167
 
168
h1#widget-titre::before {
169
  content: "";
170
  display: block;
171
  height: 100%;
172
  left: -5rem;
173
  position: absolute;
174
  width: 0.4rem;
175
}
176
 
177
h1#widget-titre {
178
  font-size: 2.6rem;
179
  font-weight: 700;
180
  line-height: 3.2rem;
181
  margin-bottom: 0;
182
  margin-left: 0;
183
  margin-right: 0;
184
  margin-top: 0;
185
  position: relative;
186
  color: #232323;
187
  font-family: Ubuntu,sans-serif;
188
}
189
 
190
#zone-appli .hidden {
191
  display: none !important;
192
}
193
 
194
#zone-appli .warning {
195
  color: #ff5d55;
196
  font-weight: 700;
197
}
198
 
199
#photos-conteneur label.label-file.error,
200
.control-group.error #connexion,
201
.control-group.error #bouton-inscription,
202
.control-group.error #bouton-anonyme,
203
.control-group.error .geoloc,
204
.control-group.error input,
205
.control-group.error select,
206
.control-group.error textarea,
207
.obs-erreur,
208
#releve-date.erreur {
209
  box-shadow: 0 0 1.5px 1px red;
210
  border-color: #b94a48;
211
  color: #b94a48;
212
}
213
 
214
.control-group .erreur,
215
.control-group.error,
216
span.error {
217
  color: #b94a48 !important;
218
}
219
 
220
#zone-appli .centre {
221
  margin: 0 auto !important;
222
  justify-content: center !important;
223
}
224
 
225
#zone-appli .droite {
226
  float: right;
227
}
228
 
229
#zone-appli .info {
230
  padding: 1rem;
231
  background-color: #ccecf1;
232
  border-color: #7ccedb;
233
  color: #006979;
234
  fill: #006979;
235
  border-radius: 0.2rem;
236
}
237
 
238
#zone-appli .clear {
239
  clear: both;
240
  height: 0; overflow: hidden; /* Précaution pour IE 7 */
241
}
242
 
243
#zone-appli .ui-widget{
244
  font-family: Muli,sans-serif;
245
}
246
 
247
#zone-appli .form-inline .form-control {
248
  width: 100%;
249
}
250
 
251
#zone-appli #logo_hires {
252
  display: none;
253
}
254
#zone-appli .logo-tb {
255
  position:absolute;
256
  left: 10px;
257
  top: 10px;
258
}
259
 
260
#zone-appli .bloc-top {
261
  border-top: 1px solid rgba(0,0,0,.1);
262
  padding-top: 1rem;
263
}
264
 
265
#zone-appli .bloc-bottom {
266
  border-bottom: 1px solid rgba(0,0,0,.1);
267
  padding-bottom: 1rem;
268
}
269
 
270
.unstyled {
271
  list-style-type: none;
272
}
273
 
274
#zone-appli #formulaire form {
275
  margin-bottom: 1.5rem;
276
}
277
 
278
input[type="checkbox"],
279
input[type="radio"],
280
input.radio,
281
input.checkbox {
282
  vertical-align:text-top;
283
  padding: 0;
284
  margin-right: 10px;
285
  position:relative;
286
  overflow:hidden;
287
  top:2px;
288
}
289
 
290
#zone-appli #formulaire #form-supp #zone-supp .checkbox label,
291
#zone-appli #formulaire #form-supp #zone-supp .checkboxes label,
292
#zone-appli #formulaire #form-supp #zone-supp .radio label {
293
  align-items: center;
294
  display: flex;
295
  font-weight: 400;
296
}
297
 
298
/*************************************************************************/
299
 
300
form#form-observateur,
301
form#form-observation,
302
form#form-supp,
303
#tb-navigation,
304
#tb-navbar{
305
  min-width: 100%;
306
  margin-left: 0;
307
  margin-right: 0;
308
}
309
 
310
.nav {
311
  display: -ms-flexbox;
312
  display: flex;
313
  -ms-flex-wrap: wrap;
314
  flex-wrap: wrap;
315
  margin-right: -15px;
316
  margin-left: -15px;
317
  flex-direction: row;
318
}
319
 
320
#tb-navbar {
321
  margin-bottom: 0;
322
}
323
 
324
.volet {
325
  height: 5rem;
326
}
327
 
328
#anonyme {
329
  height: auto;
330
}
331
 
332
#bouton-connexion,
333
#creation-compte {
334
  display: -ms-flexbox;
335
  display: flex;
336
  height: 5rem;
337
  -webkit-box-flex: 1;
338
  -webkit-flex: 0 0 50%;
339
  -ms-flex: 0 0 50%;
340
  flex: 0 0 50%;
341
  max-width: 50%;
342
  -ms-flex-flow: row wrap;
343
  flex-flow: row wrap;
344
  min-height: 1px;
345
  padding-right: 15px;
346
  padding-left: 15px;
347
  justify-content: left;
348
  align-items: flex-start;
349
  align-content: flex-middle;
350
}
351
 
352
.nav > .volet #bouton-anonyme,
353
.nav > .volet #bouton-inscription {
354
  width: auto;
355
}
356
 
357
.nav > .volet > a  {
358
  margin-left: 0.2rem;
359
}
360
 
361
#bouton-poursuivre,
362
.charger-releve,
363
#soumettre-releve,
364
#connexion,
365
#ajouter-obs,
366
#transmettre-obs {
367
  color: #fff;
368
  background-color: #b2cb43;
369
  border: none;
370
  border-radius: 0.1rem;
371
}
372
 
373
#bouton-poursuivre:focus,
374
#bouton-poursuivre:hover,
375
.charger-releve:focus,
376
.charger-releve:hover,
377
#soumettre-releve:focus,
378
#soumettre-releve:hover,
379
#connexion:focus,
380
#connexion:hover,
381
#transmettre-obs:focus,
382
#transmettre-obs:hover,
383
#ajouter-obs:focus,
384
#ajouter-obs:hover {
385
  background-color: #a2b93b;
386
  border: none;
387
}
388
 
389
#utilisateur-connecte.volet {
390
  padding-left: 2rem;
391
}
392
 
393
#utilisateur-connecte.volet > a {
394
  margin-left: 0;
395
}
396
 
397
#utilisateur-connecte.volet #profil-utilisateur,
398
#utilisateur-connecte.volet #deconnexion {
399
  padding: 0 0.75rem;
400
  margin: 0.2rem 0;
401
}
402
 
403
#utilisateur-connecte.volet .volet-menu a {
404
  font-size: 0.8rem;
405
  font-weight: 400;
406
  color: #606060;
407
  background: inherit;
408
  text-decoration: none;
409
  display: block;
410
  width: 100%;
411
  padding-left: 5px;
412
  line-height: 25px;
413
  outline: 0;
414
}
415
 
416
#utilisateur-connecte.volet #profil-utilisateur:hover,
417
#utilisateur-connecte.volet #deconnexion:hover,
418
#utilisateur-connecte.volet #profil-utilisateur:focus,
419
#utilisateur-connecte.volet #deconnexion:focus {
420
  background: #b2cb43;
421
}
422
 
423
#utilisateur-connecte.volet .volet-menu a:hover,
424
#utilisateur-connecte.volet .volet-menu a:focus {
425
  color: #fff;
426
}
427
 
428
#utilisateur-connecte .volet-menu {
429
  position: absolute;
430
  z-index: 1000;
431
  min-width: auto;
432
  list-style: none;
433
  background-color: #fff;
434
  border: 1px solid #ccc;
435
  border: 1px solid rgba(0, 0, 0, 0.15);
436
  border-radius: 4px;
437
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
438
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
439
}
440
 
441
.volet-menu div a {
442
  color: #222;
443
}
444
 
445
#utilisateur-connecte .volet-toggle::after {
446
  font-family: "Font Awesome 5 Free";
447
  font-size: 0.8rem;
448
  font-weight: 900;
449
  content: '\f0d7'
450
}
451
 
452
.releve-info {
453
  font-size: 0.8rem;
454
}
455
 
456
/*************************************************************************/
457
 
458
#zone-appli #formulaire #form-supp #zone-supp .multiselect.list-checkbox {
459
  padding: 0;
460
  margin: 0;
461
}
462
 
463
#zone-appli #formulaire #form-supp #zone-supp select,
464
#zone-appli #formulaire #form-supp #zone-supp .selectBox select {
465
  background-color: #fff;
466
  border: 1px solid #ced4da;
467
}
468
 
469
#form-supp select,
470
#form-supp .selectBox select{
471
  border-radius: 0.3rem;
472
}
473
 
474
#form-supp .select-wrapper,
475
#zone-appli #formulaire #form-supp #zone-supp .selectBox {
476
  position: relative;
477
  z-index: 1000;
478
  border-radius: 0.3rem;
479
}
480
 
481
#zone-appli #formulaire #form-supp #zone-supp .selectBox .focus {
482
  border-color: #80bdff;
483
  box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
484
}
485
 
486
#zone-appli #formulaire #form-supp #zone-supp .input-group .select-wrapper {
487
  border:none;
488
}
489
 
490
#zone-appli #formulaire #form-supp #zone-supp .overSelect {
491
  position: absolute;
492
  z-index: 999;
493
  left: 0;
494
  right: 0;
495
  top: 0;
496
  bottom: 0;
497
}
498
 
499
#zone-appli #formulaire #form-supp #zone-supp .checkboxes {
500
  position: absolute;
501
  z-index: 1001;
502
  top: 120%;
503
  left: 1rem;
504
  right: 1rem;
505
  background-color: #fff;
506
  border: 1px solid #ced4da;
507
  border-top: 0;
508
  border-radius: 0 0 0.3rem 0.3rem;
509
  margin-top: -0.3rem;
510
}
511
 
512
#zone-appli #formulaire #form-supp #zone-supp .label label,
513
#zone-appli #formulaire #form-supp #zone-supp .checkboxes label {
514
  display: block;
515
  padding: 0.5rem;
516
  font-weight: 400;
517
  margin:0;
518
}
519
 
520
#zone-appli #formulaire #form-supp #zone-supp .checkboxes label:hover {
521
  background: #1e90ff;
522
  color: #fff;
523
}
524
 
525
#zone-appli #formulaire #form-supp #zone-supp .selectBox select option {
526
  padding-block-start: 0;
527
  padding-block-end: 0;
528
  padding-inline-start: 0;
529
  padding-inline-end: 0;
530
}
531
 
532
#zone-appli #formulaire #form-supp #zone-supp .collect-other {
533
  margin: 0.5rem;
534
  width: 90%;
535
}
536
 
537
/*************************************************************************/
538
 
539
.range-values {
540
  color: #606060;
541
}
542
 
543
.range-live-value {
544
  padding-top: 1rem;
545
  font-size: 1rem;
546
}
547
 
548
/*******************************************/
549
 
550
.label-file {
551
  overflow: hidden;
552
  position: relative;
553
  cursor: pointer;
554
  border-radius: 0.25rem;
555
  font-weight: 400;
556
  font-size: 0.9rem;
557
  text-align: center;
558
  white-space: nowrap;
559
  vertical-align: middle;
560
  -webkit-user-select: none;
561
  -moz-user-select: none;
562
  -ms-user-select: none;
563
  user-select: none;
564
  border: 1px solid transparent;
565
  padding: .375rem .75rem;
566
  line-height: 1.5;
567
  transition:
568
    color .15s ease-in-out,
569
    background-color .15s ease-in-out,
570
    border-color .15s ease-in-out,
571
    box-shadow .15s ease-in-out;
572
  margin: 0;
573
}
574
 
575
.label-file [type=file] {
576
  cursor: inherit;
577
  display: block;
578
  font-size: 999px;
579
  filter: alpha(opacity=0);
580
  min-height: 100%;
581
  min-width: 100%;
582
  opacity: 0;
583
  position: absolute;
584
  right: 0;
585
  text-align: right;
586
  top: 0;
587
}
588
 
589
.label-file [type=file] {
590
  cursor: pointer;
591
}
592
 
593
/*************************************/
594
 
595
#miniatures .miniature {
596
  position: relative;
597
  display: inline-block;
598
 
599
}
600
 
601
#miniatures .miniature .miniature-img {
602
  vertical-align: top;
603
  width: 5rem;
604
  height: 100%;
605
}
606
 
607
#miniatures .miniature .effacer-miniature {
608
  display: flex;
609
  position: absolute;
610
  left: 0;
611
  right: 0;
612
  top: 0;
613
  bottom: 0;
614
  font-size: 2rem;
615
  background-color: rgba(0, 0, 0, 0.3);
616
  opacity: 0;
617
  color: #ff5d55;
618
  padding: 0;
619
  margin: 0;
620
  height: 100%;
621
  width: 100%;
622
  align-items:center;
623
  justify-content: center;
624
  cursor: pointer;
625
}
626
 
627
#miniatures .miniature .effacer-miniature:hover,
628
#miniatures .miniature .effacer-miniature:focus {
629
  opacity: 1;
630
}
631
 
632
.obs {
633
  height: 10rem;
634
  padding: 1rem;
635
  border-radius: 0.25rem;
636
  background-color: #fbfbfb;
637
  border: 1px solid #eee;
638
}
639
 
640
.obs .nom-sci {
641
  font-size: 1rem;
642
}
643
 
644
.defilement-miniatures .defilement-miniatures-cache,
645
.defilement-miniatures .miniature-cachee {
646
  display: none;
647
}
648
 
649
.defilement-miniatures {
650
  display: flex;
651
  align-items:center;
652
  justify-content: center;
653
  height: 8rem;
654
}
655
.defilement-miniatures figure {
656
  display: inline-block;
657
  min-height: 8rem;
658
  line-height: 8rem;
659
  text-align: center;
660
  min-width: 80%;
661
  width: 80%;
662
  margin:0 auto;
663
  padding: 0;
664
}
665
 
666
.miniature-selectionnee {
667
  vertical-align: middle;
668
  max-height: 8rem;
669
  max-width: 80%;
670
}
671
 
672
.defilement-miniatures-gauche,
673
.defilement-miniatures-droite {
674
  display: inline-block;
675
  color: #5bc0de;
676
  vertical-align: middle;
677
  outline-style: none;
678
}
679
 
680
.defilement-miniatures-gauche:active,
681
.defilement-miniatures-droite:active,
682
.defilement-miniatures-gauche:focus,
683
.defilement-miniatures-droite:focus {
684
  color: #499fb7;
685
}
686
 
687
.defilement-miniatures-gauche:hover,
688
.defilement-miniatures-droite:hover {
689
  color: #499fb7;
690
}
691
 
692
#zone-prenom-nom #prenom,
693
#zone-prenom-nom #nom {
694
  z-index: 0;
695
}
696
 
697
#transmettre-obs{
698
  text-align: right;
699
}
700
 
701
#zone-liste-obs h2.transmission-title {
702
  display: inline-block;
703
}
704
 
705
footer a {
706
  display: inline-block;
707
}
708
 
709
.help-button {
710
  float: right;
711
}
712
 
713
#image-fond {
714
  position: fixed;
715
  top:0;
716
  bottom: 0;
717
  left: 0;
718
  right: 0;
719
  z-index: -1;
720
  min-width: 100%;
721
  background-attachment: fixed;
722
  margin: 0;
723
  padding: 0;
724
}
725
 
726
.modal-open, body.modal-open {
727
  overflow: inherit !important;
728
}
729
 
730
.custom-range {
731
  border: none;
732
}
733
 
734
/*************************************/
735
#charger-form,
736
#zone-arbres,
737
#zone-plantes,
738
#zone-lichens {
739
  min-width: 100%;
740
}
741
 
742
/*volet autocompletion des taxons*/
743
.ui-autocomplete {
744
  z-index: 1000 !important;
745
}
746
 
747
 
748
/*************************************/
749
 
750
@media screen and ( max-width: 768px ) {
751
 
752
  #titre-projet {
753
    font-size: 1.5rem;
754
  }
755
 
756
  h2 {
757
    font-size: 1.3rem;
758
  }
759
 
760
  #logo {
761
    max-width: 80%;
762
  }
763
 
764
  #bouton-connexion, #creation-compte {
765
    display: block;
766
    width: 100%;
767
    position: static;
768
  }
769
 
770
  .nav {
771
    flex-direction: column;
772
  }
773
 
774
  #transmettre-obs.droite {
775
    float: none;
776
  }
777
 
778
  .obs {
779
    height: auto;
780
  }
781
 
782
  .obs .unstyled {
783
    font-size: 0.6rem;
784
  }
785
 
786
  .obs .nom-sci {
787
    font-size: 0.8rem;
788
  }
789
 
790
  .supprimer-obs {
791
    overflow: hidden;
792
  }
793
 
794
  #image-fond {
795
    display: none;
796
  }
797
}
798
 
799