@varlet/cli 2.0.5 → 2.1.0-alpha.1666877950844

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.
Files changed (143) hide show
  1. package/README.en-US.md +2 -2
  2. package/README.md +2 -2
  3. package/cjs/babel.config.cjs +29 -0
  4. package/cjs/babel.sfc.transform.cjs +18 -0
  5. package/cjs/jest.config.cjs +33 -0
  6. package/cjs/jest.media.mock.cjs +1 -0
  7. package/cjs/jest.style.mock.cjs +1 -0
  8. package/client.d.ts +1 -0
  9. package/client.js +1 -0
  10. package/lib/client/appType.d.ts +4 -0
  11. package/lib/client/appType.js +7 -0
  12. package/lib/client/index.d.ts +17 -0
  13. package/lib/client/index.js +106 -0
  14. package/lib/{bin.d.ts → node/bin.d.ts} +2 -2
  15. package/lib/node/bin.js +122 -0
  16. package/lib/{commands → node/commands}/build.d.ts +1 -1
  17. package/lib/node/commands/build.js +15 -0
  18. package/lib/{commands → node/commands}/changelog.d.ts +6 -6
  19. package/lib/node/commands/changelog.js +20 -0
  20. package/lib/{commands → node/commands}/commitLint.d.ts +1 -1
  21. package/lib/node/commands/commitLint.js +45 -0
  22. package/lib/{commands → node/commands}/compile.d.ts +7 -7
  23. package/lib/node/commands/compile.js +35 -0
  24. package/lib/{commands → node/commands}/create.d.ts +8 -8
  25. package/lib/node/commands/create.js +91 -0
  26. package/lib/{commands → node/commands}/dev.d.ts +5 -5
  27. package/lib/node/commands/dev.js +38 -0
  28. package/lib/{commands → node/commands}/gen.d.ts +8 -8
  29. package/lib/node/commands/gen.js +75 -0
  30. package/lib/{commands → node/commands}/jest.d.ts +8 -8
  31. package/lib/node/commands/jest.js +27 -0
  32. package/lib/{commands → node/commands}/lint.d.ts +1 -1
  33. package/lib/node/commands/lint.js +41 -0
  34. package/lib/{commands → node/commands}/preview.d.ts +1 -1
  35. package/lib/node/commands/preview.js +18 -0
  36. package/lib/{commands → node/commands}/release.d.ts +5 -5
  37. package/lib/node/commands/release.js +146 -0
  38. package/lib/{commands → node/commands}/vite.d.ts +3 -3
  39. package/lib/node/commands/vite.js +13 -0
  40. package/lib/{compiler → node/compiler}/compileModule.d.ts +5 -5
  41. package/lib/node/compiler/compileModule.js +74 -0
  42. package/lib/{compiler → node/compiler}/compileSFC.d.ts +2 -2
  43. package/lib/node/compiler/compileSFC.js +79 -0
  44. package/lib/{compiler → node/compiler}/compileScript.d.ts +17 -17
  45. package/lib/node/compiler/compileScript.js +141 -0
  46. package/lib/{compiler → node/compiler}/compileSiteEntry.d.ts +13 -13
  47. package/lib/node/compiler/compileSiteEntry.js +128 -0
  48. package/lib/{compiler → node/compiler}/compileStyle.d.ts +11 -11
  49. package/lib/node/compiler/compileStyle.js +39 -0
  50. package/lib/{compiler → node/compiler}/compileTemplateHighlight.d.ts +10 -10
  51. package/lib/node/compiler/compileTemplateHighlight.js +133 -0
  52. package/lib/{compiler → node/compiler}/compileTypes.d.ts +2 -2
  53. package/lib/node/compiler/compileTypes.js +45 -0
  54. package/lib/{config → node/config}/varlet.config.d.ts +45 -44
  55. package/lib/node/config/varlet.config.js +27 -0
  56. package/lib/node/config/varlet.default.config.d.ts +2 -0
  57. package/lib/node/config/varlet.default.config.js +264 -0
  58. package/lib/node/config/vite.config.d.ts +6 -0
  59. package/lib/node/config/vite.config.js +144 -0
  60. package/lib/node/index.d.ts +1 -0
  61. package/lib/node/index.js +1 -0
  62. package/lib/{shared → node/shared}/constant.d.ts +42 -43
  63. package/lib/node/shared/constant.js +47 -0
  64. package/lib/{shared → node/shared}/fsUtils.d.ts +13 -12
  65. package/lib/node/shared/fsUtils.js +48 -0
  66. package/lib/{shared → node/shared}/logger.d.ts +8 -8
  67. package/lib/node/shared/logger.js +18 -0
  68. package/package.json +22 -19
  69. package/{preset.js → preset.cjs} +1 -1
  70. package/site/components/button/index.ts +10 -10
  71. package/site/components/cell/index.ts +10 -10
  72. package/site/components/code-example/CodeExample.vue +2 -1
  73. package/site/components/code-example/codeExample.less +41 -41
  74. package/site/components/code-example/index.ts +10 -10
  75. package/site/components/context/zIndex.ts +20 -20
  76. package/site/components/icon/icon.less +26 -26
  77. package/site/components/icon/index.ts +10 -10
  78. package/site/components/icon/props.ts +24 -24
  79. package/site/components/loading/index.ts +10 -10
  80. package/site/components/progress/index.ts +10 -10
  81. package/site/components/snackbar/snackbar.less +135 -135
  82. package/site/components/styles/common.less +64 -64
  83. package/site/components/styles/elevation.less +126 -126
  84. package/site/components/styles/var.less +27 -27
  85. package/site/components/utils/components.ts +1 -4
  86. package/site/components/utils/elements.ts +1 -1
  87. package/site/index.html +49 -49
  88. package/site/mobile/App.vue +27 -26
  89. package/site/mobile/components/AppHome.vue +2 -1
  90. package/site/mobile/components/app-bar/index.ts +10 -10
  91. package/site/mobile/components/app-bar/props.ts +25 -25
  92. package/site/mobile.html +41 -41
  93. package/site/module.d.ts +5 -5
  94. package/site/pc/App.vue +2 -1
  95. package/site/pc/Layout.vue +2 -1
  96. package/site/pc/components/AppHeader.vue +4 -2
  97. package/site/pc/pages/index/index.vue +8 -4
  98. package/site/tsconfig.json +11 -11
  99. package/site/useProgress.ts +2 -1
  100. package/site/utils.ts +6 -137
  101. package/template/generators/config/default/base/{varlet.config.js → varlet.config.mjs} +2 -2
  102. package/template/generators/config/i18n/base/{varlet.config.js → varlet.config.mjs} +2 -2
  103. package/tsconfig.json +2 -9
  104. package/lib/bin.js +0 -102
  105. package/lib/commands/build.js +0 -67
  106. package/lib/commands/changelog.js +0 -27
  107. package/lib/commands/commitLint.js +0 -21
  108. package/lib/commands/compile.js +0 -119
  109. package/lib/commands/create.js +0 -166
  110. package/lib/commands/dev.js +0 -123
  111. package/lib/commands/gen.js +0 -138
  112. package/lib/commands/jest.js +0 -85
  113. package/lib/commands/lint.js +0 -123
  114. package/lib/commands/preview.js +0 -74
  115. package/lib/commands/release.js +0 -270
  116. package/lib/commands/vite.js +0 -69
  117. package/lib/compiler/compileModule.js +0 -190
  118. package/lib/compiler/compileSFC.js +0 -135
  119. package/lib/compiler/compileScript.js +0 -194
  120. package/lib/compiler/compileSiteEntry.js +0 -237
  121. package/lib/compiler/compileStyle.js +0 -91
  122. package/lib/compiler/compileTemplateHighlight.js +0 -193
  123. package/lib/compiler/compileTypes.js +0 -85
  124. package/lib/config/babel.config.d.ts +0 -2
  125. package/lib/config/babel.config.js +0 -31
  126. package/lib/config/babel.sfc.transform.d.ts +0 -1
  127. package/lib/config/babel.sfc.transform.js +0 -18
  128. package/lib/config/jest.config.d.ts +0 -1
  129. package/lib/config/jest.config.js +0 -37
  130. package/lib/config/jest.media.mock.d.ts +0 -0
  131. package/lib/config/jest.media.mock.js +0 -2
  132. package/lib/config/jest.style.mock.d.ts +0 -0
  133. package/lib/config/jest.style.mock.js +0 -2
  134. package/lib/config/varlet.config.js +0 -35
  135. package/lib/config/vite.config.d.ts +0 -5
  136. package/lib/config/vite.config.js +0 -162
  137. package/lib/index.d.ts +0 -1
  138. package/lib/index.js +0 -5
  139. package/lib/shared/constant.js +0 -50
  140. package/lib/shared/fsUtils.js +0 -108
  141. package/lib/shared/logger.js +0 -23
  142. package/site/mobile/components/AppType.vue +0 -22
  143. package/varlet.default.config.js +0 -267
@@ -1,135 +1,135 @@
1
- @site-snackbar-width: 256px;
2
- @site-snackbar-color: rgba(255, 255, 255, 0.87);
3
- @site-snackbar-border-radius: 4px;
4
- @site-snackbar-background: #333;
5
- @site-snackbar-font-size: var(--site-font-size-md);
6
- @site-snackbar-margin: 6px 24px;
7
- @site-snackbar-border-color: currentColor;
8
- @site-snackbar-success-background: var(--site-color-success);
9
- @site-snackbar-info-background: var(--site-color-info);
10
- @site-snackbar-error-background: var(--site-color-danger);
11
- @site-snackbar-warning-background: var(--site-color-warning);
12
- @site-snackbar-content-padding: 14px 16px;
13
- @site-snackbar-action-margin: 0 16px 0 0;
14
-
15
- :root {
16
- --site-snackbar-width: @site-snackbar-width;
17
- --site-snackbar-color: @site-snackbar-color;
18
- --site-snackbar-border-radius: @site-snackbar-border-radius;
19
- --site-snackbar-background: @site-snackbar-background;
20
- --site-snackbar-font-size: @site-snackbar-font-size;
21
- --site-snackbar-margin: @site-snackbar-margin;
22
- --site-snackbar-border-color: @site-snackbar-border-color;
23
- --site-snackbar-success-background: @site-snackbar-success-background;
24
- --site-snackbar-info-background: @site-snackbar-info-background;
25
- --site-snackbar-error-background: @site-snackbar-error-background;
26
- --site-snackbar-warning-background: @site-snackbar-warning-background;
27
- --site-snackbar-content-padding: @site-snackbar-content-padding;
28
- --site-snackbar-action-margin: @site-snackbar-action-margin;
29
- }
30
-
31
- .var-site-transition-group {
32
- position: fixed;
33
- left: 0;
34
- right: 0;
35
- top: 0;
36
- bottom: 0;
37
- pointer-events: none;
38
- }
39
-
40
- .var-site-pointer-auto {
41
- pointer-events: auto;
42
- }
43
-
44
- .var-site {
45
- &-snackbar {
46
- display: flex;
47
- justify-content: center;
48
- align-items: baseline;
49
- left: 0;
50
- right: 0;
51
- bottom: 0;
52
- transition: all 0.15s var(--site-cubic-bezier);
53
-
54
- &__wrapper {
55
- width: var(--site-snackbar-width);
56
- display: flex;
57
- border-radius: var(--site-snackbar-border-radius);
58
- color: var(--site-snackbar-color);
59
- background: var(--site-snackbar-background);
60
- font-size: var(--site-snackbar-font-size);
61
- margin: var(--site-snackbar-margin);
62
- align-items: center;
63
- border-color: var(--site-snackbar-border-color);
64
- pointer-events: auto;
65
- transition: 0.3s var(--site-cubic-bezier);
66
-
67
- &-success {
68
- background: var(--site-snackbar-success-background);
69
- }
70
-
71
- &-info {
72
- background: var(--site-snackbar-info-background);
73
- }
74
-
75
- &-warning {
76
- background: var(--site-snackbar-warning-background);
77
- }
78
-
79
- &-error {
80
- background: var(--site-snackbar-error-background);
81
- }
82
- }
83
-
84
- &__content {
85
- flex-grow: 1;
86
- padding: var(--site-snackbar-content-padding);
87
- }
88
-
89
- &__action {
90
- margin: var(--site-snackbar-action-margin);
91
- display: flex;
92
- }
93
-
94
- &__vertical {
95
- flex-direction: column;
96
- align-items: flex-start;
97
-
98
- .var-site-snackbar__action {
99
- align-self: flex-end;
100
- margin-bottom: 8px;
101
- }
102
- }
103
-
104
- &-fade-leave-active {
105
- position: absolute;
106
- }
107
-
108
- &-fade-enter-from,
109
- &-fade-leave-to {
110
- opacity: 0;
111
- transform: translateY(-30px);
112
- }
113
- }
114
-
115
- &-snackbar-transition {
116
- top: 0;
117
- position: fixed;
118
-
119
- .var-site-snackbar__wrapper {
120
- position: absolute;
121
-
122
- &-top {
123
- top: 5%;
124
- }
125
-
126
- &-center {
127
- top: 45%;
128
- }
129
-
130
- &-bottom {
131
- bottom: 5%;
132
- }
133
- }
134
- }
135
- }
1
+ @site-snackbar-width: 256px;
2
+ @site-snackbar-color: rgba(255, 255, 255, 0.87);
3
+ @site-snackbar-border-radius: 4px;
4
+ @site-snackbar-background: #333;
5
+ @site-snackbar-font-size: var(--site-font-size-md);
6
+ @site-snackbar-margin: 6px 24px;
7
+ @site-snackbar-border-color: currentColor;
8
+ @site-snackbar-success-background: var(--site-color-success);
9
+ @site-snackbar-info-background: var(--site-color-info);
10
+ @site-snackbar-error-background: var(--site-color-danger);
11
+ @site-snackbar-warning-background: var(--site-color-warning);
12
+ @site-snackbar-content-padding: 14px 16px;
13
+ @site-snackbar-action-margin: 0 16px 0 0;
14
+
15
+ :root {
16
+ --site-snackbar-width: @site-snackbar-width;
17
+ --site-snackbar-color: @site-snackbar-color;
18
+ --site-snackbar-border-radius: @site-snackbar-border-radius;
19
+ --site-snackbar-background: @site-snackbar-background;
20
+ --site-snackbar-font-size: @site-snackbar-font-size;
21
+ --site-snackbar-margin: @site-snackbar-margin;
22
+ --site-snackbar-border-color: @site-snackbar-border-color;
23
+ --site-snackbar-success-background: @site-snackbar-success-background;
24
+ --site-snackbar-info-background: @site-snackbar-info-background;
25
+ --site-snackbar-error-background: @site-snackbar-error-background;
26
+ --site-snackbar-warning-background: @site-snackbar-warning-background;
27
+ --site-snackbar-content-padding: @site-snackbar-content-padding;
28
+ --site-snackbar-action-margin: @site-snackbar-action-margin;
29
+ }
30
+
31
+ .var-site-transition-group {
32
+ position: fixed;
33
+ left: 0;
34
+ right: 0;
35
+ top: 0;
36
+ bottom: 0;
37
+ pointer-events: none;
38
+ }
39
+
40
+ .var-site-pointer-auto {
41
+ pointer-events: auto;
42
+ }
43
+
44
+ .var-site {
45
+ &-snackbar {
46
+ display: flex;
47
+ justify-content: center;
48
+ align-items: baseline;
49
+ left: 0;
50
+ right: 0;
51
+ bottom: 0;
52
+ transition: all 0.15s var(--site-cubic-bezier);
53
+
54
+ &__wrapper {
55
+ width: var(--site-snackbar-width);
56
+ display: flex;
57
+ border-radius: var(--site-snackbar-border-radius);
58
+ color: var(--site-snackbar-color);
59
+ background: var(--site-snackbar-background);
60
+ font-size: var(--site-snackbar-font-size);
61
+ margin: var(--site-snackbar-margin);
62
+ align-items: center;
63
+ border-color: var(--site-snackbar-border-color);
64
+ pointer-events: auto;
65
+ transition: 0.3s var(--site-cubic-bezier);
66
+
67
+ &-success {
68
+ background: var(--site-snackbar-success-background);
69
+ }
70
+
71
+ &-info {
72
+ background: var(--site-snackbar-info-background);
73
+ }
74
+
75
+ &-warning {
76
+ background: var(--site-snackbar-warning-background);
77
+ }
78
+
79
+ &-error {
80
+ background: var(--site-snackbar-error-background);
81
+ }
82
+ }
83
+
84
+ &__content {
85
+ flex-grow: 1;
86
+ padding: var(--site-snackbar-content-padding);
87
+ }
88
+
89
+ &__action {
90
+ margin: var(--site-snackbar-action-margin);
91
+ display: flex;
92
+ }
93
+
94
+ &__vertical {
95
+ flex-direction: column;
96
+ align-items: flex-start;
97
+
98
+ .var-site-snackbar__action {
99
+ align-self: flex-end;
100
+ margin-bottom: 8px;
101
+ }
102
+ }
103
+
104
+ &-fade-leave-active {
105
+ position: absolute;
106
+ }
107
+
108
+ &-fade-enter-from,
109
+ &-fade-leave-to {
110
+ opacity: 0;
111
+ transform: translateY(-30px);
112
+ }
113
+ }
114
+
115
+ &-snackbar-transition {
116
+ top: 0;
117
+ position: fixed;
118
+
119
+ .var-site-snackbar__wrapper {
120
+ position: absolute;
121
+
122
+ &-top {
123
+ top: 5%;
124
+ }
125
+
126
+ &-center {
127
+ top: 45%;
128
+ }
129
+
130
+ &-bottom {
131
+ bottom: 5%;
132
+ }
133
+ }
134
+ }
135
+ }
@@ -1,64 +1,64 @@
1
- @import './var';
2
-
3
- .var-site {
4
- &--box {
5
- box-sizing: border-box;
6
-
7
- * {
8
- box-sizing: border-box;
9
- }
10
- }
11
-
12
- &--relative {
13
- position: relative;
14
- }
15
-
16
- &--absolute {
17
- position: absolute;
18
- }
19
-
20
- &--hidden {
21
- overflow: hidden;
22
- }
23
-
24
- &--lock {
25
- overflow: hidden;
26
- }
27
-
28
- &--block {
29
- display: block;
30
- }
31
-
32
- &--inline-block {
33
- display: inline-block;
34
- }
35
-
36
- &--flex {
37
- display: flex;
38
- }
39
-
40
- &--inline-flex {
41
- display: inline-flex;
42
- }
43
- }
44
-
45
- :root {
46
- --site-font-size-xs: @site-font-size-xs;
47
- --site-font-size-sm: @site-font-size-sm;
48
- --site-font-size-md: @site-font-size-md;
49
- --site-font-size-lg: @site-font-size-lg;
50
- --site-icon-size-xs: @site-icon-size-xs;
51
- --site-icon-size-sm: @site-icon-size-sm;
52
- --site-icon-size-md: @site-icon-size-md;
53
- --site-icon-size-lg: @site-icon-size-lg;
54
- --site-color-primary: @site-color-primary;
55
- --site-color-info: @site-color-info;
56
- --site-color-success: @site-color-success;
57
- --site-color-warning: @site-color-warning;
58
- --site-color-danger: @site-color-danger;
59
- --site-color-disabled: @site-color-disabled;
60
- --site-cubic-bezier: @site-cubic-bezier;
61
- --site-shadow-key-umbra-opacity: @site-shadow-key-umbra-opacity;
62
- --site-shadow-key-penumbra-opacity: @site-shadow-key-penumbra-opacity;
63
- --site-shadow-key-ambient-opacity: @site-shadow-key-ambient-opacity;
64
- }
1
+ @import './var';
2
+
3
+ .var-site {
4
+ &--box {
5
+ box-sizing: border-box;
6
+
7
+ * {
8
+ box-sizing: border-box;
9
+ }
10
+ }
11
+
12
+ &--relative {
13
+ position: relative;
14
+ }
15
+
16
+ &--absolute {
17
+ position: absolute;
18
+ }
19
+
20
+ &--hidden {
21
+ overflow: hidden;
22
+ }
23
+
24
+ &--lock {
25
+ overflow: hidden;
26
+ }
27
+
28
+ &--block {
29
+ display: block;
30
+ }
31
+
32
+ &--inline-block {
33
+ display: inline-block;
34
+ }
35
+
36
+ &--flex {
37
+ display: flex;
38
+ }
39
+
40
+ &--inline-flex {
41
+ display: inline-flex;
42
+ }
43
+ }
44
+
45
+ :root {
46
+ --site-font-size-xs: @site-font-size-xs;
47
+ --site-font-size-sm: @site-font-size-sm;
48
+ --site-font-size-md: @site-font-size-md;
49
+ --site-font-size-lg: @site-font-size-lg;
50
+ --site-icon-size-xs: @site-icon-size-xs;
51
+ --site-icon-size-sm: @site-icon-size-sm;
52
+ --site-icon-size-md: @site-icon-size-md;
53
+ --site-icon-size-lg: @site-icon-size-lg;
54
+ --site-color-primary: @site-color-primary;
55
+ --site-color-info: @site-color-info;
56
+ --site-color-success: @site-color-success;
57
+ --site-color-warning: @site-color-warning;
58
+ --site-color-danger: @site-color-danger;
59
+ --site-color-disabled: @site-color-disabled;
60
+ --site-cubic-bezier: @site-cubic-bezier;
61
+ --site-shadow-key-umbra-opacity: @site-shadow-key-umbra-opacity;
62
+ --site-shadow-key-penumbra-opacity: @site-shadow-key-penumbra-opacity;
63
+ --site-shadow-key-ambient-opacity: @site-shadow-key-ambient-opacity;
64
+ }
@@ -1,126 +1,126 @@
1
- .var-site-elevation {
2
- &--0 {
3
- box-shadow: 0 0 0 0 var(--site-shadow-key-umbra-opacity), 0 0 0 0 var(--site-shadow-key-penumbra-opacity),
4
- 0 0 0 0 var(--site-shadow-key-ambient-opacity);
5
- }
6
-
7
- &--1 {
8
- box-shadow: 0 2px 1px -1px var(--site-shadow-key-umbra-opacity), 0 1px 1px 0 var(--site-shadow-key-penumbra-opacity),
9
- 0 1px 3px 0 var(--site-shadow-key-ambient-opacity);
10
- }
11
-
12
- &--2 {
13
- box-shadow: 0 3px 1px -2px var(--site-shadow-key-umbra-opacity), 0 2px 2px 0 var(--site-shadow-key-penumbra-opacity),
14
- 0 1px 5px 0 var(--site-shadow-key-ambient-opacity);
15
- }
16
-
17
- &--3 {
18
- box-shadow: 0 3px 3px -2px var(--site-shadow-key-umbra-opacity), 0 3px 4px 0 var(--site-shadow-key-penumbra-opacity),
19
- 0 1px 8px 0 var(--site-shadow-key-ambient-opacity);
20
- }
21
-
22
- &--4 {
23
- box-shadow: 0 2px 4px -1px var(--site-shadow-key-umbra-opacity), 0 4px 5px 0 var(--site-shadow-key-penumbra-opacity),
24
- 0 1px 10px 0 var(--site-shadow-key-ambient-opacity);
25
- }
26
-
27
- &--5 {
28
- box-shadow: 0 3px 5px -1px var(--site-shadow-key-umbra-opacity), 0 5px 8px 0 var(--site-shadow-key-penumbra-opacity),
29
- 0 1px 14px 0 var(--site-shadow-key-ambient-opacity);
30
- }
31
-
32
- &--6 {
33
- box-shadow: 0 3px 5px -1px var(--site-shadow-key-umbra-opacity), 0 6px 10px 0 var(--site-shadow-key-penumbra-opacity),
34
- 0 1px 18px 0 var(--site-shadow-key-ambient-opacity);
35
- }
36
-
37
- &--7 {
38
- box-shadow: 0 4px 5px -2px var(--site-shadow-key-umbra-opacity), 0 7px 10px 1px var(--site-shadow-key-penumbra-opacity),
39
- 0 2px 16px 1px var(--site-shadow-key-ambient-opacity);
40
- }
41
-
42
- &--8 {
43
- box-shadow: 0 5px 5px -3px var(--site-shadow-key-umbra-opacity), 0 8px 10px 1px var(--site-shadow-key-penumbra-opacity),
44
- 0 3px 14px 2px var(--site-shadow-key-ambient-opacity);
45
- }
46
-
47
- &--9 {
48
- box-shadow: 0 5px 6px -3px var(--site-shadow-key-umbra-opacity), 0 9px 12px 1px var(--site-shadow-key-penumbra-opacity),
49
- 0 3px 16px 2px var(--site-shadow-key-ambient-opacity);
50
- }
51
-
52
- &--10 {
53
- box-shadow: 0 6px 6px -3px var(--site-shadow-key-umbra-opacity), 0 10px 14px 1px var(--site-shadow-key-penumbra-opacity),
54
- 0 4px 18px 3px var(--site-shadow-key-ambient-opacity);
55
- }
56
-
57
- &--11 {
58
- box-shadow: 0 6px 7px -4px var(--site-shadow-key-umbra-opacity), 0 11px 15px 1px var(--site-shadow-key-penumbra-opacity),
59
- 0 4px 20px 3px var(--site-shadow-key-ambient-opacity);
60
- }
61
-
62
- &--12 {
63
- box-shadow: 0 7px 8px -4px var(--site-shadow-key-umbra-opacity), 0 12px 17px 2px var(--site-shadow-key-penumbra-opacity),
64
- 0 5px 22px 4px var(--site-shadow-key-ambient-opacity);
65
- }
66
-
67
- &--13 {
68
- box-shadow: 0 7px 8px -4px var(--site-shadow-key-umbra-opacity), 0 13px 19px 2px var(--site-shadow-key-penumbra-opacity),
69
- 0 5px 24px 4px var(--site-shadow-key-ambient-opacity);
70
- }
71
-
72
- &--14 {
73
- box-shadow: 0 7px 9px -4px var(--site-shadow-key-umbra-opacity), 0 14px 21px 2px var(--site-shadow-key-penumbra-opacity),
74
- 0 5px 26px 4px var(--site-shadow-key-ambient-opacity);
75
- }
76
-
77
- &--15 {
78
- box-shadow: 0 8px 9px -5px var(--site-shadow-key-umbra-opacity), 0 15px 22px 2px var(--site-shadow-key-penumbra-opacity),
79
- 0 6px 28px 5px var(--site-shadow-key-ambient-opacity);
80
- }
81
-
82
- &--16 {
83
- box-shadow: 0 8px 10px -5px var(--site-shadow-key-umbra-opacity), 0 16px 24px 2px var(--site-shadow-key-penumbra-opacity),
84
- 0 6px 30px 5px var(--site-shadow-key-ambient-opacity);
85
- }
86
-
87
- &--17 {
88
- box-shadow: 0 8px 11px -5px var(--site-shadow-key-umbra-opacity), 0 17px 26px 2px var(--site-shadow-key-penumbra-opacity),
89
- 0 6px 32px 5px var(--site-shadow-key-ambient-opacity);
90
- }
91
-
92
- &--18 {
93
- box-shadow: 0 9px 11px -5px var(--site-shadow-key-umbra-opacity), 0 18px 28px 2px var(--site-shadow-key-penumbra-opacity),
94
- 0 7px 34px 6px var(--site-shadow-key-ambient-opacity);
95
- }
96
-
97
- &--19 {
98
- box-shadow: 0 9px 12px -6px var(--site-shadow-key-umbra-opacity), 0 19px 29px 2px var(--site-shadow-key-penumbra-opacity),
99
- 0 7px 36px 6px var(--site-shadow-key-ambient-opacity);
100
- }
101
-
102
- &--20 {
103
- box-shadow: 0 10px 13px -6px var(--site-shadow-key-umbra-opacity), 0 20px 31px 3px var(--site-shadow-key-penumbra-opacity),
104
- 0 8px 38px 7px var(--site-shadow-key-ambient-opacity);
105
- }
106
-
107
- &--21 {
108
- box-shadow: 0 10px 13px -6px var(--site-shadow-key-umbra-opacity), 0 21px 33px 3px var(--site-shadow-key-penumbra-opacity),
109
- 0 8px 40px 7px var(--site-shadow-key-ambient-opacity);
110
- }
111
-
112
- &--22 {
113
- box-shadow: 0 10px 14px -6px var(--site-shadow-key-umbra-opacity), 0 22px 35px 3px var(--site-shadow-key-penumbra-opacity),
114
- 0 8px 42px 7px var(--site-shadow-key-ambient-opacity);
115
- }
116
-
117
- &--23 {
118
- box-shadow: 0 11px 14px -7px var(--site-shadow-key-umbra-opacity), 0 23px 36px 3px var(--site-shadow-key-penumbra-opacity),
119
- 0 9px 44px 8px var(--site-shadow-key-ambient-opacity);
120
- }
121
-
122
- &--24 {
123
- box-shadow: 0 11px 15px -7px var(--site-shadow-key-umbra-opacity), 0 24px 38px 3px var(--site-shadow-key-penumbra-opacity),
124
- 0 9px 46px 8px var(--site-shadow-key-ambient-opacity);
125
- }
126
- }
1
+ .var-site-elevation {
2
+ &--0 {
3
+ box-shadow: 0 0 0 0 var(--site-shadow-key-umbra-opacity), 0 0 0 0 var(--site-shadow-key-penumbra-opacity),
4
+ 0 0 0 0 var(--site-shadow-key-ambient-opacity);
5
+ }
6
+
7
+ &--1 {
8
+ box-shadow: 0 2px 1px -1px var(--site-shadow-key-umbra-opacity), 0 1px 1px 0 var(--site-shadow-key-penumbra-opacity),
9
+ 0 1px 3px 0 var(--site-shadow-key-ambient-opacity);
10
+ }
11
+
12
+ &--2 {
13
+ box-shadow: 0 3px 1px -2px var(--site-shadow-key-umbra-opacity), 0 2px 2px 0 var(--site-shadow-key-penumbra-opacity),
14
+ 0 1px 5px 0 var(--site-shadow-key-ambient-opacity);
15
+ }
16
+
17
+ &--3 {
18
+ box-shadow: 0 3px 3px -2px var(--site-shadow-key-umbra-opacity), 0 3px 4px 0 var(--site-shadow-key-penumbra-opacity),
19
+ 0 1px 8px 0 var(--site-shadow-key-ambient-opacity);
20
+ }
21
+
22
+ &--4 {
23
+ box-shadow: 0 2px 4px -1px var(--site-shadow-key-umbra-opacity), 0 4px 5px 0 var(--site-shadow-key-penumbra-opacity),
24
+ 0 1px 10px 0 var(--site-shadow-key-ambient-opacity);
25
+ }
26
+
27
+ &--5 {
28
+ box-shadow: 0 3px 5px -1px var(--site-shadow-key-umbra-opacity), 0 5px 8px 0 var(--site-shadow-key-penumbra-opacity),
29
+ 0 1px 14px 0 var(--site-shadow-key-ambient-opacity);
30
+ }
31
+
32
+ &--6 {
33
+ box-shadow: 0 3px 5px -1px var(--site-shadow-key-umbra-opacity), 0 6px 10px 0 var(--site-shadow-key-penumbra-opacity),
34
+ 0 1px 18px 0 var(--site-shadow-key-ambient-opacity);
35
+ }
36
+
37
+ &--7 {
38
+ box-shadow: 0 4px 5px -2px var(--site-shadow-key-umbra-opacity), 0 7px 10px 1px var(--site-shadow-key-penumbra-opacity),
39
+ 0 2px 16px 1px var(--site-shadow-key-ambient-opacity);
40
+ }
41
+
42
+ &--8 {
43
+ box-shadow: 0 5px 5px -3px var(--site-shadow-key-umbra-opacity), 0 8px 10px 1px var(--site-shadow-key-penumbra-opacity),
44
+ 0 3px 14px 2px var(--site-shadow-key-ambient-opacity);
45
+ }
46
+
47
+ &--9 {
48
+ box-shadow: 0 5px 6px -3px var(--site-shadow-key-umbra-opacity), 0 9px 12px 1px var(--site-shadow-key-penumbra-opacity),
49
+ 0 3px 16px 2px var(--site-shadow-key-ambient-opacity);
50
+ }
51
+
52
+ &--10 {
53
+ box-shadow: 0 6px 6px -3px var(--site-shadow-key-umbra-opacity), 0 10px 14px 1px var(--site-shadow-key-penumbra-opacity),
54
+ 0 4px 18px 3px var(--site-shadow-key-ambient-opacity);
55
+ }
56
+
57
+ &--11 {
58
+ box-shadow: 0 6px 7px -4px var(--site-shadow-key-umbra-opacity), 0 11px 15px 1px var(--site-shadow-key-penumbra-opacity),
59
+ 0 4px 20px 3px var(--site-shadow-key-ambient-opacity);
60
+ }
61
+
62
+ &--12 {
63
+ box-shadow: 0 7px 8px -4px var(--site-shadow-key-umbra-opacity), 0 12px 17px 2px var(--site-shadow-key-penumbra-opacity),
64
+ 0 5px 22px 4px var(--site-shadow-key-ambient-opacity);
65
+ }
66
+
67
+ &--13 {
68
+ box-shadow: 0 7px 8px -4px var(--site-shadow-key-umbra-opacity), 0 13px 19px 2px var(--site-shadow-key-penumbra-opacity),
69
+ 0 5px 24px 4px var(--site-shadow-key-ambient-opacity);
70
+ }
71
+
72
+ &--14 {
73
+ box-shadow: 0 7px 9px -4px var(--site-shadow-key-umbra-opacity), 0 14px 21px 2px var(--site-shadow-key-penumbra-opacity),
74
+ 0 5px 26px 4px var(--site-shadow-key-ambient-opacity);
75
+ }
76
+
77
+ &--15 {
78
+ box-shadow: 0 8px 9px -5px var(--site-shadow-key-umbra-opacity), 0 15px 22px 2px var(--site-shadow-key-penumbra-opacity),
79
+ 0 6px 28px 5px var(--site-shadow-key-ambient-opacity);
80
+ }
81
+
82
+ &--16 {
83
+ box-shadow: 0 8px 10px -5px var(--site-shadow-key-umbra-opacity), 0 16px 24px 2px var(--site-shadow-key-penumbra-opacity),
84
+ 0 6px 30px 5px var(--site-shadow-key-ambient-opacity);
85
+ }
86
+
87
+ &--17 {
88
+ box-shadow: 0 8px 11px -5px var(--site-shadow-key-umbra-opacity), 0 17px 26px 2px var(--site-shadow-key-penumbra-opacity),
89
+ 0 6px 32px 5px var(--site-shadow-key-ambient-opacity);
90
+ }
91
+
92
+ &--18 {
93
+ box-shadow: 0 9px 11px -5px var(--site-shadow-key-umbra-opacity), 0 18px 28px 2px var(--site-shadow-key-penumbra-opacity),
94
+ 0 7px 34px 6px var(--site-shadow-key-ambient-opacity);
95
+ }
96
+
97
+ &--19 {
98
+ box-shadow: 0 9px 12px -6px var(--site-shadow-key-umbra-opacity), 0 19px 29px 2px var(--site-shadow-key-penumbra-opacity),
99
+ 0 7px 36px 6px var(--site-shadow-key-ambient-opacity);
100
+ }
101
+
102
+ &--20 {
103
+ box-shadow: 0 10px 13px -6px var(--site-shadow-key-umbra-opacity), 0 20px 31px 3px var(--site-shadow-key-penumbra-opacity),
104
+ 0 8px 38px 7px var(--site-shadow-key-ambient-opacity);
105
+ }
106
+
107
+ &--21 {
108
+ box-shadow: 0 10px 13px -6px var(--site-shadow-key-umbra-opacity), 0 21px 33px 3px var(--site-shadow-key-penumbra-opacity),
109
+ 0 8px 40px 7px var(--site-shadow-key-ambient-opacity);
110
+ }
111
+
112
+ &--22 {
113
+ box-shadow: 0 10px 14px -6px var(--site-shadow-key-umbra-opacity), 0 22px 35px 3px var(--site-shadow-key-penumbra-opacity),
114
+ 0 8px 42px 7px var(--site-shadow-key-ambient-opacity);
115
+ }
116
+
117
+ &--23 {
118
+ box-shadow: 0 11px 14px -7px var(--site-shadow-key-umbra-opacity), 0 23px 36px 3px var(--site-shadow-key-penumbra-opacity),
119
+ 0 9px 44px 8px var(--site-shadow-key-ambient-opacity);
120
+ }
121
+
122
+ &--24 {
123
+ box-shadow: 0 11px 15px -7px var(--site-shadow-key-umbra-opacity), 0 24px 38px 3px var(--site-shadow-key-penumbra-opacity),
124
+ 0 9px 46px 8px var(--site-shadow-key-ambient-opacity);
125
+ }
126
+ }