@andreyshpigunov/x 0.5.20 → 0.5.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/app.css +1 -1
- package/dist/x.css +1 -1
- package/index.html +1 -1
- package/package.json +1 -1
- package/src/components/x/helpers.css +53 -46
- package/src/components/x/space.css +6 -6
- package/src/components/x/variables.css +18 -24
package/index.html
CHANGED
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"functionName": "headerAnimation"
|
|
20
20
|
}'>
|
|
21
21
|
<header class="header flex aic sticky t0 px5 m:px6 l:px8 unselectable">
|
|
22
|
-
<div class="header-version nowrap">0.5.
|
|
22
|
+
<div class="header-version nowrap">0.5.22</div>
|
|
23
23
|
<div class="header-logo mxa">
|
|
24
24
|
<a role="button" x-scrollto="#top">
|
|
25
25
|
<img src="assets/img/logo.png" alt="x" />
|
package/package.json
CHANGED
|
@@ -27,15 +27,16 @@ All right reserved.
|
|
|
27
27
|
.fix
|
|
28
28
|
.rel
|
|
29
29
|
.abs
|
|
30
|
-
.
|
|
30
|
+
.inset
|
|
31
|
+
.fill
|
|
31
32
|
.fit-none (s,m,l,xl)
|
|
32
33
|
.fit-cover (s,m,l,xl)
|
|
33
34
|
.fit-contain (s,m,l,xl)
|
|
34
|
-
.t[0-
|
|
35
|
-
.b[0-
|
|
36
|
-
.l[0-
|
|
37
|
-
.r[0-
|
|
38
|
-
.z[0-
|
|
35
|
+
.t[0-9][n] (s,m,l,xl)
|
|
36
|
+
.b[0-9][n] (s,m,l,xl)
|
|
37
|
+
.l[0-9][n] (s,m,l,xl)
|
|
38
|
+
.r[0-9][n] (s,m,l,xl)
|
|
39
|
+
.z[0-9] (s,m,l,xl)
|
|
39
40
|
.op[0-10]
|
|
40
41
|
.ratio1x1 (s,m,l,xl)
|
|
41
42
|
.ratio2x1 (s,m,l,xl)
|
|
@@ -58,7 +59,10 @@ All right reserved.
|
|
|
58
59
|
.hidden-next (s,m,l,xl)
|
|
59
60
|
.block (s,m,l,xl)
|
|
60
61
|
.inline (s,m,l,xl)
|
|
61
|
-
.inlineBlock
|
|
62
|
+
.inlineBlock (s,m,l,xl)
|
|
63
|
+
.table (s,m,l,xl)
|
|
64
|
+
.flex (s,m,l,xl)
|
|
65
|
+
.grid (s,m,l,xl)
|
|
62
66
|
.fullscreen
|
|
63
67
|
.max (s,m,l,xl)
|
|
64
68
|
.w[10-190] step 10 (s,m,l,xl)
|
|
@@ -100,8 +104,8 @@ All right reserved.
|
|
|
100
104
|
.gapy[0-12] (s,m,l,xl)
|
|
101
105
|
.br[0-12] (s,m,l,xl)
|
|
102
106
|
.br100 (s,m,l,xl)
|
|
103
|
-
.sh[0-
|
|
104
|
-
.o[0-
|
|
107
|
+
.sh[0-5] (s,m,l,xl)
|
|
108
|
+
.o[0-9] (s,m,l,xl)
|
|
105
109
|
.mono
|
|
106
110
|
.italic
|
|
107
111
|
.strike
|
|
@@ -215,8 +219,9 @@ html.touch .touch-hide { display: none }
|
|
|
215
219
|
.fix { position: fixed }
|
|
216
220
|
.rel { position: relative }
|
|
217
221
|
.abs { position: absolute }
|
|
218
|
-
.ins { position: absolute; inset: 0 }
|
|
219
222
|
|
|
223
|
+
.inset { inset: 0 }
|
|
224
|
+
.fill { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
|
|
220
225
|
|
|
221
226
|
/* !- Object fit */
|
|
222
227
|
.fit-cover { object-fit: cover }
|
|
@@ -244,7 +249,7 @@ html.touch .touch-hide { display: none }
|
|
|
244
249
|
|
|
245
250
|
|
|
246
251
|
/* !- Top, bottom, left, right, z-index */
|
|
247
|
-
@for $i from 0 to
|
|
252
|
+
@for $i from 0 to 9 {
|
|
248
253
|
.t$(i) { top: var(--space-$(i)) }
|
|
249
254
|
.b$(i) { bottom: var(--space-$(i)) }
|
|
250
255
|
.l$(i) { left: var(--space-$(i)) }
|
|
@@ -256,7 +261,7 @@ html.touch .touch-hide { display: none }
|
|
|
256
261
|
.z$(i) { z-index: $(i) }
|
|
257
262
|
}
|
|
258
263
|
@media (min-width: 640px) {
|
|
259
|
-
@for $i from 0 to
|
|
264
|
+
@for $i from 0 to 9 {
|
|
260
265
|
.s\:t$(i) { top: var(--space-$(i)) }
|
|
261
266
|
.s\:b$(i) { bottom: var(--space-$(i)) }
|
|
262
267
|
.s\:l$(i) { left: var(--space-$(i)) }
|
|
@@ -269,7 +274,7 @@ html.touch .touch-hide { display: none }
|
|
|
269
274
|
}
|
|
270
275
|
}
|
|
271
276
|
@media (min-width: 768px) {
|
|
272
|
-
@for $i from 0 to
|
|
277
|
+
@for $i from 0 to 9 {
|
|
273
278
|
.m\:t$(i) { top: var(--space-$(i)) }
|
|
274
279
|
.m\:b$(i) { bottom: var(--space-$(i)) }
|
|
275
280
|
.m\:l$(i) { left: var(--space-$(i)) }
|
|
@@ -282,7 +287,7 @@ html.touch .touch-hide { display: none }
|
|
|
282
287
|
}
|
|
283
288
|
}
|
|
284
289
|
@media (min-width: 1024px) {
|
|
285
|
-
@for $i from 0 to
|
|
290
|
+
@for $i from 0 to 9 {
|
|
286
291
|
.l\:t$(i) { top: var(--space-$(i)) }
|
|
287
292
|
.l\:b$(i) { bottom: var(--space-$(i)) }
|
|
288
293
|
.l\:l$(i) { left: var(--space-$(i)) }
|
|
@@ -295,7 +300,7 @@ html.touch .touch-hide { display: none }
|
|
|
295
300
|
}
|
|
296
301
|
}
|
|
297
302
|
@media (min-width: 1280px) {
|
|
298
|
-
@for $i from 0 to
|
|
303
|
+
@for $i from 0 to 9 {
|
|
299
304
|
.xl\:t$(i) { top: var(--space-$(i)) }
|
|
300
305
|
.xl\:b$(i) { bottom: var(--space-$(i)) }
|
|
301
306
|
.xl\:l$(i) { left: var(--space-$(i)) }
|
|
@@ -538,13 +543,15 @@ html.touch .touch-hide { display: none }
|
|
|
538
543
|
|
|
539
544
|
/* !- Width, height */
|
|
540
545
|
.fullscreen {
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
}
|
|
544
|
-
.max {
|
|
545
|
-
width: 100%;
|
|
546
|
-
max-width: 100%;
|
|
546
|
+
width: 100vw;
|
|
547
|
+
height: 100vh;
|
|
547
548
|
}
|
|
549
|
+
.wmax { width: 100%; }
|
|
550
|
+
.hmax { width: 100%; }
|
|
551
|
+
.wscreen { width: 100vw; }
|
|
552
|
+
.hscreen { height: 100vh; }
|
|
553
|
+
.max { max-width: 100%; }
|
|
554
|
+
.hmax { max-height: 100%; }
|
|
548
555
|
|
|
549
556
|
@for $i from 10 to 190 by 10 {
|
|
550
557
|
.w$(i) { width: $(i)px }
|
|
@@ -691,7 +698,7 @@ html.touch .touch-hide { display: none }
|
|
|
691
698
|
|
|
692
699
|
|
|
693
700
|
/* !- Margin */
|
|
694
|
-
@for $i from 0 to
|
|
701
|
+
@for $i from 0 to 9 {
|
|
695
702
|
.m$(i) { margin: var(--space-$(i)) }
|
|
696
703
|
.mx$(i) { margin-left: var(--space-$(i)); margin-right: var(--space-$(i)) }
|
|
697
704
|
.my$(i) { margin-top: var(--space-$(i)); margin-bottom: var(--space-$(i)) }
|
|
@@ -723,7 +730,7 @@ html.touch .touch-hide { display: none }
|
|
|
723
730
|
.mra { margin-right: auto }
|
|
724
731
|
|
|
725
732
|
@media (min-width: 640px) {
|
|
726
|
-
@for $i from 0 to
|
|
733
|
+
@for $i from 0 to 9 {
|
|
727
734
|
.s\:m$(i) { margin: var(--space-$(i)) }
|
|
728
735
|
.s\:mx$(i) { margin-left: var(--space-$(i)); margin-right: var(--space-$(i)) }
|
|
729
736
|
.s\:my$(i) { margin-top: var(--space-$(i)); margin-bottom: var(--space-$(i)) }
|
|
@@ -756,7 +763,7 @@ html.touch .touch-hide { display: none }
|
|
|
756
763
|
}
|
|
757
764
|
|
|
758
765
|
@media (min-width: 768px) {
|
|
759
|
-
@for $i from 0 to
|
|
766
|
+
@for $i from 0 to 9 {
|
|
760
767
|
.m\:m$(i) { margin: var(--space-$(i)) }
|
|
761
768
|
.m\:mx$(i) { margin-left: var(--space-$(i)); margin-right: var(--space-$(i)) }
|
|
762
769
|
.m\:my$(i) { margin-top: var(--space-$(i)); margin-bottom: var(--space-$(i)) }
|
|
@@ -789,7 +796,7 @@ html.touch .touch-hide { display: none }
|
|
|
789
796
|
}
|
|
790
797
|
|
|
791
798
|
@media (min-width: 1024px) {
|
|
792
|
-
@for $i from 0 to
|
|
799
|
+
@for $i from 0 to 9 {
|
|
793
800
|
.l\:m$(i) { margin: var(--space-$(i)) }
|
|
794
801
|
.l\:mx$(i) { margin-left: var(--space-$(i)); margin-right: var(--space-$(i)) }
|
|
795
802
|
.l\:my$(i) { margin-top: var(--space-$(i)); margin-bottom: var(--space-$(i)) }
|
|
@@ -822,7 +829,7 @@ html.touch .touch-hide { display: none }
|
|
|
822
829
|
}
|
|
823
830
|
|
|
824
831
|
@media (min-width: 1280px) {
|
|
825
|
-
@for $i from 0 to
|
|
832
|
+
@for $i from 0 to 9 {
|
|
826
833
|
.xl\:m$(i) { margin: var(--space-$(i)) }
|
|
827
834
|
.xl\:mx$(i) { margin-left: var(--space-$(i)); margin-right: var(--space-$(i)) }
|
|
828
835
|
.xl\:my$(i) { margin-top: var(--space-$(i)); margin-bottom: var(--space-$(i)) }
|
|
@@ -856,7 +863,7 @@ html.touch .touch-hide { display: none }
|
|
|
856
863
|
|
|
857
864
|
|
|
858
865
|
/* !- Padding */
|
|
859
|
-
@for $i from 0 to
|
|
866
|
+
@for $i from 0 to 9 {
|
|
860
867
|
.p$(i) { padding: var(--space-$(i)) }
|
|
861
868
|
.px$(i) { padding-left: var(--space-$(i)); padding-right: var(--space-$(i)) }
|
|
862
869
|
.py$(i) { padding-top: var(--space-$(i)); padding-bottom: var(--space-$(i)) }
|
|
@@ -867,7 +874,7 @@ html.touch .touch-hide { display: none }
|
|
|
867
874
|
}
|
|
868
875
|
|
|
869
876
|
@media (min-width: 640px) {
|
|
870
|
-
@for $i from 0 to
|
|
877
|
+
@for $i from 0 to 9 {
|
|
871
878
|
.s\:p$(i) { padding: var(--space-$(i)) }
|
|
872
879
|
.s\:px$(i) { padding-left: var(--space-$(i)); padding-right: var(--space-$(i)) }
|
|
873
880
|
.s\:py$(i) { padding-top: var(--space-$(i)); padding-bottom: var(--space-$(i)) }
|
|
@@ -879,7 +886,7 @@ html.touch .touch-hide { display: none }
|
|
|
879
886
|
}
|
|
880
887
|
|
|
881
888
|
@media (min-width: 768px) {
|
|
882
|
-
@for $i from 0 to
|
|
889
|
+
@for $i from 0 to 9 {
|
|
883
890
|
.m\:p$(i) { padding: var(--space-$(i)) }
|
|
884
891
|
.m\:px$(i) { padding-left: var(--space-$(i)); padding-right: var(--space-$(i)) }
|
|
885
892
|
.m\:py$(i) { padding-top: var(--space-$(i)); padding-bottom: var(--space-$(i)) }
|
|
@@ -891,7 +898,7 @@ html.touch .touch-hide { display: none }
|
|
|
891
898
|
}
|
|
892
899
|
|
|
893
900
|
@media (min-width: 1024px) {
|
|
894
|
-
@for $i from 0 to
|
|
901
|
+
@for $i from 0 to 9 {
|
|
895
902
|
.l\:p$(i) { padding: var(--space-$(i)) }
|
|
896
903
|
.l\:px$(i) { padding-left: var(--space-$(i)); padding-right: var(--space-$(i)) }
|
|
897
904
|
.l\:py$(i) { padding-top: var(--space-$(i)); padding-bottom: var(--space-$(i)) }
|
|
@@ -903,7 +910,7 @@ html.touch .touch-hide { display: none }
|
|
|
903
910
|
}
|
|
904
911
|
|
|
905
912
|
@media (min-width: 1280px) {
|
|
906
|
-
@for $i from 0 to
|
|
913
|
+
@for $i from 0 to 9 {
|
|
907
914
|
.xl\:p$(i) { padding: var(--space-$(i)) }
|
|
908
915
|
.xl\:px$(i) { padding-left: var(--space-$(i)); padding-right: var(--space-$(i)) }
|
|
909
916
|
.xl\:py$(i) { padding-top: var(--space-$(i)); padding-bottom: var(--space-$(i)) }
|
|
@@ -916,14 +923,14 @@ html.touch .touch-hide { display: none }
|
|
|
916
923
|
|
|
917
924
|
|
|
918
925
|
/* !- Gap */
|
|
919
|
-
@for $i from 0 to
|
|
926
|
+
@for $i from 0 to 9 {
|
|
920
927
|
.gap$(i) { gap: var(--space-$(i)) }
|
|
921
928
|
.gapx$(i) { column-gap: var(--space-$(i)) }
|
|
922
929
|
.gapy$(i) { row-gap: var(--space-$(i)) }
|
|
923
930
|
}
|
|
924
931
|
|
|
925
932
|
@media (min-width: 640px) {
|
|
926
|
-
@for $i from 0 to
|
|
933
|
+
@for $i from 0 to 9 {
|
|
927
934
|
.s\:gap$(i) { gap: var(--space-$(i)) }
|
|
928
935
|
.s\:gapx$(i) { column-gap: var(--space-$(i)) }
|
|
929
936
|
.s\:gapy$(i) { row-gap: var(--space-$(i)) }
|
|
@@ -931,7 +938,7 @@ html.touch .touch-hide { display: none }
|
|
|
931
938
|
}
|
|
932
939
|
|
|
933
940
|
@media (min-width: 768px) {
|
|
934
|
-
@for $i from 0 to
|
|
941
|
+
@for $i from 0 to 9 {
|
|
935
942
|
.m\:gap$(i) { gap: var(--space-$(i)) }
|
|
936
943
|
.m\:gapx$(i) { column-gap: var(--space-$(i)) }
|
|
937
944
|
.m\:gapy$(i) { row-gap: var(--space-$(i)) }
|
|
@@ -939,7 +946,7 @@ html.touch .touch-hide { display: none }
|
|
|
939
946
|
}
|
|
940
947
|
|
|
941
948
|
@media (min-width: 1024px) {
|
|
942
|
-
@for $i from 0 to
|
|
949
|
+
@for $i from 0 to 9 {
|
|
943
950
|
.l\:gap$(i) { gap: var(--space-$(i)) }
|
|
944
951
|
.l\:gapx$(i) { column-gap: var(--space-$(i)) }
|
|
945
952
|
.l\:gapy$(i) { row-gap: var(--space-$(i)) }
|
|
@@ -947,7 +954,7 @@ html.touch .touch-hide { display: none }
|
|
|
947
954
|
}
|
|
948
955
|
|
|
949
956
|
@media (min-width: 1280px) {
|
|
950
|
-
@for $i from 0 to
|
|
957
|
+
@for $i from 0 to 9 {
|
|
951
958
|
.xl\:gap$(i) { gap: var(--space-$(i)) }
|
|
952
959
|
.xl\:gapx$(i) { column-gap: var(--space-$(i)) }
|
|
953
960
|
.xl\:gapy$(i) { row-gap: var(--space-$(i)) }
|
|
@@ -956,34 +963,34 @@ html.touch .touch-hide { display: none }
|
|
|
956
963
|
|
|
957
964
|
|
|
958
965
|
/* !- Border radius */
|
|
959
|
-
@for $i from 0 to
|
|
966
|
+
@for $i from 0 to 9 {
|
|
960
967
|
.br$(i) { border-radius: var(--space-$(i)) }
|
|
961
968
|
}
|
|
962
969
|
.br100 { border-radius: 100% }
|
|
963
970
|
|
|
964
971
|
@media (min-width: 640px) {
|
|
965
|
-
@for $i from 0 to
|
|
972
|
+
@for $i from 0 to 9 {
|
|
966
973
|
.s\:br$(i) { border-radius: var(--space-$(i)) }
|
|
967
974
|
}
|
|
968
975
|
.s\:br100 { border-radius: 100% }
|
|
969
976
|
}
|
|
970
977
|
|
|
971
978
|
@media (min-width: 768px) {
|
|
972
|
-
@for $i from 0 to
|
|
979
|
+
@for $i from 0 to 9 {
|
|
973
980
|
.m\:br$(i) { border-radius: var(--space-$(i)) }
|
|
974
981
|
}
|
|
975
982
|
.m\:br100 { border-radius: 100% }
|
|
976
983
|
}
|
|
977
984
|
|
|
978
985
|
@media (min-width: 1024px) {
|
|
979
|
-
@for $i from 0 to
|
|
986
|
+
@for $i from 0 to 9 {
|
|
980
987
|
.l\:br$(i) { border-radius: var(--space-$(i)) }
|
|
981
988
|
}
|
|
982
989
|
.l\:br100 { border-radius: 100% }
|
|
983
990
|
}
|
|
984
991
|
|
|
985
992
|
@media (min-width: 1280px) {
|
|
986
|
-
@for $i from 0 to
|
|
993
|
+
@for $i from 0 to 9 {
|
|
987
994
|
.xl\:br$(i) { border-radius: var(--space-$(i)) }
|
|
988
995
|
}
|
|
989
996
|
.xl\:br100 { border-radius: 100% }
|
|
@@ -1061,26 +1068,26 @@ html.touch .touch-hide { display: none }
|
|
|
1061
1068
|
|
|
1062
1069
|
|
|
1063
1070
|
/* !- Order */
|
|
1064
|
-
@for $i from 0 to
|
|
1071
|
+
@for $i from 0 to 9 {
|
|
1065
1072
|
.o$(i) { order: $(i) }
|
|
1066
1073
|
}
|
|
1067
1074
|
@media (min-width: 640px) {
|
|
1068
|
-
@for $i from 0 to
|
|
1075
|
+
@for $i from 0 to 9 {
|
|
1069
1076
|
.s\:o$(i) { order: $(i) }
|
|
1070
1077
|
}
|
|
1071
1078
|
}
|
|
1072
1079
|
@media (min-width: 768px) {
|
|
1073
|
-
@for $i from 0 to
|
|
1080
|
+
@for $i from 0 to 9 {
|
|
1074
1081
|
.m\:o$(i) { order: $(i) }
|
|
1075
1082
|
}
|
|
1076
1083
|
}
|
|
1077
1084
|
@media (min-width: 1024px) {
|
|
1078
|
-
@for $i from 0 to
|
|
1085
|
+
@for $i from 0 to 9 {
|
|
1079
1086
|
.l\:o$(i) { order: $(i) }
|
|
1080
1087
|
}
|
|
1081
1088
|
}
|
|
1082
1089
|
@media (min-width: 1280px) {
|
|
1083
|
-
@for $i from 0 to
|
|
1090
|
+
@for $i from 0 to 9 {
|
|
1084
1091
|
.xl\:o$(i) { order: $(i) }
|
|
1085
1092
|
}
|
|
1086
1093
|
}
|
|
@@ -8,17 +8,17 @@ All right reserved.
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
/*
|
|
11
|
-
.space[0-
|
|
11
|
+
.space[0-9] (s,m,l,xl) - vertical space
|
|
12
12
|
*/
|
|
13
13
|
|
|
14
|
-
@for $i from 0 to
|
|
14
|
+
@for $i from 0 to 9 {
|
|
15
15
|
.space$(i) {
|
|
16
16
|
height: var(--space-$(i));
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
@media (min-width: 640px) {
|
|
21
|
-
@for $i from 0 to
|
|
21
|
+
@for $i from 0 to 9 {
|
|
22
22
|
.s\:space$(i) {
|
|
23
23
|
height: var(--space-$(i));
|
|
24
24
|
}
|
|
@@ -26,7 +26,7 @@ All right reserved.
|
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
@media (min-width: 768px) {
|
|
29
|
-
@for $i from 0 to
|
|
29
|
+
@for $i from 0 to 9 {
|
|
30
30
|
.m\:space$(i) {
|
|
31
31
|
height: var(--space-$(i));
|
|
32
32
|
}
|
|
@@ -34,7 +34,7 @@ All right reserved.
|
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
@media (min-width: 1024px) {
|
|
37
|
-
@for $i from 0 to
|
|
37
|
+
@for $i from 0 to 9 {
|
|
38
38
|
.l\:space$(i) {
|
|
39
39
|
height: var(--space-$(i));
|
|
40
40
|
}
|
|
@@ -42,7 +42,7 @@ All right reserved.
|
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
@media (min-width: 1280px) {
|
|
45
|
-
@for $i from 0 to
|
|
45
|
+
@for $i from 0 to 9 {
|
|
46
46
|
.xl\:space$(i) {
|
|
47
47
|
height: var(--space-$(i));
|
|
48
48
|
}
|
|
@@ -25,12 +25,11 @@ All right reserved.
|
|
|
25
25
|
--space-2: 0.8rem;
|
|
26
26
|
--space-3: 1.2rem;
|
|
27
27
|
--space-4: 1.6rem;
|
|
28
|
-
--space-5: 2.
|
|
29
|
-
--space-6:
|
|
30
|
-
--space-7:
|
|
31
|
-
--space-8:
|
|
32
|
-
--space-9:
|
|
33
|
-
--space-10: 6.4rem;
|
|
28
|
+
--space-5: 2.4rem;
|
|
29
|
+
--space-6: 3.2rem;
|
|
30
|
+
--space-7: 4.8rem;
|
|
31
|
+
--space-8: 6.4rem;
|
|
32
|
+
--space-9: 8.0rem;
|
|
34
33
|
|
|
35
34
|
--headers-margin-top: 1em;
|
|
36
35
|
--headers-margin-bottom: .5em;
|
|
@@ -39,15 +38,15 @@ All right reserved.
|
|
|
39
38
|
--headers-font-color: var(--font-color);
|
|
40
39
|
|
|
41
40
|
--h1-font-size: 3.6rem;
|
|
42
|
-
--h2-font-size: 2.
|
|
43
|
-
--h3-font-size: 2.
|
|
44
|
-
--h4-font-size: 1.
|
|
45
|
-
--h5-font-size: 1.
|
|
46
|
-
--h6-font-size: 1.
|
|
41
|
+
--h2-font-size: 2.8rem;
|
|
42
|
+
--h3-font-size: 2.2rem;
|
|
43
|
+
--h4-font-size: 1.8rem;
|
|
44
|
+
--h5-font-size: 1.6rem;
|
|
45
|
+
--h6-font-size: 1.4rem;
|
|
47
46
|
|
|
48
47
|
--h1-line-height: 1.2;
|
|
49
|
-
--h2-line-height: 1.
|
|
50
|
-
--h3-line-height: 1.
|
|
48
|
+
--h2-line-height: 1.25;
|
|
49
|
+
--h3-line-height: 1.3;
|
|
51
50
|
|
|
52
51
|
--paragraph-margin: 1em;
|
|
53
52
|
|
|
@@ -68,17 +67,12 @@ All right reserved.
|
|
|
68
67
|
|
|
69
68
|
--container-max-width: 160rem;
|
|
70
69
|
|
|
71
|
-
--shadow-1:
|
|
72
|
-
--shadow-2:
|
|
73
|
-
--shadow-3:
|
|
74
|
-
--shadow-4:
|
|
75
|
-
--shadow-5:
|
|
76
|
-
|
|
77
|
-
--shadow-7: 0 14px 28px #00000016;
|
|
78
|
-
--shadow-8: 0 16px 32px #00000016;
|
|
79
|
-
--shadow-9: 0 18px 36px #00000016;
|
|
80
|
-
--shadow-10: 0 20px 40px #00000016;
|
|
81
|
-
|
|
70
|
+
--shadow-1: 0 1px 2px #00000012, 0 1px 1px #0000000a;
|
|
71
|
+
--shadow-2: 0 2px 6px #00000014, 0 1px 2px #0000000c;
|
|
72
|
+
--shadow-3: 0 6px 16px #00000016, 0 2px 4px #0000000c;
|
|
73
|
+
--shadow-4: 0 12px 32px #00000018, 0 4px 8px #0000000e;
|
|
74
|
+
--shadow-5: 0 20px 48px #0000001a, 0 8px 16px #00000010;
|
|
75
|
+
|
|
82
76
|
--link-color: #0060cc;
|
|
83
77
|
--link-decoration-line: underline;
|
|
84
78
|
--link-decoration-style: solid;
|