framework7_rails 1.4.0 → 1.6.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (37) hide show
  1. checksums.yaml +4 -4
  2. data/framework7_rails.gemspec +1 -1
  3. data/lib/framework7_rails/version.rb +1 -1
  4. data/vendor/assets/fonts/Framework7Icons-Regular.eot +0 -0
  5. data/vendor/assets/fonts/Framework7Icons-Regular.ttf +0 -0
  6. data/vendor/assets/fonts/Framework7Icons-Regular.woff +0 -0
  7. data/vendor/assets/fonts/Framework7Icons-Regular.woff2 +0 -0
  8. data/vendor/assets/javascripts/framework7.js +3404 -1673
  9. data/vendor/assets/javascripts/framework7.js.map +1 -1
  10. data/vendor/assets/stylesheets/framework7-icons.css +31 -0
  11. data/vendor/assets/stylesheets/framework7.ios.colors.css +1784 -629
  12. data/vendor/assets/stylesheets/framework7.ios.css +2176 -230
  13. data/vendor/assets/stylesheets/framework7.ios.rtl.css +158 -5
  14. data/vendor/assets/stylesheets/framework7.material.colors.css +4738 -2841
  15. data/vendor/assets/stylesheets/framework7.material.css +2070 -331
  16. data/vendor/assets/stylesheets/framework7.material.rtl.css +128 -5
  17. metadata +8 -23
  18. data/vendor/assets/images/i-form-calendar-ios.svg +0 -16
  19. data/vendor/assets/images/i-form-calendar-material.svg +0 -4
  20. data/vendor/assets/images/i-form-comment-ios.svg +0 -10
  21. data/vendor/assets/images/i-form-comment-material.svg +0 -4
  22. data/vendor/assets/images/i-form-email-ios.svg +0 -13
  23. data/vendor/assets/images/i-form-email-material.svg +0 -4
  24. data/vendor/assets/images/i-form-gender-ios.svg +0 -16
  25. data/vendor/assets/images/i-form-gender-material.svg +0 -8
  26. data/vendor/assets/images/i-form-name-ios.svg +0 -10
  27. data/vendor/assets/images/i-form-name-material.svg +0 -4
  28. data/vendor/assets/images/i-form-password-ios.svg +0 -13
  29. data/vendor/assets/images/i-form-password-material.svg +0 -4
  30. data/vendor/assets/images/i-form-settings-ios.svg +0 -14
  31. data/vendor/assets/images/i-form-settings-material.svg +0 -7
  32. data/vendor/assets/images/i-form-tel-ios.svg +0 -10
  33. data/vendor/assets/images/i-form-tel-material.svg +0 -4
  34. data/vendor/assets/images/i-form-toggle-ios.svg +0 -11
  35. data/vendor/assets/images/i-form-toggle-material.svg +0 -5
  36. data/vendor/assets/images/i-form-url-ios.svg +0 -28
  37. data/vendor/assets/images/i-form-url-material.svg +0 -4
@@ -1,21 +1,22 @@
1
1
  /**
2
- * Framework7 1.4.0
3
- * Full Featured Mobile HTML Framework For Building iOS & Android Apps
4
- *
2
+ * Framework7 1.6.0
3
+ * Full featured mobile HTML framework for building iOS & Android apps
4
+ *
5
5
  * Google Material Theme
6
6
  *
7
- * http://www.idangero.us/framework7
8
- *
9
- * Copyright 2015, Vladimir Kharlampidi
7
+ * http://framework7.io/
8
+ *
9
+ * Copyright 2017, Vladimir Kharlampidi
10
10
  * The iDangero.us
11
11
  * http://www.idangero.us/
12
- *
12
+ *
13
13
  * Licensed under MIT
14
- *
15
- * Released on: December 7, 2015
14
+ *
15
+ * Released on: April 10, 2017
16
16
  */
17
17
  html,
18
- body {
18
+ body,
19
+ .framework7-root {
19
20
  position: relative;
20
21
  height: 100%;
21
22
  width: 100%;
@@ -33,6 +34,9 @@ body {
33
34
  background: #fff;
34
35
  overflow: hidden;
35
36
  }
37
+ .framework7-root {
38
+ overflow: hidden;
39
+ }
36
40
  * {
37
41
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
38
42
  -webkit-touch-callout: none;
@@ -124,6 +128,14 @@ p {
124
128
  .row.no-gutter .col-75 {
125
129
  width: 75%;
126
130
  }
131
+ .row .col-70 {
132
+ width: 70%;
133
+ width: -webkit-calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
134
+ width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
135
+ }
136
+ .row.no-gutter .col-70 {
137
+ width: 70%;
138
+ }
127
139
  .row .col-66 {
128
140
  width: 66.66666666666666%;
129
141
  width: -webkit-calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
@@ -132,6 +144,14 @@ p {
132
144
  .row.no-gutter .col-66 {
133
145
  width: 66.66666666666666%;
134
146
  }
147
+ .row .col-65 {
148
+ width: 65%;
149
+ width: -webkit-calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
150
+ width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
151
+ }
152
+ .row.no-gutter .col-65 {
153
+ width: 65%;
154
+ }
135
155
  .row .col-60 {
136
156
  width: 60%;
137
157
  width: -webkit-calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
@@ -140,6 +160,14 @@ p {
140
160
  .row.no-gutter .col-60 {
141
161
  width: 60%;
142
162
  }
163
+ .row .col-55 {
164
+ width: 55%;
165
+ width: -webkit-calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
166
+ width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
167
+ }
168
+ .row.no-gutter .col-55 {
169
+ width: 55%;
170
+ }
143
171
  .row .col-50 {
144
172
  width: 50%;
145
173
  width: -webkit-calc((100% - 16px*1) / 2);
@@ -148,6 +176,14 @@ p {
148
176
  .row.no-gutter .col-50 {
149
177
  width: 50%;
150
178
  }
179
+ .row .col-45 {
180
+ width: 45%;
181
+ width: -webkit-calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
182
+ width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
183
+ }
184
+ .row.no-gutter .col-45 {
185
+ width: 45%;
186
+ }
151
187
  .row .col-40 {
152
188
  width: 40%;
153
189
  width: -webkit-calc((100% - 16px*1.5) / 2.5);
@@ -156,6 +192,14 @@ p {
156
192
  .row.no-gutter .col-40 {
157
193
  width: 40%;
158
194
  }
195
+ .row .col-35 {
196
+ width: 35%;
197
+ width: -webkit-calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
198
+ width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
199
+ }
200
+ .row.no-gutter .col-35 {
201
+ width: 35%;
202
+ }
159
203
  .row .col-33 {
160
204
  width: 33.333333333333336%;
161
205
  width: -webkit-calc((100% - 16px*2) / 3);
@@ -164,6 +208,14 @@ p {
164
208
  .row.no-gutter .col-33 {
165
209
  width: 33.333333333333336%;
166
210
  }
211
+ .row .col-30 {
212
+ width: 30%;
213
+ width: -webkit-calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
214
+ width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
215
+ }
216
+ .row.no-gutter .col-30 {
217
+ width: 30%;
218
+ }
167
219
  .row .col-25 {
168
220
  width: 25%;
169
221
  width: -webkit-calc((100% - 16px*3) / 4);
@@ -354,6 +406,66 @@ p {
354
406
  .row.no-gutter .col-auto:nth-last-child(15) ~ .col-auto {
355
407
  width: 6.66666667%;
356
408
  }
409
+ .row .col-auto:nth-last-child(16),
410
+ .row .col-auto:nth-last-child(16) ~ .col-auto {
411
+ width: 6.25%;
412
+ width: -webkit-calc((100% - 16px*15) / 16);
413
+ width: calc((100% - 16px*15) / 16);
414
+ }
415
+ .row.no-gutter .col-auto:nth-last-child(16),
416
+ .row.no-gutter .col-auto:nth-last-child(16) ~ .col-auto {
417
+ width: 6.25%;
418
+ }
419
+ .row .col-auto:nth-last-child(17),
420
+ .row .col-auto:nth-last-child(17) ~ .col-auto {
421
+ width: 5.88235294%;
422
+ width: -webkit-calc((100% - 16px*16) / 17);
423
+ width: calc((100% - 16px*16) / 17);
424
+ }
425
+ .row.no-gutter .col-auto:nth-last-child(17),
426
+ .row.no-gutter .col-auto:nth-last-child(17) ~ .col-auto {
427
+ width: 5.88235294%;
428
+ }
429
+ .row .col-auto:nth-last-child(18),
430
+ .row .col-auto:nth-last-child(18) ~ .col-auto {
431
+ width: 5.55555556%;
432
+ width: -webkit-calc((100% - 16px*17) / 18);
433
+ width: calc((100% - 16px*17) / 18);
434
+ }
435
+ .row.no-gutter .col-auto:nth-last-child(18),
436
+ .row.no-gutter .col-auto:nth-last-child(18) ~ .col-auto {
437
+ width: 5.55555556%;
438
+ }
439
+ .row .col-auto:nth-last-child(19),
440
+ .row .col-auto:nth-last-child(19) ~ .col-auto {
441
+ width: 5.26315789%;
442
+ width: -webkit-calc((100% - 16px*18) / 19);
443
+ width: calc((100% - 16px*18) / 19);
444
+ }
445
+ .row.no-gutter .col-auto:nth-last-child(19),
446
+ .row.no-gutter .col-auto:nth-last-child(19) ~ .col-auto {
447
+ width: 5.26315789%;
448
+ }
449
+ .row .col-auto:nth-last-child(20),
450
+ .row .col-auto:nth-last-child(20) ~ .col-auto {
451
+ width: 5%;
452
+ width: -webkit-calc((100% - 16px*19) / 20);
453
+ width: calc((100% - 16px*19) / 20);
454
+ }
455
+ .row.no-gutter .col-auto:nth-last-child(20),
456
+ .row.no-gutter .col-auto:nth-last-child(20) ~ .col-auto {
457
+ width: 5%;
458
+ }
459
+ .row .col-auto:nth-last-child(21),
460
+ .row .col-auto:nth-last-child(21) ~ .col-auto {
461
+ width: 4.76190476%;
462
+ width: -webkit-calc((100% - 16px*20) / 21);
463
+ width: calc((100% - 16px*20) / 21);
464
+ }
465
+ .row.no-gutter .col-auto:nth-last-child(21),
466
+ .row.no-gutter .col-auto:nth-last-child(21) ~ .col-auto {
467
+ width: 4.76190476%;
468
+ }
357
469
  @media all and (min-width: 768px) {
358
470
  .row .tablet-100 {
359
471
  width: 100%;
@@ -403,6 +515,14 @@ p {
403
515
  .row.no-gutter .tablet-75 {
404
516
  width: 75%;
405
517
  }
518
+ .row .tablet-70 {
519
+ width: 70%;
520
+ width: -webkit-calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
521
+ width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
522
+ }
523
+ .row.no-gutter .tablet-70 {
524
+ width: 70%;
525
+ }
406
526
  .row .tablet-66 {
407
527
  width: 66.66666666666666%;
408
528
  width: -webkit-calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
@@ -411,6 +531,14 @@ p {
411
531
  .row.no-gutter .tablet-66 {
412
532
  width: 66.66666666666666%;
413
533
  }
534
+ .row .tablet-65 {
535
+ width: 65%;
536
+ width: -webkit-calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
537
+ width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
538
+ }
539
+ .row.no-gutter .tablet-65 {
540
+ width: 65%;
541
+ }
414
542
  .row .tablet-60 {
415
543
  width: 60%;
416
544
  width: -webkit-calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
@@ -419,6 +547,14 @@ p {
419
547
  .row.no-gutter .tablet-60 {
420
548
  width: 60%;
421
549
  }
550
+ .row .tablet-55 {
551
+ width: 55%;
552
+ width: -webkit-calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
553
+ width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
554
+ }
555
+ .row.no-gutter .tablet-55 {
556
+ width: 55%;
557
+ }
422
558
  .row .tablet-50 {
423
559
  width: 50%;
424
560
  width: -webkit-calc((100% - 16px*1) / 2);
@@ -427,6 +563,14 @@ p {
427
563
  .row.no-gutter .tablet-50 {
428
564
  width: 50%;
429
565
  }
566
+ .row .tablet-45 {
567
+ width: 45%;
568
+ width: -webkit-calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
569
+ width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
570
+ }
571
+ .row.no-gutter .tablet-45 {
572
+ width: 45%;
573
+ }
430
574
  .row .tablet-40 {
431
575
  width: 40%;
432
576
  width: -webkit-calc((100% - 16px*1.5) / 2.5);
@@ -435,6 +579,14 @@ p {
435
579
  .row.no-gutter .tablet-40 {
436
580
  width: 40%;
437
581
  }
582
+ .row .tablet-35 {
583
+ width: 35%;
584
+ width: -webkit-calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
585
+ width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
586
+ }
587
+ .row.no-gutter .tablet-35 {
588
+ width: 35%;
589
+ }
438
590
  .row .tablet-33 {
439
591
  width: 33.333333333333336%;
440
592
  width: -webkit-calc((100% - 16px*2) / 3);
@@ -443,6 +595,14 @@ p {
443
595
  .row.no-gutter .tablet-33 {
444
596
  width: 33.333333333333336%;
445
597
  }
598
+ .row .tablet-30 {
599
+ width: 30%;
600
+ width: -webkit-calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
601
+ width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
602
+ }
603
+ .row.no-gutter .tablet-30 {
604
+ width: 30%;
605
+ }
446
606
  .row .tablet-25 {
447
607
  width: 25%;
448
608
  width: -webkit-calc((100% - 16px*3) / 4);
@@ -633,12 +793,71 @@ p {
633
793
  .row.no-gutter .tablet-auto:nth-last-child(15) ~ .tablet-auto {
634
794
  width: 6.66666667%;
635
795
  }
796
+ .row .tablet-auto:nth-last-child(16),
797
+ .row .tablet-auto:nth-last-child(16) ~ .col-auto {
798
+ width: 6.25%;
799
+ width: -webkit-calc((100% - 16px*15) / 16);
800
+ width: calc((100% - 16px*15) / 16);
801
+ }
802
+ .row.no-gutter .tablet-auto:nth-last-child(16),
803
+ .row.no-gutter .tablet-auto:nth-last-child(16) ~ .tablet-auto {
804
+ width: 6.25%;
805
+ }
806
+ .row .tablet-auto:nth-last-child(17),
807
+ .row .tablet-auto:nth-last-child(17) ~ .col-auto {
808
+ width: 5.88235294%;
809
+ width: -webkit-calc((100% - 16px*16) / 17);
810
+ width: calc((100% - 16px*16) / 17);
811
+ }
812
+ .row.no-gutter .tablet-auto:nth-last-child(17),
813
+ .row.no-gutter .tablet-auto:nth-last-child(17) ~ .tablet-auto {
814
+ width: 5.88235294%;
815
+ }
816
+ .row .tablet-auto:nth-last-child(18),
817
+ .row .tablet-auto:nth-last-child(18) ~ .col-auto {
818
+ width: 5.55555556%;
819
+ width: -webkit-calc((100% - 16px*17) / 18);
820
+ width: calc((100% - 16px*17) / 18);
821
+ }
822
+ .row.no-gutter .tablet-auto:nth-last-child(18),
823
+ .row.no-gutter .tablet-auto:nth-last-child(18) ~ .tablet-auto {
824
+ width: 5.55555556%;
825
+ }
826
+ .row .tablet-auto:nth-last-child(19),
827
+ .row .tablet-auto:nth-last-child(19) ~ .col-auto {
828
+ width: 5.26315789%;
829
+ width: -webkit-calc((100% - 16px*18) / 19);
830
+ width: calc((100% - 16px*18) / 19);
831
+ }
832
+ .row.no-gutter .tablet-auto:nth-last-child(19),
833
+ .row.no-gutter .tablet-auto:nth-last-child(19) ~ .tablet-auto {
834
+ width: 5.26315789%;
835
+ }
836
+ .row .tablet-auto:nth-last-child(20),
837
+ .row .tablet-auto:nth-last-child(20) ~ .col-auto {
838
+ width: 5%;
839
+ width: -webkit-calc((100% - 16px*19) / 20);
840
+ width: calc((100% - 16px*19) / 20);
841
+ }
842
+ .row.no-gutter .tablet-auto:nth-last-child(20),
843
+ .row.no-gutter .tablet-auto:nth-last-child(20) ~ .tablet-auto {
844
+ width: 5%;
845
+ }
846
+ .row .tablet-auto:nth-last-child(21),
847
+ .row .tablet-auto:nth-last-child(21) ~ .col-auto {
848
+ width: 4.76190476%;
849
+ width: -webkit-calc((100% - 16px*20) / 21);
850
+ width: calc((100% - 16px*20) / 21);
851
+ }
852
+ .row.no-gutter .tablet-auto:nth-last-child(21),
853
+ .row.no-gutter .tablet-auto:nth-last-child(21) ~ .tablet-auto {
854
+ width: 4.76190476%;
855
+ }
636
856
  }
637
857
  /* === Views === */
638
858
  .views,
639
859
  .view {
640
860
  position: relative;
641
- width: 100%;
642
861
  height: 100%;
643
862
  z-index: 5000;
644
863
  }
@@ -647,6 +866,7 @@ p {
647
866
  -webkit-overflow-scrolling: touch;
648
867
  }
649
868
  .view {
869
+ width: 100%;
650
870
  overflow: hidden;
651
871
  box-sizing: border-box;
652
872
  }
@@ -1153,6 +1373,9 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1153
1373
  overflow: hidden;
1154
1374
  max-width: 100%;
1155
1375
  }
1376
+ .tabbar-labels.toolbar-bottom span.tabbar-label {
1377
+ text-transform: none;
1378
+ }
1156
1379
  .tabbar-scrollable .toolbar-inner {
1157
1380
  -webkit-box-pack: start;
1158
1381
  -ms-flex-pack: start;
@@ -1185,6 +1408,51 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1185
1408
  bottom: auto;
1186
1409
  top: 0;
1187
1410
  }
1411
+ .subnavbar input[type="text"],
1412
+ .navbar input[type="text"],
1413
+ .subnavbar input[type="password"],
1414
+ .navbar input[type="password"],
1415
+ .subnavbar input[type="search"],
1416
+ .navbar input[type="search"],
1417
+ .subnavbar input[type="email"],
1418
+ .navbar input[type="email"],
1419
+ .subnavbar input[type="tel"],
1420
+ .navbar input[type="tel"],
1421
+ .subnavbar input[type="url"],
1422
+ .navbar input[type="url"] {
1423
+ box-sizing: border-box;
1424
+ width: 100%;
1425
+ height: 32px;
1426
+ display: block;
1427
+ border: none;
1428
+ -webkit-appearance: none;
1429
+ -moz-appearance: none;
1430
+ -ms-appearance: none;
1431
+ appearance: none;
1432
+ border-radius: 0;
1433
+ font-family: inherit;
1434
+ color: #fff;
1435
+ font-size: 16px;
1436
+ font-weight: 400;
1437
+ background-color: transparent;
1438
+ padding: 0;
1439
+ border-bottom: 1px solid #fff;
1440
+ }
1441
+ .subnavbar input[type="text"]::-webkit-input-placeholder,
1442
+ .navbar input[type="text"]::-webkit-input-placeholder,
1443
+ .subnavbar input[type="password"]::-webkit-input-placeholder,
1444
+ .navbar input[type="password"]::-webkit-input-placeholder,
1445
+ .subnavbar input[type="search"]::-webkit-input-placeholder,
1446
+ .navbar input[type="search"]::-webkit-input-placeholder,
1447
+ .subnavbar input[type="email"]::-webkit-input-placeholder,
1448
+ .navbar input[type="email"]::-webkit-input-placeholder,
1449
+ .subnavbar input[type="tel"]::-webkit-input-placeholder,
1450
+ .navbar input[type="tel"]::-webkit-input-placeholder,
1451
+ .subnavbar input[type="url"]::-webkit-input-placeholder,
1452
+ .navbar input[type="url"]::-webkit-input-placeholder {
1453
+ color: #ffffff;
1454
+ opacity: 1;
1455
+ }
1188
1456
  /* === Relation between toolbar/navbar types and pages === */
1189
1457
  .page > .navbar,
1190
1458
  .view > .navbar,
@@ -1211,56 +1479,130 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1211
1479
  padding-top: 72px;
1212
1480
  }
1213
1481
  .toolbar-bottom ~ .page-content,
1214
- .messagebar ~ .page-content {
1482
+ .messagebar ~ .page-content,
1483
+ .toolbar-bottom ~ .pages .page-content,
1484
+ .messagebar ~ .pages .page-content,
1485
+ .toolbar-bottom ~ .view .page-content,
1486
+ .messagebar ~ .view .page-content {
1215
1487
  padding-top: 0;
1216
1488
  padding-bottom: 48px;
1217
1489
  }
1218
- .tabbar-labels.toolbar-bottom ~ .page-content {
1490
+ .tabbar-labels.toolbar-bottom ~ .page-content,
1491
+ .tabbar-labels.toolbar-bottom ~ .pages .page-content,
1492
+ .tabbar-labels.toolbar-bottom ~ .page .page-content,
1493
+ .tabbar-labels.toolbar-bottom ~ .view .page-content {
1219
1494
  padding-bottom: 72px;
1220
1495
  }
1221
- .navbar-fixed .page-content {
1496
+ .navbar-fixed .page-content,
1497
+ .navbar-through .page-content,
1498
+ .navbar-fixed.pages .page-content,
1499
+ .navbar-through.pages .page-content,
1500
+ .navbar-fixed.view .page-content,
1501
+ .navbar-through.view .page-content {
1222
1502
  padding-top: 56px;
1223
1503
  }
1224
1504
  .navbar-fixed.toolbar-fixed .page-content,
1505
+ .navbar-through.toolbar-fixed .page-content,
1225
1506
  .navbar-fixed.tabbar-fixed .page-content,
1507
+ .navbar-through.tabbar-fixed .page-content,
1226
1508
  .navbar-fixed .toolbar-fixed .page-content,
1509
+ .navbar-through .toolbar-fixed .page-content,
1227
1510
  .navbar-fixed .tabbar-fixed .page-content,
1511
+ .navbar-through .tabbar-fixed .page-content,
1228
1512
  .toolbar-fixed .navbar-fixed .page-content,
1229
- .tabbar-fixed .navbar-fixed .page-content {
1513
+ .toolbar-fixed .navbar-through .page-content,
1514
+ .tabbar-fixed .navbar-fixed .page-content,
1515
+ .tabbar-fixed .navbar-through .page-content {
1230
1516
  padding-top: 104px;
1231
1517
  }
1518
+ .navbar-fixed.toolbar-fixed .toolbar-bottom ~ .pages .page-content,
1519
+ .navbar-through.toolbar-fixed .toolbar-bottom ~ .pages .page-content,
1520
+ .navbar-fixed.tabbar-fixed .toolbar-bottom ~ .pages .page-content,
1521
+ .navbar-through.tabbar-fixed .toolbar-bottom ~ .pages .page-content,
1522
+ .navbar-fixed .toolbar-fixed .toolbar-bottom ~ .pages .page-content,
1523
+ .navbar-through .toolbar-fixed .toolbar-bottom ~ .pages .page-content,
1524
+ .navbar-fixed .tabbar-fixed .toolbar-bottom ~ .pages .page-content,
1525
+ .navbar-through .tabbar-fixed .toolbar-bottom ~ .pages .page-content,
1526
+ .toolbar-fixed .navbar-fixed .toolbar-bottom ~ .pages .page-content,
1527
+ .toolbar-fixed .navbar-through .toolbar-bottom ~ .pages .page-content,
1528
+ .tabbar-fixed .navbar-fixed .toolbar-bottom ~ .pages .page-content,
1529
+ .tabbar-fixed .navbar-through .toolbar-bottom ~ .pages .page-content,
1530
+ .navbar-fixed.toolbar-fixed .toolbar-bottom ~ .view .page-content,
1531
+ .navbar-through.toolbar-fixed .toolbar-bottom ~ .view .page-content,
1532
+ .navbar-fixed.tabbar-fixed .toolbar-bottom ~ .view .page-content,
1533
+ .navbar-through.tabbar-fixed .toolbar-bottom ~ .view .page-content,
1534
+ .navbar-fixed .toolbar-fixed .toolbar-bottom ~ .view .page-content,
1535
+ .navbar-through .toolbar-fixed .toolbar-bottom ~ .view .page-content,
1536
+ .navbar-fixed .tabbar-fixed .toolbar-bottom ~ .view .page-content,
1537
+ .navbar-through .tabbar-fixed .toolbar-bottom ~ .view .page-content,
1538
+ .toolbar-fixed .navbar-fixed .toolbar-bottom ~ .view .page-content,
1539
+ .toolbar-fixed .navbar-through .toolbar-bottom ~ .view .page-content,
1540
+ .tabbar-fixed .navbar-fixed .toolbar-bottom ~ .view .page-content,
1541
+ .tabbar-fixed .navbar-through .toolbar-bottom ~ .view .page-content {
1542
+ padding-top: 56px;
1543
+ }
1232
1544
  .navbar-fixed.tabbar-labels-fixed .page-content,
1545
+ .navbar-through.tabbar-labels-fixed .page-content,
1233
1546
  .navbar-fixed .tabbar-labels-fixed .page-content,
1234
- .tabbar-labels-fixed .navbar-fixed .page-content {
1547
+ .navbar-through .tabbar-labels-fixed .page-content,
1548
+ .tabbar-labels-fixed .navbar-fixed .page-content,
1549
+ .tabbar-labels-fixed .navbar-through .page-content {
1235
1550
  padding-top: 128px;
1236
1551
  }
1237
- .navbar-fixed .toolbar ~ .page-content {
1552
+ .navbar-fixed.tabbar-labels-fixed .toolbar-bottom ~ .pages .page-content,
1553
+ .navbar-through.tabbar-labels-fixed .toolbar-bottom ~ .pages .page-content,
1554
+ .navbar-fixed .tabbar-labels-fixed .toolbar-bottom ~ .pages .page-content,
1555
+ .navbar-through .tabbar-labels-fixed .toolbar-bottom ~ .pages .page-content,
1556
+ .tabbar-labels-fixed .navbar-fixed .toolbar-bottom ~ .pages .page-content,
1557
+ .tabbar-labels-fixed .navbar-through .toolbar-bottom ~ .pages .page-content,
1558
+ .navbar-fixed.tabbar-labels-fixed .toolbar-bottom ~ .view .page-content,
1559
+ .navbar-through.tabbar-labels-fixed .toolbar-bottom ~ .view .page-content,
1560
+ .navbar-fixed .tabbar-labels-fixed .toolbar-bottom ~ .view .page-content,
1561
+ .navbar-through .tabbar-labels-fixed .toolbar-bottom ~ .view .page-content,
1562
+ .tabbar-labels-fixed .navbar-fixed .toolbar-bottom ~ .view .page-content,
1563
+ .tabbar-labels-fixed .navbar-through .toolbar-bottom ~ .view .page-content {
1564
+ padding-top: 56px;
1565
+ }
1566
+ .navbar-fixed .toolbar ~ .page-content,
1567
+ .navbar-through .toolbar ~ .page-content {
1238
1568
  padding-top: 104px;
1239
1569
  }
1240
1570
  .navbar-fixed .messagebar ~ .page-content,
1241
- .navbar-fixed .toolbar-bottom ~ .page-content {
1571
+ .navbar-through .messagebar ~ .page-content,
1572
+ .navbar-fixed .toolbar-bottom ~ .page-content,
1573
+ .navbar-through .toolbar-bottom ~ .page-content {
1242
1574
  padding-top: 56px;
1243
1575
  }
1244
- .navbar-fixed .tabbar-labels ~ .page-content {
1576
+ .navbar-fixed .tabbar-labels ~ .page-content,
1577
+ .navbar-through .tabbar-labels ~ .page-content {
1245
1578
  padding-top: 128px;
1246
1579
  }
1247
- .navbar-fixed .tabbar-labels.toolbar-bottom ~ .page-content {
1580
+ .navbar-fixed .tabbar-labels.toolbar-bottom ~ .page-content,
1581
+ .navbar-through .tabbar-labels.toolbar-bottom ~ .page-content {
1248
1582
  padding-top: 56px;
1249
1583
  }
1250
1584
  .navbar-fixed .with-subnavbar .page-content,
1585
+ .navbar-through .with-subnavbar .page-content,
1251
1586
  .navbar-fixed .page-content.with-subnavbar,
1252
- .navbar-fixed .subnavbar ~ .page-content {
1587
+ .navbar-through .page-content.with-subnavbar,
1588
+ .navbar-fixed .subnavbar ~ .page-content,
1589
+ .navbar-through .subnavbar ~ .page-content {
1253
1590
  padding-top: 104px;
1254
1591
  }
1255
1592
  .navbar-fixed .page .subnavbar,
1256
- .navbar-fixed.page .subnavbar {
1593
+ .navbar-through .page .subnavbar,
1594
+ .navbar-fixed.page .subnavbar,
1595
+ .navbar-through.page .subnavbar {
1257
1596
  top: 56px;
1258
1597
  }
1259
- .navbar-fixed .toolbar {
1598
+ .navbar-fixed .toolbar,
1599
+ .navbar-through .toolbar {
1260
1600
  top: 56px;
1261
1601
  }
1262
1602
  .navbar-fixed .messagebar,
1263
- .navbar-fixed .toolbar-bottom {
1603
+ .navbar-through .messagebar,
1604
+ .navbar-fixed .toolbar-bottom,
1605
+ .navbar-through .toolbar-bottom {
1264
1606
  top: auto;
1265
1607
  }
1266
1608
  .navbar.navbar-hiding {
@@ -1314,6 +1656,10 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1314
1656
  -webkit-transition-duration: 400ms;
1315
1657
  transition-duration: 400ms;
1316
1658
  }
1659
+ .navbar.not-animated {
1660
+ -webkit-transition-duration: 0ms;
1661
+ transition-duration: 0ms;
1662
+ }
1317
1663
  .page.no-navbar .page-content {
1318
1664
  padding-top: 0;
1319
1665
  }
@@ -1338,6 +1684,11 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1338
1684
  -webkit-transition-duration: 400ms;
1339
1685
  transition-duration: 400ms;
1340
1686
  }
1687
+ .toolbar.not-animated,
1688
+ .tabbar.not-animated {
1689
+ -webkit-transition-duration: 0ms;
1690
+ transition-duration: 0ms;
1691
+ }
1341
1692
  .toolbar.toolbar-hidden,
1342
1693
  .tabbar.toolbar-hidden,
1343
1694
  .toolbar.tabbar-hidden,
@@ -1345,8 +1696,8 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1345
1696
  -webkit-transform: translate3d(0, -100%, 0);
1346
1697
  transform: translate3d(0, -100%, 0);
1347
1698
  }
1348
- .navbar ~ .toolbar.toolbar-hidden,
1349
- .navbar ~ .tabbar.toolbar-hidden,
1699
+ .navbar ~ .toolbar.toolbar-hidden:not(.messagebar):not(.toolbar-bottom),
1700
+ .navbar ~ .tabbar.toolbar-hidden:not(.messagebar):not(.toolbar-bottom),
1350
1701
  .navbar ~ .toolbar.tabbar-hidden,
1351
1702
  .navbar ~ .tabbar.tabbar-hidden {
1352
1703
  -webkit-transform: translate3d(0, -104px, 0);
@@ -1368,6 +1719,55 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1368
1719
  .page.no-tabbar .page-content {
1369
1720
  padding-bottom: 0;
1370
1721
  }
1722
+ .navbar.no-shadow,
1723
+ .toolbar.no-shadow {
1724
+ box-shadow: none !important;
1725
+ }
1726
+ .navbar-fixed .subnavbar,
1727
+ .navbar-through .subnavbar {
1728
+ box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2), 0px 4px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 1px 0px rgba(0, 0, 0, 0.12);
1729
+ }
1730
+ .navbar-fixed .navbar,
1731
+ .navbar-through .navbar {
1732
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
1733
+ }
1734
+ .navbar-fixed .navbar.navbar-hidden,
1735
+ .navbar-through .navbar.navbar-hidden {
1736
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0), 0px 4px 5px 0px rgba(0, 0, 0, 0), 0px 1px 10px 0px rgba(0, 0, 0, 0) !important;
1737
+ }
1738
+ .toolbar-fixed .toolbar,
1739
+ .tabbar-fixed .toolbar,
1740
+ .tabbar-labels-fixed .toolbar {
1741
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
1742
+ }
1743
+ .toolbar-fixed .toolbar.toolbar-hidden,
1744
+ .tabbar-fixed .toolbar.toolbar-hidden,
1745
+ .tabbar-labels-fixed .toolbar.toolbar-hidden {
1746
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0), 0px 4px 5px 0px rgba(0, 0, 0, 0), 0px 1px 10px 0px rgba(0, 0, 0, 0) !important;
1747
+ }
1748
+ .toolbar-fixed .toolbar-bottom,
1749
+ .tabbar-fixed .toolbar-bottom,
1750
+ .tabbar-labels-fixed .toolbar-bottom,
1751
+ .toolbar-bottom {
1752
+ box-shadow: 0px -2px 4px -1px rgba(0, 0, 0, 0.2), 0px -4px 5px 0px rgba(0, 0, 0, 0.14), 0px -1px 10px 0px rgba(0, 0, 0, 0.12);
1753
+ }
1754
+ .toolbar-bottom.toolbar-hidden {
1755
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0), 0px 4px 5px 0px rgba(0, 0, 0, 0), 0px 1px 10px 0px rgba(0, 0, 0, 0) !important;
1756
+ }
1757
+ .navbar-fixed.toolbar-fixed .navbar,
1758
+ .navbar-through.toolbar-fixed .navbar,
1759
+ .navbar-fixed .toolbar-fixed .navbar,
1760
+ .navbar-through .toolbar-fixed .navbar,
1761
+ .navbar-fixed.tabbar-fixed .navbar,
1762
+ .navbar-through.tabbar-fixed .navbar,
1763
+ .navbar-fixed .tabbar-fixed .navbar,
1764
+ .navbar-through .tabbar-fixed .navbar,
1765
+ .navbar-fixed.tabbar-labels-fixed .navbar,
1766
+ .navbar-through.tabbar-labels-fixed .navbar,
1767
+ .navbar-fixed .tabbar-labels-fixed .navbar,
1768
+ .navbar-through .tabbar-labels-fixed .navbar {
1769
+ box-shadow: none;
1770
+ }
1371
1771
  /* === Search Bar === */
1372
1772
  .searchbar {
1373
1773
  height: 48px;
@@ -1387,6 +1787,9 @@ html:not(.watch-active-state) .tabbar a.tab-link:active,
1387
1787
  align-items: center;
1388
1788
  color: #fff;
1389
1789
  }
1790
+ .searchbar.no-shadow {
1791
+ box-shadow: none;
1792
+ }
1390
1793
  .searchbar a {
1391
1794
  position: relative;
1392
1795
  color: #fff;
@@ -1426,7 +1829,7 @@ html:not(.watch-active-state) .searchbar a:active:before,
1426
1829
  .searchbar input[type="search"] {
1427
1830
  box-sizing: border-box;
1428
1831
  width: 100%;
1429
- height: 100%;
1832
+ height: 32px;
1430
1833
  display: block;
1431
1834
  border: none;
1432
1835
  -webkit-appearance: none;
@@ -1438,17 +1841,19 @@ html:not(.watch-active-state) .searchbar a:active:before,
1438
1841
  color: #fff;
1439
1842
  font-size: 16px;
1440
1843
  font-weight: 400;
1844
+ padding: 0;
1845
+ border-bottom: 1px solid #fff;
1846
+ height: 100%;
1441
1847
  padding: 0 36px 0 24px;
1442
1848
  background-color: transparent;
1443
1849
  background-repeat: no-repeat;
1444
1850
  background-position: 0 center;
1851
+ opacity: 0.6;
1852
+ -webkit-background-size: 24px 24px;
1853
+ background-size: 24px 24px;
1445
1854
  -webkit-transition-duration: 300ms;
1446
1855
  transition-duration: 300ms;
1447
1856
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23FFFFFF'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M15.5%2014h-.79l-.28-.27C15.41%2012.59%2016%2011.11%2016%209.5%2016%205.91%2013.09%203%209.5%203S3%205.91%203%209.5%205.91%2016%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
1448
- -webkit-background-size: 24px 24px;
1449
- background-size: 24px 24px;
1450
- border-bottom: 1px solid #fff;
1451
- opacity: 0.6;
1452
1857
  }
1453
1858
  .searchbar input[type="search"]::-webkit-input-placeholder {
1454
1859
  color: #ffffff;
@@ -1521,10 +1926,14 @@ html:not(.watch-active-state) .searchbar a:active:before,
1521
1926
  left: 0;
1522
1927
  top: 0;
1523
1928
  z-index: 200;
1929
+ box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
1524
1930
  }
1525
1931
  .page > .searchbar ~ .page-content {
1526
1932
  padding-top: 48px;
1527
1933
  }
1934
+ .page > .searchbar.no-shadow {
1935
+ box-shadow: none;
1936
+ }
1528
1937
  .navbar-fixed .page > .searchbar,
1529
1938
  .navbar-through .page > .searchbar,
1530
1939
  .navbar-fixed > .searchbar,
@@ -1619,7 +2028,8 @@ html.pixel-ratio-3 .toolbar.messagebar:before {
1619
2028
  .toolbar.messagebar ~ .page-content {
1620
2029
  padding-bottom: 48px;
1621
2030
  }
1622
- .page.no-toolbar .toolbar.messagebar ~ .page-content {
2031
+ .page.no-toolbar .toolbar.messagebar ~ .page-content,
2032
+ .page.no-tabbar .toolbar.messagebar ~ .page-content {
1623
2033
  padding-bottom: 48px;
1624
2034
  }
1625
2035
  .hidden-toolbar .toolbar.messagebar {
@@ -1662,59 +2072,9 @@ i.icon.icon-camera {
1662
2072
  i.icon.icon-f7 {
1663
2073
  width: 24px;
1664
2074
  height: 24px;
1665
- background-image: url("../assets/i-f7-material.png");
2075
+ background-image: url("../img/i-f7-material.png");
1666
2076
  border-radius: 3px;
1667
2077
  }
1668
- i.icon.icon-form-name {
1669
- width: 24px;
1670
- height: 24px;
1671
- background-image: url("../assets/i-form-name-material.svg");
1672
- }
1673
- i.icon.icon-form-password {
1674
- width: 24px;
1675
- height: 24px;
1676
- background-image: url("../assets/i-form-password-material.svg");
1677
- }
1678
- i.icon.icon-form-email {
1679
- width: 24px;
1680
- height: 24px;
1681
- background-image: url("../assets/i-form-email-material.svg");
1682
- }
1683
- i.icon.icon-form-calendar {
1684
- width: 24px;
1685
- height: 24px;
1686
- background-image: url("../assets/i-form-calendar-material.svg");
1687
- }
1688
- i.icon.icon-form-tel {
1689
- width: 24px;
1690
- height: 24px;
1691
- background-image: url("../assets/i-form-tel-material.svg");
1692
- }
1693
- i.icon.icon-form-gender {
1694
- width: 24px;
1695
- height: 24px;
1696
- background-image: url("../assets/i-form-gender-material.svg");
1697
- }
1698
- i.icon.icon-form-toggle {
1699
- width: 24px;
1700
- height: 24px;
1701
- background-image: url("../assets/i-form-toggle-material.svg");
1702
- }
1703
- i.icon.icon-form-comment {
1704
- width: 24px;
1705
- height: 24px;
1706
- background-image: url("../assets/i-form-comment-material.svg");
1707
- }
1708
- i.icon.icon-form-settings {
1709
- width: 24px;
1710
- height: 24px;
1711
- background-image: url("../assets/i-form-settings-material.svg");
1712
- }
1713
- i.icon.icon-form-url {
1714
- width: 24px;
1715
- height: 24px;
1716
- background-image: url("../assets/i-form-url-material.svg");
1717
- }
1718
2078
  i.icon.icon-next,
1719
2079
  i.icon.icon-prev {
1720
2080
  width: 24px;
@@ -1748,7 +2108,10 @@ i.icon.icon-close {
1748
2108
  box-sizing: border-box;
1749
2109
  vertical-align: middle;
1750
2110
  }
1751
- .icon .badge {
2111
+ .icon .badge,
2112
+ .f7-icons .badge,
2113
+ .material-icons .badge,
2114
+ .framework7-icons .badge {
1752
2115
  position: absolute;
1753
2116
  left: 100%;
1754
2117
  margin-left: -10px;
@@ -1756,6 +2119,7 @@ i.icon.icon-close {
1756
2119
  font-size: 10px;
1757
2120
  line-height: 1.4;
1758
2121
  padding: 1px 5px;
2122
+ font-family: Roboto, Noto, Helvetica, Arial, sans-serif;
1759
2123
  }
1760
2124
  /* === Chips === */
1761
2125
  .chip {
@@ -1780,7 +2144,7 @@ i.icon.icon-close {
1780
2144
  align-items: center;
1781
2145
  margin: 2px 0;
1782
2146
  }
1783
- .chip .chip-media {
2147
+ .chip-media {
1784
2148
  width: 32px;
1785
2149
  height: 32px;
1786
2150
  margin-left: -12px;
@@ -1807,7 +2171,7 @@ i.icon.icon-close {
1807
2171
  -webkit-justify-content: center;
1808
2172
  justify-content: center;
1809
2173
  }
1810
- .chip .chip-media assets {
2174
+ .chip-media img {
1811
2175
  max-width: 100%;
1812
2176
  max-height: 100%;
1813
2177
  width: auto;
@@ -1815,10 +2179,10 @@ i.icon.icon-close {
1815
2179
  border-radius: 50%;
1816
2180
  display: block;
1817
2181
  }
1818
- .chip .chip-media + .chip-label {
2182
+ .chip-media + .chip-label {
1819
2183
  margin-left: 8px;
1820
2184
  }
1821
- .chip .chip-label {
2185
+ .chip-label {
1822
2186
  white-space: nowrap;
1823
2187
  overflow: hidden;
1824
2188
  text-overflow: ellipsis;
@@ -1829,10 +2193,10 @@ i.icon.icon-close {
1829
2193
  flex-shrink: 1;
1830
2194
  min-width: 0;
1831
2195
  }
1832
- .chip .chip-label + .chip-delete {
2196
+ .chip-label + .chip-delete {
1833
2197
  margin-left: 4px;
1834
2198
  }
1835
- .chip .chip-delete {
2199
+ .chip-delete {
1836
2200
  margin-right: -8px;
1837
2201
  width: 24px;
1838
2202
  height: 24px;
@@ -1849,8 +2213,8 @@ i.icon.icon-close {
1849
2213
  background-size: 20px 20px;
1850
2214
  opacity: 0.54;
1851
2215
  }
1852
- html:not(.watch-active-state) .chip .chip-delete:active,
1853
- .chip .chip-delete.active-state {
2216
+ html:not(.watch-active-state) .chip-delete:active,
2217
+ .chip-delete.active-state {
1854
2218
  opacity: 1;
1855
2219
  }
1856
2220
  /* === Content Block === */
@@ -1859,6 +2223,16 @@ html:not(.watch-active-state) .chip .chip-delete:active,
1859
2223
  padding: 0 16px;
1860
2224
  box-sizing: border-box;
1861
2225
  }
2226
+ .content-block.no-hairlines:before,
2227
+ .content-block.no-hairlines ul:before,
2228
+ .content-block.no-hairlines .content-block-inner:before {
2229
+ display: none;
2230
+ }
2231
+ .content-block.no-hairlines:after,
2232
+ .content-block.no-hairlines ul:after,
2233
+ .content-block.no-hairlines .content-block-inner:after {
2234
+ display: none;
2235
+ }
1862
2236
  .content-block-title {
1863
2237
  position: relative;
1864
2238
  overflow: hidden;
@@ -1875,7 +2249,8 @@ html:not(.watch-active-state) .chip .chip-delete:active,
1875
2249
  }
1876
2250
  .content-block-title + .list-block,
1877
2251
  .content-block-title + .content-block,
1878
- .content-block-title + .card {
2252
+ .content-block-title + .card,
2253
+ .content-block-title + .timeline {
1879
2254
  margin-top: 0px;
1880
2255
  }
1881
2256
  .content-block-inner {
@@ -2149,7 +2524,7 @@ html.pixel-ratio-3 .list-block ul:after {
2149
2524
  .list-block .item-media i + i {
2150
2525
  margin-left: 8px;
2151
2526
  }
2152
- .list-block .item-media i + assets {
2527
+ .list-block .item-media i + img {
2153
2528
  margin-left: 8px;
2154
2529
  }
2155
2530
  .list-block .item-media + .item-inner {
@@ -2224,7 +2599,8 @@ html.pixel-ratio-3 .list-block .item-inner:after {
2224
2599
  -webkit-flex-shrink: 0;
2225
2600
  -ms-flex: 0 0 auto;
2226
2601
  flex-shrink: 0;
2227
- margin-left: 8px;
2602
+ margin-left: auto;
2603
+ padding-left: 8px;
2228
2604
  display: -webkit-box;
2229
2605
  display: -ms-flexbox;
2230
2606
  display: -webkit-flex;
@@ -2240,7 +2616,46 @@ html.pixel-ratio-3 .list-block .item-inner:after {
2240
2616
  position: relative;
2241
2617
  display: block;
2242
2618
  }
2243
- .list-block .item-link {
2619
+ .list-block .item-actions {
2620
+ margin-left: auto;
2621
+ padding-left: 8px;
2622
+ display: -webkit-box;
2623
+ display: -ms-flexbox;
2624
+ display: -webkit-flex;
2625
+ display: flex;
2626
+ -webkit-box-align: center;
2627
+ -ms-flex-align: center;
2628
+ -webkit-align-items: center;
2629
+ align-items: center;
2630
+ -webkit-box-pack: justify;
2631
+ -ms-flex-pack: justify;
2632
+ -webkit-justify-content: space-between;
2633
+ justify-content: space-between;
2634
+ }
2635
+ .list-block .item-actions a {
2636
+ min-width: 24px;
2637
+ position: relative;
2638
+ display: -webkit-box;
2639
+ display: -ms-flexbox;
2640
+ display: -webkit-flex;
2641
+ display: flex;
2642
+ -webkit-box-align: center;
2643
+ -ms-flex-align: center;
2644
+ -webkit-align-items: center;
2645
+ align-items: center;
2646
+ -webkit-box-pack: center;
2647
+ -ms-flex-pack: center;
2648
+ -webkit-justify-content: center;
2649
+ justify-content: center;
2650
+ }
2651
+ .list-block .item-actions a + a {
2652
+ margin-left: 8px;
2653
+ }
2654
+ .list-block .item-after + .item-actions {
2655
+ margin-left: 0;
2656
+ }
2657
+ .list-block .item-link,
2658
+ .list-block .list-button {
2244
2659
  -webkit-transition-duration: 300ms;
2245
2660
  transition-duration: 300ms;
2246
2661
  display: block;
@@ -2249,7 +2664,8 @@ html.pixel-ratio-3 .list-block .item-inner:after {
2249
2664
  overflow: hidden;
2250
2665
  z-index: 0;
2251
2666
  }
2252
- .list-block .item-link .item-inner {
2667
+ .list-block .item-link .item-inner,
2668
+ .list-block .list-button .item-inner {
2253
2669
  padding-right: 42px;
2254
2670
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2060%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'm60%2061.5-38.25%2038.25-9.75-9.75%2029.25-28.5-29.25-28.5%209.75-9.75z'%20fill%3D'%23c7c7cc'%2F%3E%3C%2Fsvg%3E");
2255
2671
  background-size: 10px 20px;
@@ -2259,10 +2675,12 @@ html.pixel-ratio-3 .list-block .item-inner:after {
2259
2675
  background-position: calc(100% - 16px) center;
2260
2676
  }
2261
2677
  html:not(.watch-active-state) .list-block .item-link:active,
2262
- .list-block .item-link.active-state {
2678
+ html:not(.watch-active-state) .list-block .list-button:active,
2679
+ .list-block .item-link.active-state,
2680
+ .list-block .list-button.active-state {
2263
2681
  background-color: rgba(0, 0, 0, 0.1);
2264
2682
  }
2265
- .list-block .item-link.list-button {
2683
+ .list-block .list-button {
2266
2684
  padding: 0 16px;
2267
2685
  font-size: 16px;
2268
2686
  display: block;
@@ -2426,8 +2844,8 @@ html:not(.watch-active-state) .list-block .item-link:active,
2426
2844
  -webkit-align-self: flex-start;
2427
2845
  align-self: flex-start;
2428
2846
  }
2429
- .list-block.media-list .item-media assets,
2430
- .list-block li.media-item .item-media assets {
2847
+ .list-block.media-list .item-media img,
2848
+ .list-block li.media-item .item-media img {
2431
2849
  display: block;
2432
2850
  }
2433
2851
  .list-block.media-list .item-title-row,
@@ -2564,6 +2982,23 @@ html.pixel-ratio-3 .list-block li:last-child li .item-inner:after {
2564
2982
  -webkit-transform: scaleY(0.33);
2565
2983
  transform: scaleY(0.33);
2566
2984
  }
2985
+ .list-block.no-hairlines:before,
2986
+ .list-block.no-hairlines ul:before,
2987
+ .list-block.no-hairlines .content-block-inner:before {
2988
+ display: none;
2989
+ }
2990
+ .list-block.no-hairlines:after,
2991
+ .list-block.no-hairlines ul:after,
2992
+ .list-block.no-hairlines .content-block-inner:after {
2993
+ display: none;
2994
+ }
2995
+ .list-block.no-hairlines-between .item-inner:after,
2996
+ .list-block.no-hairlines-between .list-button:after,
2997
+ .list-block.no-hairlines-between .item-divider:after,
2998
+ .list-block.no-hairlines-between .list-group-title:after,
2999
+ .list-block.no-hairlines-between .list-group-title:after {
3000
+ display: none;
3001
+ }
2567
3002
  /* === Contacts === */
2568
3003
  .contacts-block {
2569
3004
  margin: 0;
@@ -3057,10 +3492,23 @@ html:not(.watch-active-state) .button-raised:active,
3057
3492
  .item-input .range-slider {
3058
3493
  top: 8px;
3059
3494
  }
3060
- label.label-checkbox {
3495
+ .form-checkbox {
3496
+ position: relative;
3497
+ display: inline-block;
3498
+ vertical-align: middle;
3499
+ }
3500
+ label.label-checkbox,
3501
+ .form-checkbox {
3061
3502
  cursor: pointer;
3062
3503
  }
3063
- label.label-checkbox i.icon-form-checkbox {
3504
+ label.label-checkbox input[type="checkbox"],
3505
+ .form-checkbox input[type="checkbox"],
3506
+ label.label-checkbox input[type="radio"],
3507
+ .form-checkbox input[type="radio"] {
3508
+ display: none;
3509
+ }
3510
+ label.label-checkbox i.icon-form-checkbox,
3511
+ .form-checkbox i {
3064
3512
  width: 18px;
3065
3513
  height: 18px;
3066
3514
  position: relative;
@@ -3070,8 +3518,10 @@ label.label-checkbox i.icon-form-checkbox {
3070
3518
  -webkit-transition-duration: 300ms;
3071
3519
  transition-duration: 300ms;
3072
3520
  background: transparent;
3521
+ display: block;
3073
3522
  }
3074
- label.label-checkbox i.icon-form-checkbox:after {
3523
+ label.label-checkbox i.icon-form-checkbox:after,
3524
+ .form-checkbox i:after {
3075
3525
  content: ' ';
3076
3526
  position: absolute;
3077
3527
  width: 18px;
@@ -3086,31 +3536,42 @@ label.label-checkbox i.icon-form-checkbox:after {
3086
3536
  -webkit-background-size: 100% auto;
3087
3537
  background-size: 100% auto;
3088
3538
  }
3089
- label.label-checkbox input[type="checkbox"],
3090
- label.label-checkbox input[type="radio"] {
3091
- display: none;
3092
- }
3093
3539
  label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
3094
- label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
3095
3540
  label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
3096
- label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
3097
3541
  label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
3098
- label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox {
3542
+ label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
3543
+ label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
3544
+ label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox,
3545
+ .form-checkbox input[type="checkbox"]:checked ~ i {
3099
3546
  border-color: #2196f3;
3100
3547
  background-color: #2196f3;
3101
3548
  }
3102
3549
  label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox:after,
3103
- label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after,
3104
3550
  label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox:after,
3105
- label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox:after,
3106
3551
  label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox:after,
3107
- label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox:after {
3552
+ label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after,
3553
+ label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox:after,
3554
+ label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox:after,
3555
+ .form-checkbox input[type="checkbox"]:checked ~ i:after {
3108
3556
  opacity: 1;
3109
3557
  }
3110
- label.label-radio {
3558
+ .form-radio {
3559
+ position: relative;
3560
+ display: inline-block;
3561
+ vertical-align: middle;
3562
+ }
3563
+ label.label-radio,
3564
+ .form-radio {
3111
3565
  cursor: pointer;
3112
3566
  }
3113
- label.label-radio i.icon-form-radio {
3567
+ label.label-radio input[type="checkbox"],
3568
+ .form-radio input[type="checkbox"],
3569
+ label.label-radio input[type="radio"],
3570
+ .form-radio input[type="radio"] {
3571
+ display: none;
3572
+ }
3573
+ label.label-radio i.icon-form-radio,
3574
+ .form-radio i {
3114
3575
  width: 20px;
3115
3576
  height: 20px;
3116
3577
  position: relative;
@@ -3119,8 +3580,10 @@ label.label-radio i.icon-form-radio {
3119
3580
  box-sizing: border-box;
3120
3581
  -webkit-transition-duration: 300ms;
3121
3582
  transition-duration: 300ms;
3583
+ display: block;
3122
3584
  }
3123
- label.label-radio i.icon-form-radio:after {
3585
+ label.label-radio i.icon-form-radio:after,
3586
+ .form-radio i:after {
3124
3587
  content: ' ';
3125
3588
  position: absolute;
3126
3589
  width: 10px;
@@ -3136,24 +3599,22 @@ label.label-radio i.icon-form-radio:after {
3136
3599
  -webkit-transition-duration: 300ms;
3137
3600
  transition-duration: 300ms;
3138
3601
  }
3139
- label.label-radio input[type="checkbox"],
3140
- label.label-radio input[type="radio"] {
3141
- display: none;
3142
- }
3143
3602
  label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio,
3144
- label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio,
3145
3603
  label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
3146
- label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio,
3147
3604
  label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
3148
- label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio {
3605
+ label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio,
3606
+ label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio,
3607
+ label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio,
3608
+ .form-radio input[type="radio"]:checked ~ i {
3149
3609
  border-color: #2196f3;
3150
3610
  }
3151
3611
  label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
3152
- label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after,
3153
3612
  label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
3154
- label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
3155
3613
  label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
3156
- label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after {
3614
+ label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after,
3615
+ label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
3616
+ label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after,
3617
+ .form-radio input[type="radio"]:checked ~ i:after {
3157
3618
  background-color: #2196f3;
3158
3619
  -webkit-transform: scale(1);
3159
3620
  transform: scale(1);
@@ -3752,6 +4213,13 @@ html.pixel-ratio-3 .card-footer:before {
3752
4213
  -webkit-transition-duration: 400ms;
3753
4214
  transition-duration: 400ms;
3754
4215
  }
4216
+ .modal-overlay.not-animated,
4217
+ .preloader-indicator-overlay.not-animated,
4218
+ .popup-overlay.not-animated,
4219
+ .picker-modal-overlay.not-animated {
4220
+ -webkit-transition-duration: 0ms;
4221
+ transition-duration: 0ms;
4222
+ }
3755
4223
  .modal-overlay.modal-overlay-visible,
3756
4224
  .preloader-indicator-overlay.modal-overlay-visible,
3757
4225
  .popup-overlay.modal-overlay-visible,
@@ -3970,17 +4438,26 @@ html:not(.watch-active-state) .notifications .modal-buttons .button:not(.button-
3970
4438
  background: #fff;
3971
4439
  -webkit-transform: translate3d(0, 100%, 0);
3972
4440
  transform: translate3d(0, 100%, 0);
4441
+ max-height: 100%;
4442
+ overflow: auto;
4443
+ -webkit-overflow-scrolling: touch;
3973
4444
  }
3974
- .actions-modal.modal-in {
4445
+ .actions-modal.modal-in,
4446
+ .actions-modal.modal-out {
3975
4447
  -webkit-transition-duration: 300ms;
3976
4448
  transition-duration: 300ms;
4449
+ }
4450
+ .actions-modal.modal-in.not-animated,
4451
+ .actions-modal.modal-out.not-animated {
4452
+ -webkit-transition-duration: 0ms;
4453
+ transition-duration: 0ms;
4454
+ }
4455
+ .actions-modal.modal-in {
3977
4456
  -webkit-transform: translate3d(0, 0, 0);
3978
4457
  transform: translate3d(0, 0, 0);
3979
4458
  }
3980
4459
  .actions-modal.modal-out {
3981
4460
  z-index: 13499;
3982
- -webkit-transition-duration: 300ms;
3983
- transition-duration: 300ms;
3984
4461
  -webkit-transform: translate3d(0, 100%, 0);
3985
4462
  transform: translate3d(0, 100%, 0);
3986
4463
  }
@@ -4137,18 +4614,24 @@ input.modal-text-input + input.modal-text-input {
4137
4614
  -webkit-transform-origin: center top;
4138
4615
  transform-origin: center top;
4139
4616
  }
4617
+ .popover.modal-in,
4618
+ .popover.modal-out {
4619
+ -webkit-transition-duration: 300ms;
4620
+ transition-duration: 300ms;
4621
+ }
4622
+ .popover.modal-in.not-animated,
4623
+ .popover.modal-out.not-animated {
4624
+ -webkit-transition-duration: 0ms;
4625
+ transition-duration: 0ms;
4626
+ }
4140
4627
  .popover.modal-in {
4141
4628
  -webkit-transform: scale(1);
4142
4629
  transform: scale(1);
4143
- -webkit-transition-duration: 300ms;
4144
- transition-duration: 300ms;
4145
4630
  opacity: 1;
4146
4631
  }
4147
4632
  .popover.modal-out {
4148
4633
  -webkit-transform: scale(1);
4149
4634
  transform: scale(1);
4150
- -webkit-transition-duration: 300ms;
4151
- transition-duration: 300ms;
4152
4635
  opacity: 0;
4153
4636
  }
4154
4637
  .popover .list-block {
@@ -4301,6 +4784,13 @@ html.pixel-ratio-3 .actions-popover-label:after {
4301
4784
  -webkit-transition-duration: 400ms;
4302
4785
  transition-duration: 400ms;
4303
4786
  }
4787
+ .popup.modal-in.not-animated,
4788
+ .login-screen.modal-in.not-animated,
4789
+ .popup.modal-out.not-animated,
4790
+ .login-screen.modal-out.not-animated {
4791
+ -webkit-transition-duration: 0ms;
4792
+ transition-duration: 0ms;
4793
+ }
4304
4794
  .popup.modal-in,
4305
4795
  .login-screen.modal-in {
4306
4796
  -webkit-transform: translate3d(0, 0, 0);
@@ -4339,16 +4829,27 @@ html.pixel-ratio-3 .actions-popover-label:after {
4339
4829
  }
4340
4830
  @media all and (max-width: 629px), (max-height: 629px) {
4341
4831
  html.with-statusbar-overlay .popup {
4342
- height: -webkit-calc(100% - 20px);
4343
- height: calc(100% - 20px);
4344
- top: 20px;
4832
+ height: -webkit-calc(100% - 24px);
4833
+ height: calc(100% - 24px);
4834
+ top: 24px;
4345
4835
  }
4346
4836
  html.with-statusbar-overlay .popup-overlay {
4347
4837
  z-index: 9500;
4348
4838
  }
4349
- }
4839
+ html.with-statusbar-overlay.ios .popup {
4840
+ height: -webkit-calc(100% - 20px);
4841
+ height: calc(100% - 20px);
4842
+ top: 20px;
4843
+ }
4844
+ }
4350
4845
  html.with-statusbar-overlay .login-screen,
4351
4846
  html.with-statusbar-overlay .popup.tablet-fullscreen {
4847
+ height: -webkit-calc(100% - 24px);
4848
+ height: calc(100% - 24px);
4849
+ top: 24px;
4850
+ }
4851
+ html.with-statusbar-overlay.ios .login-screen,
4852
+ html.with-statusbar-overlay.ios .popup.tablet-fullscreen {
4352
4853
  height: -webkit-calc(100% - 20px);
4353
4854
  height: calc(100% - 20px);
4354
4855
  top: 20px;
@@ -4398,6 +4899,11 @@ html.with-statusbar-overlay .popup.tablet-fullscreen {
4398
4899
  -webkit-transition-duration: 400ms;
4399
4900
  transition-duration: 400ms;
4400
4901
  }
4902
+ .picker-modal.modal-in.not-animated,
4903
+ .picker-modal.modal-out.not-animated {
4904
+ -webkit-transition-duration: 0ms;
4905
+ transition-duration: 0ms;
4906
+ }
4401
4907
  .picker-modal.modal-in {
4402
4908
  -webkit-transform: translate3d(0, 0, 0);
4403
4909
  transform: translate3d(0, 0, 0);
@@ -4530,6 +5036,10 @@ html.with-statusbar-overlay .popup.tablet-fullscreen {
4530
5036
  -webkit-transition-duration: 300ms;
4531
5037
  transition-duration: 300ms;
4532
5038
  }
5039
+ .panel-overlay.not-animated {
5040
+ -webkit-transition-duration: 0ms;
5041
+ transition-duration: 0ms;
5042
+ }
4533
5043
  .panel {
4534
5044
  z-index: 1000;
4535
5045
  display: none;
@@ -4546,19 +5056,37 @@ html.with-statusbar-overlay .popup.tablet-fullscreen {
4546
5056
  -webkit-transition-duration: 300ms;
4547
5057
  transition-duration: 300ms;
4548
5058
  }
5059
+ .panel.not-animated {
5060
+ -webkit-transition-duration: 0ms;
5061
+ transition-duration: 0ms;
5062
+ }
5063
+ .panel.panel-visible {
5064
+ display: block;
5065
+ }
5066
+ .panel.panel-left {
5067
+ left: 0;
5068
+ }
4549
5069
  .panel.panel-left.panel-cover {
4550
5070
  z-index: 6000;
4551
- left: -260px;
5071
+ -webkit-transform: translate3d(-100%, 0, 0);
5072
+ transform: translate3d(-100%, 0, 0);
4552
5073
  }
4553
- .panel.panel-left.panel-reveal {
4554
- left: 0;
5074
+ .panel.panel-right {
5075
+ right: 0;
4555
5076
  }
4556
5077
  .panel.panel-right.panel-cover {
4557
5078
  z-index: 6000;
4558
- right: -260px;
5079
+ -webkit-transform: translate3d(100%, 0, 0);
5080
+ transform: translate3d(100%, 0, 0);
4559
5081
  }
4560
- .panel.panel-right.panel-reveal {
4561
- right: 0;
5082
+ .panel.panel-visible-by-breakpoint {
5083
+ display: block;
5084
+ -webkit-transform: translate3d(0, 0, 0) !important;
5085
+ transform: translate3d(0, 0, 0) !important;
5086
+ box-shadow: none !important;
5087
+ }
5088
+ .panel.panel-visible-by-breakpoint.panel-cover {
5089
+ z-index: 5900;
4562
5090
  }
4563
5091
  body.with-panel-left-cover .panel,
4564
5092
  body.with-panel-right-cover .panel {
@@ -4583,6 +5111,11 @@ body.with-panel-right-reveal .views {
4583
5111
  -moz-transition-property: -moz-transform, box-shadow;
4584
5112
  transition-property: transform, box-shadow;
4585
5113
  }
5114
+ body.with-panel-left-reveal .panel.not-animated ~ .views,
5115
+ body.with-panel-right-reveal .panel.not-animated ~ .views {
5116
+ -webkit-transition-duration: 0ms;
5117
+ transition-duration: 0ms;
5118
+ }
4586
5119
  body.with-panel-left-reveal .panel-overlay,
4587
5120
  body.with-panel-right-reveal .panel-overlay {
4588
5121
  background: rgba(0, 0, 0, 0);
@@ -4597,9 +5130,9 @@ body.with-panel-left-reveal .panel-overlay {
4597
5130
  -webkit-transform: translate3d(260px, 0, 0);
4598
5131
  transform: translate3d(260px, 0, 0);
4599
5132
  }
4600
- body.with-panel-left-cover .panel-left {
4601
- -webkit-transform: translate3d(260px, 0, 0);
4602
- transform: translate3d(260px, 0, 0);
5133
+ body.with-panel-left-cover .panel.panel-left {
5134
+ -webkit-transform: translate3d(0, 0, 0);
5135
+ transform: translate3d(0, 0, 0);
4603
5136
  }
4604
5137
  body.with-panel-right-reveal .views {
4605
5138
  -webkit-transform: translate3d(-260px, 0, 0);
@@ -4609,9 +5142,9 @@ body.with-panel-right-reveal .panel-overlay {
4609
5142
  -webkit-transform: translate3d(-260px, 0, 0);
4610
5143
  transform: translate3d(-260px, 0, 0);
4611
5144
  }
4612
- body.with-panel-right-cover .panel-right {
4613
- -webkit-transform: translate3d(-260px, 0, 0);
4614
- transform: translate3d(-260px, 0, 0);
5145
+ body.with-panel-right-cover .panel.panel-right {
5146
+ -webkit-transform: translate3d(0, 0, 0);
5147
+ transform: translate3d(0, 0, 0);
4615
5148
  }
4616
5149
  body.panel-closing .panel-overlay {
4617
5150
  display: block;
@@ -4623,6 +5156,10 @@ body.panel-closing .views {
4623
5156
  -moz-transition-property: -moz-transform, box-shadow;
4624
5157
  transition-property: transform, box-shadow;
4625
5158
  }
5159
+ body.panel-closing .panel.not-animated ~ .views {
5160
+ -webkit-transition-duration: 0ms;
5161
+ transition-duration: 0ms;
5162
+ }
4626
5163
  /* === Images Lazy Loading === */
4627
5164
  .lazy-loaded.lazy-fadeIn {
4628
5165
  -webkit-animation: lazyFadeIn 600ms;
@@ -4674,6 +5211,10 @@ body.panel-closing .views {
4674
5211
  -ms-flex: 0 0 auto;
4675
5212
  flex-shrink: 0;
4676
5213
  }
5214
+ .tabs-animated-wrap.not-animated > .tabs {
5215
+ -webkit-transition-duration: 0ms;
5216
+ transition-duration: 0ms;
5217
+ }
4677
5218
  .tabs-swipeable-wrap {
4678
5219
  height: 100%;
4679
5220
  }
@@ -4722,10 +5263,8 @@ body.panel-closing .views {
4722
5263
  .message:first-child {
4723
5264
  margin-top: 8px;
4724
5265
  }
4725
- .message.message-pic assets {
5266
+ .message.message-pic img {
4726
5267
  display: block;
4727
- height: auto;
4728
- max-width: 100%;
4729
5268
  }
4730
5269
  .message-name,
4731
5270
  .message-label,
@@ -4779,6 +5318,10 @@ body.panel-closing .views {
4779
5318
  -webkit-transform: translate3d(0, 0, 0);
4780
5319
  transform: translate3d(0, 0, 0);
4781
5320
  }
5321
+ .message-text img {
5322
+ max-width: 100%;
5323
+ height: auto;
5324
+ }
4782
5325
  .message-pic .message-text {
4783
5326
  padding: 8px;
4784
5327
  }
@@ -4786,7 +5329,7 @@ body.panel-closing .views {
4786
5329
  font-size: 12px;
4787
5330
  margin-top: 4px;
4788
5331
  }
4789
- .message-pic assets + .message-date {
5332
+ .message-pic img + .message-date {
4790
5333
  margin-top: 8px;
4791
5334
  }
4792
5335
  .message-sent {
@@ -4899,28 +5442,37 @@ body.panel-closing .views {
4899
5442
  }
4900
5443
  }
4901
5444
  /* === Statusbar overlay === */
4902
- html.with-statusbar-overlay body {
4903
- padding-top: 20px;
5445
+ html.with-statusbar-overlay .framework7-root {
5446
+ padding-top: 24px;
4904
5447
  box-sizing: border-box;
4905
5448
  }
4906
- html.with-statusbar-overlay body .statusbar-overlay {
5449
+ html.with-statusbar-overlay .framework7-root .statusbar-overlay {
4907
5450
  display: block;
4908
5451
  }
4909
- html.with-statusbar-overlay body .panel {
4910
- padding-top: 20px;
5452
+ html.with-statusbar-overlay .framework7-root .panel {
5453
+ padding-top: 24px;
4911
5454
  }
4912
5455
  .statusbar-overlay {
4913
- background: #2196f3;
5456
+ background: #0D47A1;
4914
5457
  z-index: 10000;
4915
5458
  position: absolute;
4916
5459
  left: 0;
4917
5460
  top: 0;
4918
- height: 20px;
5461
+ height: 24px;
4919
5462
  width: 100%;
4920
5463
  display: none;
4921
5464
  -webkit-transition-duration: 300ms;
4922
5465
  transition-duration: 300ms;
4923
5466
  }
5467
+ html.with-statusbar-overlay.ios .framework7-root {
5468
+ padding-top: 20px;
5469
+ }
5470
+ html.with-statusbar-overlay.ios .framework7-root .panel {
5471
+ padding-top: 20px;
5472
+ }
5473
+ html.ios .statusbar-overlay {
5474
+ height: 20px;
5475
+ }
4924
5476
  /* ===
4925
5477
  Preloader
4926
5478
  By Rudi Theunissen (https://github.com/rtheunissen/md-preloader)
@@ -4946,9 +5498,6 @@ html.with-statusbar-overlay body .panel {
4946
5498
  -webkit-animation: preloader-arc 1320ms cubic-bezier(0.8, 0, 0.4, 0.8) infinite;
4947
5499
  animation: preloader-arc 1320ms cubic-bezier(0.8, 0, 0.4, 0.8) infinite;
4948
5500
  }
4949
- .preloader.preloader-white svg circle {
4950
- stroke: #fff;
4951
- }
4952
5501
  @-webkit-keyframes preloader-outer {
4953
5502
  0% {
4954
5503
  -webkit-transform: rotate(0);
@@ -5073,6 +5622,14 @@ html.with-statusbar-overlay body .panel {
5073
5622
  -webkit-animation-name: preloader-right-rotate;
5074
5623
  animation-name: preloader-right-rotate;
5075
5624
  }
5625
+ .color-multi .preloader-inner .preloader-inner-left .preloader-inner-half-circle {
5626
+ -webkit-animation-name: preloader-left-rotate-multicolor;
5627
+ animation-name: preloader-left-rotate-multicolor;
5628
+ }
5629
+ .color-multi .preloader-inner .preloader-inner-right .preloader-inner-half-circle {
5630
+ -webkit-animation-name: preloader-right-rotate-multicolor;
5631
+ animation-name: preloader-right-rotate-multicolor;
5632
+ }
5076
5633
  @-webkit-keyframes preloader-left-rotate {
5077
5634
  0%,
5078
5635
  100% {
@@ -5161,6 +5718,86 @@ html.with-statusbar-overlay body .panel {
5161
5718
  transform: rotate(1080deg);
5162
5719
  }
5163
5720
  }
5721
+ @-webkit-keyframes preloader-left-rotate-multicolor {
5722
+ 0%,
5723
+ 100% {
5724
+ border-left-color: #4285F4;
5725
+ -webkit-transform: rotate(130deg);
5726
+ }
5727
+ 75% {
5728
+ border-left-color: #1B9A59;
5729
+ border-top-color: #1B9A59;
5730
+ }
5731
+ 50% {
5732
+ border-left-color: #F7C223;
5733
+ border-top-color: #F7C223;
5734
+ -webkit-transform: rotate(-5deg);
5735
+ }
5736
+ 25% {
5737
+ border-left-color: #DE3E35;
5738
+ border-top-color: #DE3E35;
5739
+ }
5740
+ }
5741
+ @keyframes preloader-left-rotate-multicolor {
5742
+ 0%,
5743
+ 100% {
5744
+ border-left-color: #4285F4;
5745
+ transform: rotate(130deg);
5746
+ }
5747
+ 75% {
5748
+ border-left-color: #1B9A59;
5749
+ border-top-color: #1B9A59;
5750
+ }
5751
+ 50% {
5752
+ border-left-color: #F7C223;
5753
+ border-top-color: #F7C223;
5754
+ transform: rotate(-5deg);
5755
+ }
5756
+ 25% {
5757
+ border-left-color: #DE3E35;
5758
+ border-top-color: #DE3E35;
5759
+ }
5760
+ }
5761
+ @-webkit-keyframes preloader-right-rotate-multicolor {
5762
+ 0%,
5763
+ 100% {
5764
+ border-right-color: #4285F4;
5765
+ -webkit-transform: rotate(-130deg);
5766
+ }
5767
+ 75% {
5768
+ border-right-color: #1B9A59;
5769
+ border-top-color: #1B9A59;
5770
+ }
5771
+ 50% {
5772
+ border-right-color: #F7C223;
5773
+ border-top-color: #F7C223;
5774
+ -webkit-transform: rotate(5deg);
5775
+ }
5776
+ 25% {
5777
+ border-top-color: #DE3E35;
5778
+ border-right-color: #DE3E35;
5779
+ }
5780
+ }
5781
+ @keyframes preloader-right-rotate-multicolor {
5782
+ 0%,
5783
+ 100% {
5784
+ border-right-color: #4285F4;
5785
+ transform: rotate(-130deg);
5786
+ }
5787
+ 75% {
5788
+ border-right-color: #1B9A59;
5789
+ border-top-color: #1B9A59;
5790
+ }
5791
+ 50% {
5792
+ border-right-color: #F7C223;
5793
+ border-top-color: #F7C223;
5794
+ transform: rotate(5deg);
5795
+ }
5796
+ 25% {
5797
+ border-top-color: #DE3E35;
5798
+ border-right-color: #DE3E35;
5799
+ }
5800
+ }
5164
5801
  /* === Progress Bar === */
5165
5802
  .progressbar,
5166
5803
  .progressbar-infinite {
@@ -5215,7 +5852,12 @@ html.with-statusbar-overlay body .panel {
5215
5852
  -webkit-animation: progressbar-infinite-2 2s linear infinite;
5216
5853
  animation: progressbar-infinite-2 2s linear infinite;
5217
5854
  }
5218
- html.with-statusbar-overlay body > .progressbar-infinite {
5855
+ html.with-statusbar-overlay body > .progressbar-infinite,
5856
+ html.with-statusbar-overlay .framework7-root > .progressbar-infinite {
5857
+ top: 24px;
5858
+ }
5859
+ html.with-statusbar-overlay.ios body > .progressbar-infinite,
5860
+ html.with-statusbar-overlay.ios .framework7-root > .progressbar-infinite {
5219
5861
  top: 20px;
5220
5862
  }
5221
5863
  .progressbar-infinite.color-multi {
@@ -5244,12 +5886,14 @@ body > .progressbar,
5244
5886
  .page > .progressbar,
5245
5887
  .panel > .progressbar,
5246
5888
  .popup > .progressbar,
5889
+ .framework7-root > .progressbar,
5247
5890
  body > .progressbar-infinite,
5248
5891
  .view > .progressbar-infinite,
5249
5892
  .views > .progressbar-infinite,
5250
5893
  .page > .progressbar-infinite,
5251
5894
  .panel > .progressbar-infinite,
5252
- .popup > .progressbar-infinite {
5895
+ .popup > .progressbar-infinite,
5896
+ .framework7-root > .progressbar-infinite {
5253
5897
  position: absolute;
5254
5898
  left: 0;
5255
5899
  top: 0;
@@ -5265,7 +5909,12 @@ body > .progressbar-infinite,
5265
5909
  -webkit-animation: progressbar-out 300ms forwards;
5266
5910
  animation: progressbar-out 300ms forwards;
5267
5911
  }
5268
- html.with-statusbar-overlay body > .progressbar {
5912
+ html.with-statusbar-overlay body > .progressbar,
5913
+ html.with-statusbar-overlay .framework7-root > .progressbar {
5914
+ top: 24px;
5915
+ }
5916
+ html.with-statusbar-overlay.ios body > .progressbar,
5917
+ html.with-statusbar-overlay.ios .framework7-root > .progressbar {
5269
5918
  top: 20px;
5270
5919
  }
5271
5920
  @-webkit-keyframes progressbar-in {
@@ -5468,7 +6117,6 @@ html.with-statusbar-overlay body > .progressbar {
5468
6117
  }
5469
6118
  /* === Pull To Refresh === */
5470
6119
  .pull-to-refresh-layer {
5471
- position: absolute;
5472
6120
  position: relative;
5473
6121
  margin-top: -48px;
5474
6122
  left: 0;
@@ -5534,6 +6182,11 @@ html.with-statusbar-overlay body > .progressbar {
5534
6182
  -webkit-transform: rotate(180deg) translate3d(0, 0, 0);
5535
6183
  transform: rotate(180deg) translate3d(0, 0, 0);
5536
6184
  }
6185
+ /* === Infinite Scroll Preloader === */
6186
+ .infinite-scroll-preloader {
6187
+ text-align: center;
6188
+ padding: 8px 0;
6189
+ }
5537
6190
  /* === Autocomplete === */
5538
6191
  .autocomplete-page .autocomplete-found {
5539
6192
  display: block;
@@ -5607,132 +6260,692 @@ html.with-statusbar-overlay body > .progressbar {
5607
6260
  font-weight: normal;
5608
6261
  color: #212121;
5609
6262
  }
5610
- /* === Swiper === */
5611
- .swiper-container {
5612
- margin: 0 auto;
5613
- position: relative;
5614
- overflow: hidden;
5615
- /* Fix of Webkit flickering */
5616
- z-index: 1;
5617
- }
5618
- .swiper-container-no-flexbox .swiper-slide {
5619
- float: left;
6263
+ /* === Timeline === */
6264
+ .timeline {
6265
+ margin: 32px 0;
6266
+ padding: 0 16px;
6267
+ box-sizing: border-box;
5620
6268
  }
5621
- .swiper-container-vertical > .swiper-wrapper {
5622
- -webkit-box-orient: vertical;
5623
- -moz-box-orient: vertical;
5624
- -ms-flex-direction: column;
5625
- -webkit-flex-direction: column;
5626
- flex-direction: column;
6269
+ .content-block-inner .timeline {
6270
+ padding: 0;
6271
+ margin: 0;
5627
6272
  }
5628
- .swiper-wrapper {
5629
- position: relative;
5630
- width: 100%;
5631
- height: 100%;
5632
- z-index: 1;
6273
+ .timeline-item {
5633
6274
  display: -webkit-box;
5634
- display: -moz-box;
5635
6275
  display: -ms-flexbox;
5636
6276
  display: -webkit-flex;
5637
6277
  display: flex;
5638
- -webkit-transition-property: -webkit-transform;
5639
- -moz-transition-property: -moz-transform;
5640
- -o-transition-property: -o-transform;
5641
- -ms-transition-property: -ms-transform;
5642
- transition-property: transform;
5643
- -webkit-box-sizing: content-box;
5644
- -moz-box-sizing: content-box;
5645
- box-sizing: content-box;
5646
- }
5647
- .swiper-container-android .swiper-slide,
5648
- .swiper-wrapper {
5649
- -webkit-transform: translate3d(0px, 0, 0);
5650
- -moz-transform: translate3d(0px, 0, 0);
5651
- -o-transform: translate(0px, 0px);
5652
- -ms-transform: translate3d(0px, 0, 0);
5653
- transform: translate3d(0px, 0, 0);
5654
- }
5655
- .swiper-container-multirow > .swiper-wrapper {
5656
- -webkit-box-lines: multiple;
5657
- -moz-box-lines: multiple;
5658
- -ms-flex-wrap: wrap;
5659
- -webkit-flex-wrap: wrap;
5660
- flex-wrap: wrap;
6278
+ -webkit-box-pack: start;
6279
+ -ms-flex-pack: start;
6280
+ -webkit-justify-content: flex-start;
6281
+ justify-content: flex-start;
6282
+ overflow: hidden;
6283
+ padding: 2px 0px 16px;
6284
+ box-sizing: border-box;
6285
+ position: relative;
5661
6286
  }
5662
- .swiper-container-free-mode > .swiper-wrapper {
5663
- -webkit-transition-timing-function: ease-out;
5664
- -moz-transition-timing-function: ease-out;
5665
- -ms-transition-timing-function: ease-out;
5666
- -o-transition-timing-function: ease-out;
5667
- transition-timing-function: ease-out;
5668
- margin: 0 auto;
6287
+ .timeline-item:last-child {
6288
+ padding-bottom: 2px;
5669
6289
  }
5670
- .swiper-slide {
6290
+ .timeline-item-date {
6291
+ -webkit-box-flex: 0;
5671
6292
  -webkit-flex-shrink: 0;
5672
6293
  -ms-flex: 0 0 auto;
5673
6294
  flex-shrink: 0;
5674
- width: 100%;
5675
- height: 100%;
5676
- position: relative;
6295
+ width: 50px;
6296
+ text-align: right;
6297
+ box-sizing: border-box;
5677
6298
  }
5678
- /* Auto Height */
5679
- .swiper-container-autoheight,
5680
- .swiper-container-autoheight .swiper-slide {
5681
- height: auto;
6299
+ .timeline-item-date small {
6300
+ font-size: 10px;
5682
6301
  }
5683
- .swiper-container-autoheight .swiper-wrapper {
5684
- -webkit-box-align: start;
5685
- -ms-flex-align: start;
5686
- -webkit-align-items: flex-start;
5687
- align-items: flex-start;
5688
- -webkit-transition-property: -webkit-transform, height;
5689
- -moz-transition-property: -moz-transform;
5690
- -o-transition-property: -o-transform;
5691
- -ms-transition-property: -ms-transform;
5692
- transition-property: transform, height;
6302
+ .timeline-item-content {
6303
+ margin: 2px;
6304
+ min-width: 0;
6305
+ position: relative;
6306
+ -webkit-box-flex: 10;
6307
+ -webkit-flex-shrink: 10;
6308
+ -ms-flex: 0 10 auto;
6309
+ flex-shrink: 10;
5693
6310
  }
5694
- /* a11y */
5695
- .swiper-container .swiper-notification {
5696
- position: absolute;
5697
- left: 0;
5698
- top: 0;
5699
- pointer-events: none;
5700
- opacity: 0;
5701
- z-index: -1000;
6311
+ .timeline-item-content p:first-child,
6312
+ .timeline-item-content ul:first-child,
6313
+ .timeline-item-content ol:first-child,
6314
+ .timeline-item-content h1:first-child,
6315
+ .timeline-item-content h2:first-child,
6316
+ .timeline-item-content h3:first-child,
6317
+ .timeline-item-content h4:first-child {
6318
+ margin-top: 0;
5702
6319
  }
5703
- /* IE10 Windows Phone 8 Fixes */
5704
- .swiper-wp8-horizontal {
5705
- -ms-touch-action: pan-y;
5706
- touch-action: pan-y;
6320
+ .timeline-item-content p:last-child,
6321
+ .timeline-item-content ul:last-child,
6322
+ .timeline-item-content ol:last-child,
6323
+ .timeline-item-content h1:last-child,
6324
+ .timeline-item-content h2:last-child,
6325
+ .timeline-item-content h3:last-child,
6326
+ .timeline-item-content h4:last-child {
6327
+ margin-bottom: 0;
5707
6328
  }
5708
- .swiper-wp8-vertical {
5709
- -ms-touch-action: pan-x;
5710
- touch-action: pan-x;
6329
+ .timeline-item-content .card,
6330
+ .timeline-item-content.card,
6331
+ .timeline-item-content .list-block,
6332
+ .timeline-item-content.list-block,
6333
+ .timeline-item-content .content-block,
6334
+ .timeline-item-content.content-block {
6335
+ margin: 0;
6336
+ width: 100%;
5711
6337
  }
5712
- /* Arrows */
5713
- .swiper-button-prev,
5714
- .swiper-button-next {
5715
- position: absolute;
5716
- top: 50%;
5717
- width: 27px;
5718
- height: 44px;
5719
- margin-top: -22px;
5720
- z-index: 10;
5721
- cursor: pointer;
5722
- -moz-background-size: 27px 44px;
5723
- -webkit-background-size: 27px 44px;
5724
- background-size: 27px 44px;
5725
- background-position: center;
5726
- background-repeat: no-repeat;
6338
+ .timeline-item-content .card + .card,
6339
+ .timeline-item-content .list-block + .card,
6340
+ .timeline-item-content .content-block + .card,
6341
+ .timeline-item-content .card + .list-block,
6342
+ .timeline-item-content .list-block + .list-block,
6343
+ .timeline-item-content .content-block + .list-block,
6344
+ .timeline-item-content .card + .content-block,
6345
+ .timeline-item-content .list-block + .content-block,
6346
+ .timeline-item-content .content-block + .content-block {
6347
+ margin: 16px 0 0;
6348
+ }
6349
+ .timeline-item-inner {
6350
+ border-radius: 2px;
6351
+ padding: 8px 16px;
6352
+ background: #fff;
6353
+ box-sizing: border-box;
6354
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
5727
6355
  }
5728
- .swiper-button-prev.swiper-button-disabled,
5729
- .swiper-button-next.swiper-button-disabled {
5730
- opacity: 0.35;
5731
- cursor: auto;
5732
- pointer-events: none;
6356
+ .timeline-item-inner .content-block {
6357
+ padding: 0;
6358
+ color: inherit;
5733
6359
  }
5734
- .swiper-button-prev,
5735
- .swiper-container-rtl .swiper-button-next {
6360
+ .timeline-item-inner .content-block-inner {
6361
+ padding-left: 0;
6362
+ padding-right: 0;
6363
+ margin: 0;
6364
+ }
6365
+ .timeline-item-inner .content-block-inner:before {
6366
+ display: none;
6367
+ }
6368
+ .timeline-item-inner .content-block-inner:after {
6369
+ display: none;
6370
+ }
6371
+ .timeline-item-inner .list-block ul:before {
6372
+ display: none;
6373
+ }
6374
+ .timeline-item-inner .list-block ul:after {
6375
+ display: none;
6376
+ }
6377
+ .timeline-item-inner + .timeline-item-inner {
6378
+ margin-top: 16px;
6379
+ }
6380
+ .timeline-item-divider {
6381
+ width: 1px;
6382
+ margin: 0 16px;
6383
+ position: relative;
6384
+ width: 10px;
6385
+ height: 10px;
6386
+ background: #bbb;
6387
+ border-radius: 50%;
6388
+ margin-top: 3px;
6389
+ -webkit-box-flex: 0;
6390
+ -webkit-flex-shrink: 0;
6391
+ -ms-flex: 0 0 auto;
6392
+ flex-shrink: 0;
6393
+ }
6394
+ .timeline-item-divider:after,
6395
+ .timeline-item-divider:before {
6396
+ content: ' ';
6397
+ width: 1px;
6398
+ height: 100vh;
6399
+ position: absolute;
6400
+ left: 50%;
6401
+ background: inherit;
6402
+ -webkit-transform: translate3d(-50%, 0, 0);
6403
+ transform: translate3d(-50%, 0, 0);
6404
+ }
6405
+ .timeline-item-divider:after {
6406
+ top: 100%;
6407
+ }
6408
+ .timeline-item-divider:before {
6409
+ bottom: 100%;
6410
+ }
6411
+ .timeline-item:last-child .timeline-item-divider:after {
6412
+ display: none;
6413
+ }
6414
+ .timeline-item:first-child .timeline-item-divider:before {
6415
+ display: none;
6416
+ }
6417
+ .timeline-item-time {
6418
+ color: rgba(0, 0, 0, 0.54);
6419
+ margin-top: 16px;
6420
+ font-size: 13px;
6421
+ }
6422
+ .timeline-item-time:first-child {
6423
+ margin-top: 0;
6424
+ }
6425
+ .timeline-item-title + .timeline-item-time {
6426
+ margin-top: 0;
6427
+ }
6428
+ .timeline-item-title {
6429
+ font-size: 16px;
6430
+ }
6431
+ .timeline-sides .timeline-item {
6432
+ margin-left: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6433
+ margin-left: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6434
+ margin-left: calc(50% - (32px + 10px) / 2 - 50px);
6435
+ margin-right: 0;
6436
+ }
6437
+ .timeline-sides .timeline-item .timeline-item-date {
6438
+ text-align: right;
6439
+ }
6440
+ .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
6441
+ -webkit-box-direction: reverse;
6442
+ -moz-box-direction: reverse;
6443
+ -ms-flex-direction: row-reverse;
6444
+ -webkit-flex-direction: row-reverse;
6445
+ flex-direction: row-reverse;
6446
+ margin-right: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6447
+ margin-right: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6448
+ margin-right: calc(50% - (32px + 10px) / 2 - 50px);
6449
+ margin-left: 0;
6450
+ }
6451
+ .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
6452
+ text-align: left;
6453
+ }
6454
+ .timeline-sides .timeline-item-left {
6455
+ -webkit-box-direction: reverse;
6456
+ -moz-box-direction: reverse;
6457
+ -ms-flex-direction: row-reverse;
6458
+ -webkit-flex-direction: row-reverse;
6459
+ flex-direction: row-reverse;
6460
+ margin-right: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6461
+ margin-right: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6462
+ margin-right: calc(50% - (32px + 10px) / 2 - 50px);
6463
+ margin-left: 0;
6464
+ }
6465
+ .timeline-sides .timeline-item-left .timeline-item-date {
6466
+ text-align: left;
6467
+ }
6468
+ .timeline-sides .timeline-item-right {
6469
+ margin-left: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6470
+ margin-left: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6471
+ margin-left: calc(50% - (32px + 10px) / 2 - 50px);
6472
+ margin-right: 0;
6473
+ }
6474
+ .timeline-sides .timeline-item-right .timeline-item-date {
6475
+ text-align: right;
6476
+ }
6477
+ @media (min-width: 768px) {
6478
+ .tablet-sides .timeline-item {
6479
+ margin-left: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6480
+ margin-left: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6481
+ margin-left: calc(50% - (32px + 10px) / 2 - 50px);
6482
+ margin-right: 0;
6483
+ }
6484
+ .tablet-sides .timeline-item .timeline-item-date {
6485
+ text-align: right;
6486
+ }
6487
+ .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
6488
+ -webkit-box-direction: reverse;
6489
+ -moz-box-direction: reverse;
6490
+ -ms-flex-direction: row-reverse;
6491
+ -webkit-flex-direction: row-reverse;
6492
+ flex-direction: row-reverse;
6493
+ margin-right: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6494
+ margin-right: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6495
+ margin-right: calc(50% - (32px + 10px) / 2 - 50px);
6496
+ margin-left: 0;
6497
+ }
6498
+ .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
6499
+ text-align: left;
6500
+ }
6501
+ .tablet-sides .timeline-item-left {
6502
+ -webkit-box-direction: reverse;
6503
+ -moz-box-direction: reverse;
6504
+ -ms-flex-direction: row-reverse;
6505
+ -webkit-flex-direction: row-reverse;
6506
+ flex-direction: row-reverse;
6507
+ margin-right: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6508
+ margin-right: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6509
+ margin-right: calc(50% - (32px + 10px) / 2 - 50px);
6510
+ margin-left: 0;
6511
+ }
6512
+ .tablet-sides .timeline-item-left .timeline-item-date {
6513
+ text-align: left;
6514
+ }
6515
+ .tablet-sides .timeline-item-right {
6516
+ margin-left: -moz-calc(50% - (32px + 10px) / 2 - 50px);
6517
+ margin-left: -webkit-calc(50% - (32px + 10px) / 2 - 50px);
6518
+ margin-left: calc(50% - (32px + 10px) / 2 - 50px);
6519
+ margin-right: 0;
6520
+ }
6521
+ .tablet-sides .timeline-item-right .timeline-item-date {
6522
+ text-align: right;
6523
+ }
6524
+ }
6525
+ .timeline-horizontal {
6526
+ padding: 0;
6527
+ margin: 0;
6528
+ height: 100%;
6529
+ display: -webkit-box;
6530
+ display: -ms-flexbox;
6531
+ display: -webkit-flex;
6532
+ display: flex;
6533
+ position: relative;
6534
+ }
6535
+ .timeline-horizontal .timeline-item {
6536
+ display: block;
6537
+ width: 33.33333333vw;
6538
+ margin: 0;
6539
+ padding: 0;
6540
+ -webkit-box-flex: 0;
6541
+ -webkit-flex-shrink: 0;
6542
+ -ms-flex: 0 0 auto;
6543
+ flex-shrink: 0;
6544
+ padding-top: 34px;
6545
+ padding-bottom: 12px;
6546
+ position: relative;
6547
+ height: 100%;
6548
+ }
6549
+ .timeline-horizontal .timeline-item:after {
6550
+ content: '';
6551
+ position: absolute;
6552
+ right: 0;
6553
+ top: 0;
6554
+ left: auto;
6555
+ bottom: auto;
6556
+ width: 1px;
6557
+ height: 100%;
6558
+ background-color: rgba(0, 0, 0, 0.12);
6559
+ display: block;
6560
+ z-index: 15;
6561
+ -webkit-transform-origin: 100% 50%;
6562
+ transform-origin: 100% 50%;
6563
+ }
6564
+ html.pixel-ratio-2 .timeline-horizontal .timeline-item:after {
6565
+ -webkit-transform: scaleX(0.5);
6566
+ transform: scaleX(0.5);
6567
+ }
6568
+ html.pixel-ratio-3 .timeline-horizontal .timeline-item:after {
6569
+ -webkit-transform: scaleX(0.33);
6570
+ transform: scaleX(0.33);
6571
+ }
6572
+ .timeline-horizontal .timeline-item:before {
6573
+ content: '';
6574
+ position: absolute;
6575
+ left: 0;
6576
+ top: 0;
6577
+ bottom: auto;
6578
+ right: auto;
6579
+ height: 1px;
6580
+ width: 100%;
6581
+ background-color: rgba(0, 0, 0, 0.12);
6582
+ display: block;
6583
+ z-index: 15;
6584
+ -webkit-transform-origin: 50% 0%;
6585
+ transform-origin: 50% 0%;
6586
+ }
6587
+ html.pixel-ratio-2 .timeline-horizontal .timeline-item:before {
6588
+ -webkit-transform: scaleY(0.5);
6589
+ transform: scaleY(0.5);
6590
+ }
6591
+ html.pixel-ratio-3 .timeline-horizontal .timeline-item:before {
6592
+ -webkit-transform: scaleY(0.33);
6593
+ transform: scaleY(0.33);
6594
+ }
6595
+ .timeline-horizontal .timeline-item-date {
6596
+ background: #2196f3;
6597
+ width: auto;
6598
+ text-align: left;
6599
+ padding: 0px 12px;
6600
+ line-height: 34px;
6601
+ position: absolute;
6602
+ left: 0;
6603
+ top: 0;
6604
+ width: 100%;
6605
+ height: 34px;
6606
+ color: #fff;
6607
+ }
6608
+ .timeline-horizontal .timeline-item-date:after {
6609
+ content: '';
6610
+ position: absolute;
6611
+ left: 0;
6612
+ bottom: 0;
6613
+ right: auto;
6614
+ top: auto;
6615
+ height: 1px;
6616
+ width: 100%;
6617
+ background-color: rgba(0, 0, 0, 0.12);
6618
+ display: block;
6619
+ z-index: 15;
6620
+ -webkit-transform-origin: 50% 100%;
6621
+ transform-origin: 50% 100%;
6622
+ }
6623
+ html.pixel-ratio-2 .timeline-horizontal .timeline-item-date:after {
6624
+ -webkit-transform: scaleY(0.5);
6625
+ transform: scaleY(0.5);
6626
+ }
6627
+ html.pixel-ratio-3 .timeline-horizontal .timeline-item-date:after {
6628
+ -webkit-transform: scaleY(0.33);
6629
+ transform: scaleY(0.33);
6630
+ }
6631
+ .timeline-horizontal .timeline-item-content {
6632
+ padding: 12px;
6633
+ overflow: auto;
6634
+ -webkit-overflow-scrolling: touch;
6635
+ margin: 0;
6636
+ height: -webkit-calc(100% - 12px);
6637
+ height: -moz-calc(100% - 12px);
6638
+ height: calc(100% - 12px);
6639
+ }
6640
+ .timeline-horizontal .timeline-item-divider {
6641
+ display: none;
6642
+ }
6643
+ .timeline-horizontal.col-100 .timeline-item {
6644
+ width: 100vw;
6645
+ }
6646
+ .timeline-horizontal.col-95 .timeline-item {
6647
+ width: 95vw;
6648
+ }
6649
+ .timeline-horizontal.col-90 .timeline-item {
6650
+ width: 90vw;
6651
+ }
6652
+ .timeline-horizontal.col-85 .timeline-item {
6653
+ width: 85vw;
6654
+ }
6655
+ .timeline-horizontal.col-80 .timeline-item {
6656
+ width: 80vw;
6657
+ }
6658
+ .timeline-horizontal.col-75 .timeline-item {
6659
+ width: 75vw;
6660
+ }
6661
+ .timeline-horizontal.col-70 .timeline-item {
6662
+ width: 70vw;
6663
+ }
6664
+ .timeline-horizontal.col-66 .timeline-item {
6665
+ width: 66.66666666666666vw;
6666
+ }
6667
+ .timeline-horizontal.col-65 .timeline-item {
6668
+ width: 65vw;
6669
+ }
6670
+ .timeline-horizontal.col-60 .timeline-item {
6671
+ width: 60vw;
6672
+ }
6673
+ .timeline-horizontal.col-55 .timeline-item {
6674
+ width: 55vw;
6675
+ }
6676
+ .timeline-horizontal.col-50 .timeline-item {
6677
+ width: 50vw;
6678
+ }
6679
+ .timeline-horizontal.col-45 .timeline-item {
6680
+ width: 45vw;
6681
+ }
6682
+ .timeline-horizontal.col-40 .timeline-item {
6683
+ width: 40vw;
6684
+ }
6685
+ .timeline-horizontal.col-35 .timeline-item {
6686
+ width: 35vw;
6687
+ }
6688
+ .timeline-horizontal.col-33 .timeline-item {
6689
+ width: 33.333333333333336vw;
6690
+ }
6691
+ .timeline-horizontal.col-30 .timeline-item {
6692
+ width: 30vw;
6693
+ }
6694
+ .timeline-horizontal.col-25 .timeline-item {
6695
+ width: 25vw;
6696
+ }
6697
+ .timeline-horizontal.col-20 .timeline-item {
6698
+ width: 20vw;
6699
+ }
6700
+ .timeline-horizontal.col-15 .timeline-item {
6701
+ width: 15vw;
6702
+ }
6703
+ .timeline-horizontal.col-10 .timeline-item {
6704
+ width: 10vw;
6705
+ }
6706
+ .timeline-horizontal.col-5 .timeline-item {
6707
+ width: 5vw;
6708
+ }
6709
+ @media all and (min-width: 768px) {
6710
+ .timeline-horizontal.tablet-100 .timeline-item {
6711
+ width: 100vw;
6712
+ }
6713
+ .timeline-horizontal.tablet-95 .timeline-item {
6714
+ width: 95vw;
6715
+ }
6716
+ .timeline-horizontal.tablet-90 .timeline-item {
6717
+ width: 90vw;
6718
+ }
6719
+ .timeline-horizontal.tablet-85 .timeline-item {
6720
+ width: 85vw;
6721
+ }
6722
+ .timeline-horizontal.tablet-80 .timeline-item {
6723
+ width: 80vw;
6724
+ }
6725
+ .timeline-horizontal.tablet-75 .timeline-item {
6726
+ width: 75vw;
6727
+ }
6728
+ .timeline-horizontal.tablet-70 .timeline-item {
6729
+ width: 70vw;
6730
+ }
6731
+ .timeline-horizontal.tablet-66 .timeline-item {
6732
+ width: 66.66666666666666vw;
6733
+ }
6734
+ .timeline-horizontal.tablet-65 .timeline-item {
6735
+ width: 65vw;
6736
+ }
6737
+ .timeline-horizontal.tablet-60 .timeline-item {
6738
+ width: 60vw;
6739
+ }
6740
+ .timeline-horizontal.tablet-55 .timeline-item {
6741
+ width: 55vw;
6742
+ }
6743
+ .timeline-horizontal.tablet-50 .timeline-item {
6744
+ width: 50vw;
6745
+ }
6746
+ .timeline-horizontal.tablet-45 .timeline-item {
6747
+ width: 45vw;
6748
+ }
6749
+ .timeline-horizontal.tablet-40 .timeline-item {
6750
+ width: 40vw;
6751
+ }
6752
+ .timeline-horizontal.tablet-35 .timeline-item {
6753
+ width: 35vw;
6754
+ }
6755
+ .timeline-horizontal.tablet-33 .timeline-item {
6756
+ width: 33.333333333333336vw;
6757
+ }
6758
+ .timeline-horizontal.tablet-30 .timeline-item {
6759
+ width: 30vw;
6760
+ }
6761
+ .timeline-horizontal.tablet-25 .timeline-item {
6762
+ width: 25vw;
6763
+ }
6764
+ .timeline-horizontal.tablet-20 .timeline-item {
6765
+ width: 20vw;
6766
+ }
6767
+ .timeline-horizontal.tablet-15 .timeline-item {
6768
+ width: 15vw;
6769
+ }
6770
+ .timeline-horizontal.tablet-10 .timeline-item {
6771
+ width: 10vw;
6772
+ }
6773
+ .timeline-horizontal.tablet-5 .timeline-item {
6774
+ width: 5vw;
6775
+ }
6776
+ }
6777
+ .timeline-year,
6778
+ .timeline-month {
6779
+ display: -webkit-box;
6780
+ display: -ms-flexbox;
6781
+ display: -webkit-flex;
6782
+ display: flex;
6783
+ -webkit-box-flex: 0;
6784
+ -webkit-flex-shrink: 0;
6785
+ -ms-flex: 0 0 auto;
6786
+ flex-shrink: 0;
6787
+ padding-top: 24px;
6788
+ position: relative;
6789
+ box-sizing: border-box;
6790
+ height: 100%;
6791
+ }
6792
+ .timeline-year-title,
6793
+ .timeline-month-title {
6794
+ position: absolute;
6795
+ left: 0;
6796
+ top: 0;
6797
+ width: 100%;
6798
+ line-height: 24px;
6799
+ height: 24px;
6800
+ padding: 0 12px;
6801
+ box-sizing: border-box;
6802
+ background: #2196f3;
6803
+ color: #fff;
6804
+ }
6805
+ .timeline-year-title span,
6806
+ .timeline-month-title span {
6807
+ display: inline-block;
6808
+ position: -webkit-sticky;
6809
+ position: -moz-sticky;
6810
+ position: sticky;
6811
+ left: 12px;
6812
+ }
6813
+ .timeline-year-title {
6814
+ font-size: 16px;
6815
+ }
6816
+ .timeline-year-title span {
6817
+ margin-top: 2px;
6818
+ }
6819
+ .timeline-month-title span {
6820
+ margin-top: -2px;
6821
+ }
6822
+ /* === Swiper === */
6823
+ .swiper-container {
6824
+ margin-left: auto;
6825
+ margin-right: auto;
6826
+ position: relative;
6827
+ overflow: hidden;
6828
+ /* Fix of Webkit flickering */
6829
+ z-index: 1;
6830
+ }
6831
+ .swiper-container-no-flexbox .swiper-slide {
6832
+ float: left;
6833
+ }
6834
+ .swiper-container-vertical > .swiper-wrapper {
6835
+ -webkit-box-orient: vertical;
6836
+ -moz-box-orient: vertical;
6837
+ -ms-flex-direction: column;
6838
+ -webkit-flex-direction: column;
6839
+ flex-direction: column;
6840
+ }
6841
+ .swiper-wrapper {
6842
+ position: relative;
6843
+ width: 100%;
6844
+ height: 100%;
6845
+ z-index: 1;
6846
+ display: -webkit-box;
6847
+ display: -moz-box;
6848
+ display: -ms-flexbox;
6849
+ display: -webkit-flex;
6850
+ display: flex;
6851
+ -webkit-transition-property: -webkit-transform;
6852
+ -moz-transition-property: -moz-transform;
6853
+ -o-transition-property: -o-transform;
6854
+ -ms-transition-property: -ms-transform;
6855
+ transition-property: transform;
6856
+ -webkit-box-sizing: content-box;
6857
+ -moz-box-sizing: content-box;
6858
+ box-sizing: content-box;
6859
+ }
6860
+ .swiper-container-android .swiper-slide,
6861
+ .swiper-wrapper {
6862
+ -webkit-transform: translate3d(0px, 0, 0);
6863
+ -moz-transform: translate3d(0px, 0, 0);
6864
+ -o-transform: translate(0px, 0px);
6865
+ -ms-transform: translate3d(0px, 0, 0);
6866
+ transform: translate3d(0px, 0, 0);
6867
+ }
6868
+ .swiper-container-multirow > .swiper-wrapper {
6869
+ -webkit-box-lines: multiple;
6870
+ -moz-box-lines: multiple;
6871
+ -ms-flex-wrap: wrap;
6872
+ -webkit-flex-wrap: wrap;
6873
+ flex-wrap: wrap;
6874
+ }
6875
+ .swiper-container-free-mode > .swiper-wrapper {
6876
+ -webkit-transition-timing-function: ease-out;
6877
+ -moz-transition-timing-function: ease-out;
6878
+ -ms-transition-timing-function: ease-out;
6879
+ -o-transition-timing-function: ease-out;
6880
+ transition-timing-function: ease-out;
6881
+ margin: 0 auto;
6882
+ }
6883
+ .swiper-slide {
6884
+ -webkit-flex-shrink: 0;
6885
+ -ms-flex: 0 0 auto;
6886
+ flex-shrink: 0;
6887
+ width: 100%;
6888
+ height: 100%;
6889
+ position: relative;
6890
+ }
6891
+ /* Auto Height */
6892
+ .swiper-container-autoheight,
6893
+ .swiper-container-autoheight .swiper-slide {
6894
+ height: auto;
6895
+ }
6896
+ .swiper-container-autoheight .swiper-wrapper {
6897
+ -webkit-box-align: start;
6898
+ -ms-flex-align: start;
6899
+ -webkit-align-items: flex-start;
6900
+ align-items: flex-start;
6901
+ -webkit-transition-property: -webkit-transform, height;
6902
+ -moz-transition-property: -moz-transform;
6903
+ -o-transition-property: -o-transform;
6904
+ -ms-transition-property: -ms-transform;
6905
+ transition-property: transform, height;
6906
+ }
6907
+ /* a11y */
6908
+ .swiper-container .swiper-notification {
6909
+ position: absolute;
6910
+ left: 0;
6911
+ top: 0;
6912
+ pointer-events: none;
6913
+ opacity: 0;
6914
+ z-index: -1000;
6915
+ }
6916
+ /* IE10 Windows Phone 8 Fixes */
6917
+ .swiper-wp8-horizontal {
6918
+ -ms-touch-action: pan-y;
6919
+ touch-action: pan-y;
6920
+ }
6921
+ .swiper-wp8-vertical {
6922
+ -ms-touch-action: pan-x;
6923
+ touch-action: pan-x;
6924
+ }
6925
+ /* Arrows */
6926
+ .swiper-button-prev,
6927
+ .swiper-button-next {
6928
+ position: absolute;
6929
+ top: 50%;
6930
+ width: 27px;
6931
+ height: 44px;
6932
+ margin-top: -22px;
6933
+ z-index: 10;
6934
+ cursor: pointer;
6935
+ -moz-background-size: 27px 44px;
6936
+ -webkit-background-size: 27px 44px;
6937
+ background-size: 27px 44px;
6938
+ background-position: center;
6939
+ background-repeat: no-repeat;
6940
+ }
6941
+ .swiper-button-prev.swiper-button-disabled,
6942
+ .swiper-button-next.swiper-button-disabled {
6943
+ opacity: 0.35;
6944
+ cursor: auto;
6945
+ pointer-events: none;
6946
+ }
6947
+ .swiper-button-prev,
6948
+ .swiper-container-rtl .swiper-button-next {
5736
6949
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
5737
6950
  left: 10px;
5738
6951
  right: auto;
@@ -5760,6 +6973,15 @@ html.with-statusbar-overlay body > .progressbar {
5760
6973
  .swiper-pagination.swiper-pagination-hidden {
5761
6974
  opacity: 0;
5762
6975
  }
6976
+ /* Common Styles */
6977
+ .swiper-pagination-fraction,
6978
+ .swiper-pagination-custom,
6979
+ .swiper-container-horizontal > .swiper-pagination-bullets {
6980
+ bottom: 10px;
6981
+ left: 0;
6982
+ width: 100%;
6983
+ }
6984
+ /* Bullets */
5763
6985
  .swiper-pagination-bullet {
5764
6986
  width: 8px;
5765
6987
  height: 8px;
@@ -5768,11 +6990,24 @@ html.with-statusbar-overlay body > .progressbar {
5768
6990
  background: #000;
5769
6991
  opacity: 0.2;
5770
6992
  }
6993
+ button.swiper-pagination-bullet {
6994
+ border: none;
6995
+ margin: 0;
6996
+ padding: 0;
6997
+ box-shadow: none;
6998
+ -moz-appearance: none;
6999
+ -ms-appearance: none;
7000
+ -webkit-appearance: none;
7001
+ appearance: none;
7002
+ }
7003
+ .swiper-pagination-clickable .swiper-pagination-bullet {
7004
+ cursor: pointer;
7005
+ }
5771
7006
  .swiper-pagination-bullet-active {
5772
7007
  opacity: 1;
5773
7008
  background: #007aff;
5774
7009
  }
5775
- .swiper-container-vertical > .swiper-pagination {
7010
+ .swiper-container-vertical > .swiper-pagination-bullets {
5776
7011
  right: 10px;
5777
7012
  top: 50%;
5778
7013
  -webkit-transform: translate3d(0px, -50%, 0);
@@ -5781,17 +7016,53 @@ html.with-statusbar-overlay body > .progressbar {
5781
7016
  -ms-transform: translate3d(0px, -50%, 0);
5782
7017
  transform: translate3d(0px, -50%, 0);
5783
7018
  }
5784
- .swiper-container-vertical > .swiper-pagination .swiper-pagination-bullet {
7019
+ .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
5785
7020
  margin: 5px 0;
5786
7021
  display: block;
5787
7022
  }
5788
- .swiper-container-horizontal > .swiper-pagination {
5789
- bottom: 10px;
7023
+ .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
7024
+ margin: 0 5px;
7025
+ }
7026
+ /* Progress */
7027
+ .swiper-pagination-progress {
7028
+ background: rgba(0, 0, 0, 0.25);
7029
+ position: absolute;
7030
+ }
7031
+ .swiper-pagination-progress .swiper-pagination-progressbar {
7032
+ background: #007aff;
7033
+ position: absolute;
5790
7034
  left: 0;
7035
+ top: 0;
5791
7036
  width: 100%;
7037
+ height: 100%;
7038
+ -webkit-transform: scale(0);
7039
+ -ms-transform: scale(0);
7040
+ -o-transform: scale(0);
7041
+ transform: scale(0);
7042
+ -webkit-transform-origin: left top;
7043
+ -moz-transform-origin: left top;
7044
+ -ms-transform-origin: left top;
7045
+ -o-transform-origin: left top;
7046
+ transform-origin: left top;
7047
+ }
7048
+ .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
7049
+ -webkit-transform-origin: right top;
7050
+ -moz-transform-origin: right top;
7051
+ -ms-transform-origin: right top;
7052
+ -o-transform-origin: right top;
7053
+ transform-origin: right top;
7054
+ }
7055
+ .swiper-container-horizontal > .swiper-pagination-progress {
7056
+ width: 100%;
7057
+ height: 4px;
7058
+ left: 0;
7059
+ top: 0;
5792
7060
  }
5793
- .swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet {
5794
- margin: 0 5px;
7061
+ .swiper-container-vertical > .swiper-pagination-progress {
7062
+ width: 4px;
7063
+ height: 100%;
7064
+ left: 0;
7065
+ top: 0;
5795
7066
  }
5796
7067
  /* 3D Container */
5797
7068
  .swiper-container-3d {
@@ -5873,46 +7144,58 @@ html.with-statusbar-overlay body > .progressbar {
5873
7144
  /* Firefox 16+, IE10, Opera 12.50+ */
5874
7145
  }
5875
7146
  /* Coverflow */
5876
- .swiper-container-coverflow .swiper-wrapper {
7147
+ .swiper-container-coverflow .swiper-wrapper,
7148
+ .swiper-container-flip .swiper-wrapper {
5877
7149
  /* Windows 8 IE 10 fix */
5878
7150
  -ms-perspective: 1200px;
5879
7151
  }
5880
- /* Fade */
5881
- .swiper-container-fade.swiper-container-free-mode .swiper-slide {
5882
- -webkit-transition-timing-function: ease-out;
5883
- -moz-transition-timing-function: ease-out;
5884
- -ms-transition-timing-function: ease-out;
5885
- -o-transition-timing-function: ease-out;
5886
- transition-timing-function: ease-out;
7152
+ /* Cube + Flip */
7153
+ .swiper-container-cube,
7154
+ .swiper-container-flip {
7155
+ overflow: visible;
5887
7156
  }
5888
- .swiper-container-fade .swiper-slide {
7157
+ .swiper-container-cube .swiper-slide,
7158
+ .swiper-container-flip .swiper-slide {
5889
7159
  pointer-events: none;
7160
+ -webkit-backface-visibility: hidden;
7161
+ -moz-backface-visibility: hidden;
7162
+ -ms-backface-visibility: hidden;
7163
+ backface-visibility: hidden;
7164
+ z-index: 1;
5890
7165
  }
5891
- .swiper-container-fade .swiper-slide .swiper-slide {
7166
+ .swiper-container-cube .swiper-slide .swiper-slide,
7167
+ .swiper-container-flip .swiper-slide .swiper-slide {
5892
7168
  pointer-events: none;
5893
7169
  }
5894
- .swiper-container-fade .swiper-slide-active,
5895
- .swiper-container-fade .swiper-slide-active .swiper-slide-active {
7170
+ .swiper-container-cube .swiper-slide-active,
7171
+ .swiper-container-flip .swiper-slide-active,
7172
+ .swiper-container-cube .swiper-slide-active .swiper-slide-active,
7173
+ .swiper-container-flip .swiper-slide-active .swiper-slide-active {
5896
7174
  pointer-events: auto;
5897
7175
  }
5898
- /* Cube */
5899
- .swiper-container-cube {
5900
- overflow: visible;
7176
+ .swiper-container-cube .swiper-slide-shadow-top,
7177
+ .swiper-container-flip .swiper-slide-shadow-top,
7178
+ .swiper-container-cube .swiper-slide-shadow-bottom,
7179
+ .swiper-container-flip .swiper-slide-shadow-bottom,
7180
+ .swiper-container-cube .swiper-slide-shadow-left,
7181
+ .swiper-container-flip .swiper-slide-shadow-left,
7182
+ .swiper-container-cube .swiper-slide-shadow-right,
7183
+ .swiper-container-flip .swiper-slide-shadow-right {
7184
+ z-index: 0;
7185
+ -webkit-backface-visibility: hidden;
7186
+ -moz-backface-visibility: hidden;
7187
+ -ms-backface-visibility: hidden;
7188
+ backface-visibility: hidden;
5901
7189
  }
7190
+ /* Cube */
5902
7191
  .swiper-container-cube .swiper-slide {
5903
- pointer-events: none;
5904
7192
  visibility: hidden;
5905
7193
  -webkit-transform-origin: 0 0;
5906
7194
  -moz-transform-origin: 0 0;
5907
7195
  -ms-transform-origin: 0 0;
5908
7196
  transform-origin: 0 0;
5909
- -webkit-backface-visibility: hidden;
5910
- -moz-backface-visibility: hidden;
5911
- -ms-backface-visibility: hidden;
5912
- backface-visibility: hidden;
5913
7197
  width: 100%;
5914
7198
  height: 100%;
5915
- z-index: 1;
5916
7199
  }
5917
7200
  .swiper-container-cube.swiper-container-rtl .swiper-slide {
5918
7201
  -webkit-transform-origin: 100% 0;
@@ -5927,16 +7210,6 @@ html.with-statusbar-overlay body > .progressbar {
5927
7210
  pointer-events: auto;
5928
7211
  visibility: visible;
5929
7212
  }
5930
- .swiper-container-cube .swiper-slide-shadow-top,
5931
- .swiper-container-cube .swiper-slide-shadow-bottom,
5932
- .swiper-container-cube .swiper-slide-shadow-left,
5933
- .swiper-container-cube .swiper-slide-shadow-right {
5934
- z-index: 0;
5935
- -webkit-backface-visibility: hidden;
5936
- -moz-backface-visibility: hidden;
5937
- -ms-backface-visibility: hidden;
5938
- backface-visibility: hidden;
5939
- }
5940
7213
  .swiper-container-cube .swiper-cube-shadow {
5941
7214
  position: absolute;
5942
7215
  left: 0;
@@ -5949,6 +7222,55 @@ html.with-statusbar-overlay body > .progressbar {
5949
7222
  filter: blur(50px);
5950
7223
  z-index: 0;
5951
7224
  }
7225
+ /* Fade */
7226
+ .swiper-container-fade.swiper-container-free-mode .swiper-slide {
7227
+ -webkit-transition-timing-function: ease-out;
7228
+ -moz-transition-timing-function: ease-out;
7229
+ -ms-transition-timing-function: ease-out;
7230
+ -o-transition-timing-function: ease-out;
7231
+ transition-timing-function: ease-out;
7232
+ }
7233
+ .swiper-container-fade .swiper-slide {
7234
+ pointer-events: none;
7235
+ -webkit-transition-property: opacity;
7236
+ -moz-transition-property: opacity;
7237
+ -o-transition-property: opacity;
7238
+ transition-property: opacity;
7239
+ }
7240
+ .swiper-container-fade .swiper-slide .swiper-slide {
7241
+ pointer-events: none;
7242
+ }
7243
+ .swiper-container-fade .swiper-slide-active,
7244
+ .swiper-container-fade .swiper-slide-active .swiper-slide-active {
7245
+ pointer-events: auto;
7246
+ }
7247
+ .swiper-zoom-container {
7248
+ width: 100%;
7249
+ height: 100%;
7250
+ display: -webkit-box;
7251
+ display: -moz-box;
7252
+ display: -ms-flexbox;
7253
+ display: -webkit-flex;
7254
+ display: flex;
7255
+ -webkit-box-pack: center;
7256
+ -moz-box-pack: center;
7257
+ -ms-flex-pack: center;
7258
+ -webkit-justify-content: center;
7259
+ justify-content: center;
7260
+ -webkit-box-align: center;
7261
+ -moz-box-align: center;
7262
+ -ms-flex-align: center;
7263
+ -webkit-align-items: center;
7264
+ align-items: center;
7265
+ text-align: center;
7266
+ }
7267
+ .swiper-zoom-container > img,
7268
+ .swiper-zoom-container > svg,
7269
+ .swiper-zoom-container > canvas {
7270
+ max-width: 100%;
7271
+ max-height: 100%;
7272
+ object-fit: contain;
7273
+ }
5952
7274
  /* Scrollbar */
5953
7275
  .swiper-scrollbar {
5954
7276
  border-radius: 10px;
@@ -6004,31 +7326,43 @@ html.with-statusbar-overlay body > .progressbar {
6004
7326
  height: 100%;
6005
7327
  z-index: 11500;
6006
7328
  }
6007
- body > .photo-browser {
7329
+ body > .photo-browser,
7330
+ .framework7-root > .photo-browser {
6008
7331
  opacity: 0;
6009
7332
  display: none;
6010
7333
  -webkit-transform: translate3d(0, 0, 0);
6011
7334
  transform: translate3d(0, 0, 0);
6012
7335
  }
6013
- body > .photo-browser.photo-browser-in {
7336
+ body > .photo-browser.photo-browser-in,
7337
+ .framework7-root > .photo-browser.photo-browser-in {
6014
7338
  display: block;
6015
7339
  -webkit-animation: photoBrowserIn 400ms forwards;
6016
7340
  animation: photoBrowserIn 400ms forwards;
6017
7341
  }
6018
- body > .photo-browser.photo-browser-out {
7342
+ body > .photo-browser.photo-browser-out,
7343
+ .framework7-root > .photo-browser.photo-browser-out {
6019
7344
  display: block;
6020
7345
  -webkit-animation: photoBrowserOut 400ms forwards;
6021
7346
  animation: photoBrowserOut 400ms forwards;
6022
7347
  }
6023
- html.with-statusbar-overlay body > .photo-browser {
7348
+ html.with-statusbar-overlay body > .photo-browser,
7349
+ html.with-statusbar-overlay .framework7-root > .photo-browser {
7350
+ height: -webkit-calc(100% - 24px);
7351
+ height: calc(100% - 24px);
7352
+ top: 24px;
7353
+ }
7354
+ html.with-statusbar-overlay.ios body > .photo-browser,
7355
+ html.with-statusbar-overlay.ios .framework7-root > .photo-browser {
6024
7356
  height: -webkit-calc(100% - 20px);
6025
7357
  height: calc(100% - 20px);
6026
7358
  top: 20px;
6027
7359
  }
6028
7360
  .popup > .photo-browser .navbar,
6029
7361
  body > .photo-browser .navbar,
7362
+ .framework7-root > .photo-browser .navbar,
6030
7363
  .popup > .photo-browser .toolbar,
6031
- body > .photo-browser .toolbar {
7364
+ body > .photo-browser .toolbar,
7365
+ .framework7-root > .photo-browser .toolbar {
6032
7366
  -webkit-transform: translate3d(0, 0, 0);
6033
7367
  transform: translate3d(0, 0, 0);
6034
7368
  }
@@ -6177,26 +7511,27 @@ body > .photo-browser .toolbar {
6177
7511
  -webkit-transition-duration: 400ms;
6178
7512
  transition-duration: 400ms;
6179
7513
  }
6180
- .photo-browser-slide span.photo-browser-zoom-container {
6181
- width: 100%;
6182
- text-align: center;
7514
+ .photo-browser-slide span.swiper-zoom-container {
6183
7515
  display: none;
6184
7516
  }
6185
- .photo-browser-slide assets {
7517
+ .photo-browser-slide img {
6186
7518
  width: auto;
6187
7519
  height: auto;
6188
7520
  max-width: 100%;
6189
7521
  max-height: 100%;
6190
7522
  display: none;
6191
7523
  }
6192
- .photo-browser-slide.swiper-slide-active span.photo-browser-zoom-container,
6193
- .photo-browser-slide.swiper-slide-next span.photo-browser-zoom-container,
6194
- .photo-browser-slide.swiper-slide-prev span.photo-browser-zoom-container {
6195
- display: block;
7524
+ .photo-browser-slide.swiper-slide-active span.swiper-zoom-container,
7525
+ .photo-browser-slide.swiper-slide-next span.swiper-zoom-container,
7526
+ .photo-browser-slide.swiper-slide-prev span.swiper-zoom-container {
7527
+ display: -webkit-box;
7528
+ display: -ms-flexbox;
7529
+ display: -webkit-flex;
7530
+ display: flex;
6196
7531
  }
6197
- .photo-browser-slide.swiper-slide-active assets,
6198
- .photo-browser-slide.swiper-slide-next assets,
6199
- .photo-browser-slide.swiper-slide-prev assets {
7532
+ .photo-browser-slide.swiper-slide-active img,
7533
+ .photo-browser-slide.swiper-slide-next img,
7534
+ .photo-browser-slide.swiper-slide-prev img {
6200
7535
  display: inline;
6201
7536
  }
6202
7537
  .photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader,
@@ -6347,7 +7682,6 @@ body > .photo-browser .toolbar {
6347
7682
  .picker-item {
6348
7683
  height: 36px;
6349
7684
  line-height: 36px;
6350
- padding: 0 10px;
6351
7685
  white-space: nowrap;
6352
7686
  position: relative;
6353
7687
  overflow: hidden;
@@ -6360,6 +7694,9 @@ body > .photo-browser .toolbar {
6360
7694
  -webkit-transition-duration: 300ms;
6361
7695
  transition-duration: 300ms;
6362
7696
  }
7697
+ .picker-item span {
7698
+ padding: 0 10px;
7699
+ }
6363
7700
  .picker-items-col-absolute .picker-item {
6364
7701
  position: absolute;
6365
7702
  }
@@ -6703,7 +8040,7 @@ html.pixel-ratio-3 .picker-center-highlight:after {
6703
8040
  left: 0;
6704
8041
  bottom: 0;
6705
8042
  width: 100%;
6706
- z-index: 10900;
8043
+ z-index: 20000;
6707
8044
  color: #fff;
6708
8045
  font-size: 14px;
6709
8046
  margin: 0;
@@ -6711,7 +8048,7 @@ html.pixel-ratio-3 .picker-center-highlight:after {
6711
8048
  display: none;
6712
8049
  box-sizing: border-box;
6713
8050
  max-height: 100%;
6714
- overflow: auto;
8051
+ overflow: hidden;
6715
8052
  -webkit-overflow-scrolling: touch;
6716
8053
  -webkit-transition-duration: 450ms;
6717
8054
  transition-duration: 450ms;
@@ -6875,6 +8212,14 @@ a.item-link,
6875
8212
  .messagebar .ripple-wave {
6876
8213
  background: rgba(0, 0, 0, 0.1);
6877
8214
  }
8215
+ .data-table .sortable-cell .ripple-wave {
8216
+ z-index: 0;
8217
+ }
8218
+ .form-checkbox .ripple-wave,
8219
+ .form-radio .ripple-wave {
8220
+ background: rgba(33, 150, 243, 0.5);
8221
+ z-index: 0;
8222
+ }
6878
8223
  /* === Disabled elements === */
6879
8224
  .disabled,
6880
8225
  [disabled] {
@@ -6887,3 +8232,397 @@ a.item-link,
6887
8232
  [disabled] [disabled] {
6888
8233
  opacity: 1;
6889
8234
  }
8235
+ .data-table {
8236
+ overflow-x: auto;
8237
+ }
8238
+ .data-table table {
8239
+ width: 100%;
8240
+ border: none;
8241
+ padding: 0;
8242
+ margin: 0;
8243
+ border-collapse: collapse;
8244
+ text-align: left;
8245
+ }
8246
+ .data-table thead {
8247
+ font-size: 12px;
8248
+ }
8249
+ .data-table thead th,
8250
+ .data-table thead td {
8251
+ font-weight: 500;
8252
+ height: 56px;
8253
+ overflow: hidden;
8254
+ white-space: nowrap;
8255
+ text-overflow: ellipsis;
8256
+ line-height: 16px;
8257
+ }
8258
+ .data-table thead th:not(.sortable-active),
8259
+ .data-table thead td:not(.sortable-active) {
8260
+ color: rgba(0, 0, 0, 0.54);
8261
+ }
8262
+ .data-table thead i.icon,
8263
+ .data-table thead i.material-icons {
8264
+ font-size: 16px;
8265
+ width: 16px;
8266
+ height: 16px;
8267
+ vertical-align: top;
8268
+ }
8269
+ .data-table tbody {
8270
+ font-size: 13px;
8271
+ }
8272
+ .data-table tbody tr.data-table-row-selected {
8273
+ background: #f5f5f5;
8274
+ }
8275
+ .data-table tbody td {
8276
+ height: 48px;
8277
+ }
8278
+ .data-table tbody td:before {
8279
+ content: '';
8280
+ position: absolute;
8281
+ left: 0;
8282
+ top: 0;
8283
+ bottom: auto;
8284
+ right: auto;
8285
+ height: 1px;
8286
+ width: 100%;
8287
+ background-color: rgba(0, 0, 0, 0.12);
8288
+ display: block;
8289
+ z-index: 15;
8290
+ -webkit-transform-origin: 50% 0%;
8291
+ transform-origin: 50% 0%;
8292
+ }
8293
+ html.pixel-ratio-2 .data-table tbody td:before {
8294
+ -webkit-transform: scaleY(0.5);
8295
+ transform: scaleY(0.5);
8296
+ }
8297
+ html.pixel-ratio-3 .data-table tbody td:before {
8298
+ -webkit-transform: scaleY(0.33);
8299
+ transform: scaleY(0.33);
8300
+ }
8301
+ html:not(.ios):not(.android) .data-table tbody tr:hover {
8302
+ background: #f5f5f5;
8303
+ }
8304
+ .data-table th,
8305
+ .data-table td {
8306
+ padding: 0;
8307
+ position: relative;
8308
+ padding-left: 28px;
8309
+ padding-right: 28px;
8310
+ }
8311
+ .data-table th.label-cell,
8312
+ .data-table td.label-cell {
8313
+ padding-left: 24px;
8314
+ padding-right: 24px;
8315
+ }
8316
+ .data-table th:first-child,
8317
+ .data-table td:first-child {
8318
+ padding-left: 24px;
8319
+ }
8320
+ .data-table th:last-child,
8321
+ .data-table td:last-child {
8322
+ padding-right: 24px;
8323
+ }
8324
+ .data-table th.numeric-cell,
8325
+ .data-table td.numeric-cell {
8326
+ text-align: right;
8327
+ }
8328
+ .data-table th.checkbox-cell,
8329
+ .data-table td.checkbox-cell {
8330
+ padding-left: 24px;
8331
+ padding-right: 12px;
8332
+ width: 18px;
8333
+ overflow: visible;
8334
+ }
8335
+ .data-table th.checkbox-cell + td,
8336
+ .data-table td.checkbox-cell + td,
8337
+ .data-table th.checkbox-cell + th,
8338
+ .data-table td.checkbox-cell + th {
8339
+ padding-left: 12px;
8340
+ }
8341
+ .data-table th.actions-cell,
8342
+ .data-table td.actions-cell {
8343
+ text-align: right;
8344
+ white-space: nowrap;
8345
+ }
8346
+ .data-table th.actions-cell a.link,
8347
+ .data-table td.actions-cell a.link {
8348
+ color: rgba(0, 0, 0, 0.54);
8349
+ position: relative;
8350
+ z-index: 1;
8351
+ cursor: pointer;
8352
+ }
8353
+ .data-table th.actions-cell a.link + a.link,
8354
+ .data-table td.actions-cell a.link + a.link {
8355
+ margin-left: 24px;
8356
+ }
8357
+ .data-table th.actions-cell a.icon-only,
8358
+ .data-table td.actions-cell a.icon-only {
8359
+ width: 24px;
8360
+ height: 24px;
8361
+ display: inline-block;
8362
+ vertical-align: middle;
8363
+ font-size: 18px;
8364
+ line-height: 24px;
8365
+ text-align: center;
8366
+ font-size: 0;
8367
+ }
8368
+ .data-table th.actions-cell a.icon-only i,
8369
+ .data-table td.actions-cell a.icon-only i {
8370
+ font-size: 18px;
8371
+ vertical-align: middle;
8372
+ }
8373
+ .data-table .sortable-cell {
8374
+ cursor: pointer;
8375
+ position: relative;
8376
+ }
8377
+ .data-table .sortable-cell:not(.numeric-cell):after,
8378
+ .data-table .sortable-cell.numeric-cell:before {
8379
+ content: '';
8380
+ display: inline-block;
8381
+ vertical-align: top;
8382
+ width: 16px;
8383
+ height: 16px;
8384
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200h24v24H0V0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M20%2012l-1.41-1.41L13%2016.17V4h-2v12.17l-5.58-5.59L4%2012l8%208%208-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
8385
+ background-size: 100% auto;
8386
+ background-position: center;
8387
+ background-repeat: no-repeat;
8388
+ font-size: 0;
8389
+ -webkit-transition-duration: 300ms;
8390
+ transition-duration: 300ms;
8391
+ -webkit-transform: rotate(0);
8392
+ transform: rotate(0);
8393
+ opacity: 0;
8394
+ }
8395
+ html:not(.ios):not(.android) .data-table .sortable-cell:not(.sortable-active):hover:after,
8396
+ html:not(.ios):not(.android) .data-table .sortable-cell:not(.sortable-active):hover:before {
8397
+ opacity: 0.54;
8398
+ }
8399
+ .data-table .sortable-cell.sortable-active:after,
8400
+ .data-table .sortable-cell.sortable-active:before {
8401
+ opacity: 0.87;
8402
+ }
8403
+ .data-table .sortable-cell.sortable-desc:after,
8404
+ .data-table .sortable-cell.sortable-desc:before {
8405
+ -webkit-transform: rotate(180deg);
8406
+ transform: rotate(180deg);
8407
+ }
8408
+ .data-table .sortable-cell:not(.numeric-cell):after {
8409
+ margin-left: 8px;
8410
+ }
8411
+ .data-table .sortable-cell.numeric-cell:before {
8412
+ margin-right: 8px;
8413
+ }
8414
+ .data-table.card .card-header,
8415
+ .card .data-table .card-header,
8416
+ .data-table.card .card-footer,
8417
+ .card .data-table .card-footer {
8418
+ padding-left: 24px;
8419
+ padding-right: 14px;
8420
+ }
8421
+ .data-table.card .card-header,
8422
+ .card .data-table .card-header {
8423
+ height: 64px;
8424
+ }
8425
+ .data-table.card .card-footer,
8426
+ .card .data-table .card-footer {
8427
+ height: 56px;
8428
+ }
8429
+ .data-table.card .card-content,
8430
+ .card .data-table .card-content {
8431
+ overflow-x: auto;
8432
+ }
8433
+ .data-table .data-table-title {
8434
+ font-size: 20px;
8435
+ }
8436
+ .data-table .data-table-links,
8437
+ .data-table .data-table-actions {
8438
+ display: -webkit-box;
8439
+ display: -ms-flexbox;
8440
+ display: -webkit-flex;
8441
+ display: flex;
8442
+ -webkit-box-pack: justify;
8443
+ -ms-flex-pack: justify;
8444
+ -webkit-justify-content: space-between;
8445
+ justify-content: space-between;
8446
+ }
8447
+ .data-table .data-table-links a.link,
8448
+ .data-table .data-table-actions a.link {
8449
+ cursor: pointer;
8450
+ }
8451
+ .data-table .data-table-links a.link + a.link,
8452
+ .data-table .data-table-actions a.link + a.link {
8453
+ margin-left: 24px;
8454
+ }
8455
+ .data-table .data-table-actions {
8456
+ margin-left: auto;
8457
+ -webkit-box-align: center;
8458
+ -ms-flex-align: center;
8459
+ -webkit-align-items: center;
8460
+ align-items: center;
8461
+ }
8462
+ .data-table .data-table-actions a.link {
8463
+ cursor: pointer;
8464
+ min-width: 0;
8465
+ color: rgba(0, 0, 0, 0.54);
8466
+ }
8467
+ .data-table .data-table-actions a.link.icon-only {
8468
+ width: 24px;
8469
+ height: 24px;
8470
+ line-height: 1;
8471
+ overflow: visible;
8472
+ }
8473
+ .data-table .data-table-actions a.link.icon-only.active-state,
8474
+ html:not(.watch-active-state) .data-table .data-table-actions a.link.icon-only:active {
8475
+ background: none;
8476
+ }
8477
+ .data-table .data-table-header,
8478
+ .data-table .data-table-header-selected {
8479
+ display: -webkit-box;
8480
+ display: -ms-flexbox;
8481
+ display: -webkit-flex;
8482
+ display: flex;
8483
+ -webkit-box-pack: justify;
8484
+ -ms-flex-pack: justify;
8485
+ -webkit-justify-content: space-between;
8486
+ justify-content: space-between;
8487
+ -webkit-box-align: center;
8488
+ -ms-flex-align: center;
8489
+ -webkit-align-items: center;
8490
+ align-items: center;
8491
+ width: 100%;
8492
+ }
8493
+ .data-table .card-header > .data-table-header,
8494
+ .data-table .card-header > .data-table-header-selected {
8495
+ padding-left: 24px;
8496
+ padding-right: 14px;
8497
+ margin-left: -24px;
8498
+ margin-right: -14px;
8499
+ height: 100%;
8500
+ padding-top: 4px;
8501
+ padding-bottom: 4px;
8502
+ }
8503
+ .data-table .data-table-header-selected {
8504
+ display: none;
8505
+ background: rgba(33, 150, 243, 0.1);
8506
+ }
8507
+ .data-table.data-table-has-checked .data-table-header {
8508
+ display: none;
8509
+ }
8510
+ .data-table.data-table-has-checked .data-table-header-selected {
8511
+ display: -webkit-box;
8512
+ display: -ms-flexbox;
8513
+ display: -webkit-flex;
8514
+ display: flex;
8515
+ }
8516
+ .data-table .data-table-title-selected {
8517
+ color: #2196f3;
8518
+ font-size: 14px;
8519
+ }
8520
+ @media (max-width: 480px) and (orientation: portrait) {
8521
+ .data-table.data-table-collapsible thead {
8522
+ display: none;
8523
+ }
8524
+ .data-table.data-table-collapsible tbody,
8525
+ .data-table.data-table-collapsible tr,
8526
+ .data-table.data-table-collapsible td {
8527
+ display: block;
8528
+ }
8529
+ .data-table.data-table-collapsible tr {
8530
+ position: relative;
8531
+ }
8532
+ .data-table.data-table-collapsible tr:before {
8533
+ content: '';
8534
+ position: absolute;
8535
+ left: 0;
8536
+ top: 0;
8537
+ bottom: auto;
8538
+ right: auto;
8539
+ height: 1px;
8540
+ width: 100%;
8541
+ background-color: rgba(0, 0, 0, 0.12);
8542
+ display: block;
8543
+ z-index: 15;
8544
+ -webkit-transform-origin: 50% 0%;
8545
+ transform-origin: 50% 0%;
8546
+ }
8547
+ html.pixel-ratio-2 .data-table.data-table-collapsible tr:before {
8548
+ -webkit-transform: scaleY(0.5);
8549
+ transform: scaleY(0.5);
8550
+ }
8551
+ html.pixel-ratio-3 .data-table.data-table-collapsible tr:before {
8552
+ -webkit-transform: scaleY(0.33);
8553
+ transform: scaleY(0.33);
8554
+ }
8555
+ .data-table.data-table-collapsible tr:hover {
8556
+ background-color: inherit;
8557
+ }
8558
+ .data-table.data-table-collapsible td {
8559
+ text-align: left;
8560
+ padding-left: 16px;
8561
+ padding-right: 16px;
8562
+ display: -webkit-box;
8563
+ display: -ms-flexbox;
8564
+ display: -webkit-flex;
8565
+ display: flex;
8566
+ -ms-flex-line-pack: center;
8567
+ -webkit-align-content: center;
8568
+ align-content: center;
8569
+ -webkit-box-align: center;
8570
+ -ms-flex-align: center;
8571
+ -webkit-align-items: center;
8572
+ align-items: center;
8573
+ -webkit-box-pack: start;
8574
+ -ms-flex-pack: start;
8575
+ -webkit-justify-content: flex-start;
8576
+ justify-content: flex-start;
8577
+ }
8578
+ .data-table.data-table-collapsible td:before {
8579
+ display: none;
8580
+ }
8581
+ .data-table.data-table-collapsible td:not(.checkbox-cell) {
8582
+ font-size: 16px;
8583
+ }
8584
+ .data-table.data-table-collapsible td:not(.checkbox-cell):before {
8585
+ width: 40%;
8586
+ display: block;
8587
+ content: attr(data-collapsible-title);
8588
+ position: relative;
8589
+ height: auto;
8590
+ background: none;
8591
+ -webkit-transform: none !important;
8592
+ transform: none !important;
8593
+ color: rgba(0, 0, 0, 0.54);
8594
+ font-weight: 500;
8595
+ font-size: 12px;
8596
+ margin-right: 16px;
8597
+ line-height: 16px;
8598
+ -webkit-box-flex: 0;
8599
+ -webkit-flex-shrink: 0;
8600
+ -ms-flex: 0 0 auto;
8601
+ flex-shrink: 0;
8602
+ }
8603
+ .data-table.data-table-collapsible td.checkbox-cell {
8604
+ position: absolute;
8605
+ left: 0;
8606
+ top: 0;
8607
+ }
8608
+ .data-table.data-table-collapsible td.checkbox-cell + td {
8609
+ padding-left: 16px;
8610
+ }
8611
+ .data-table.data-table-collapsible td.checkbox-cell ~ td {
8612
+ margin-left: 32px;
8613
+ }
8614
+ }
8615
+ .data-table .tablet-only,
8616
+ .data-table .tablet-landscape-only {
8617
+ display: none;
8618
+ }
8619
+ @media (min-width: 768px) {
8620
+ .data-table .tablet-only {
8621
+ display: table-cell;
8622
+ }
8623
+ }
8624
+ @media (min-width: 768px) and (orientation: landscape) {
8625
+ .data-table .tablet-landscape-only {
8626
+ display: table-cell;
8627
+ }
8628
+ }