@schukai/monster 3.90.0 → 3.92.0
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/CHANGELOG.md +22 -0
- package/package.json +1 -1
- package/source/components/datatable/datatable.mjs +2 -0
- package/source/components/datatable/filter.mjs +3 -0
- package/source/components/datatable/save-button.mjs +3 -0
- package/source/components/form/action-button.mjs +11 -40
- package/source/components/form/api-bar.mjs +551 -0
- package/source/components/form/button.mjs +1 -3
- package/source/components/form/context-error.mjs +2 -13
- package/source/components/form/context-help.mjs +1 -1
- package/source/components/form/field-set.mjs +1 -3
- package/source/components/form/message-state-button.mjs +10 -12
- package/source/components/form/password.mjs +3 -3
- package/source/components/form/reload.mjs +1 -1
- package/source/components/form/shadow-reload.mjs +1 -1
- package/source/components/form/style/action-button.pcss +11 -17
- package/source/components/form/style/api-bar.pcss +0 -0
- package/source/components/form/style/button-bar.pcss +5 -0
- package/source/components/form/style/button.pcss +1 -0
- package/source/components/form/style/message-state-button.pcss +1 -0
- package/source/components/form/style/state-button.pcss +1 -0
- package/source/components/form/stylesheet/action-button.mjs +1 -1
- package/source/components/form/stylesheet/api-bar.mjs +38 -0
- package/source/components/form/stylesheet/button-bar.mjs +1 -1
- package/source/components/form/stylesheet/button.mjs +1 -1
- package/source/components/form/stylesheet/message-state-button.mjs +1 -1
- package/source/components/form/stylesheet/state-button.mjs +1 -1
- package/source/components/form/template.mjs +49 -18
- package/source/components/form/tree-select.mjs +60 -42
- package/source/components/layout/iframe.mjs +1 -3
- package/source/components/layout/tabs.mjs +38 -3
- package/source/components/style/badge.css +147 -1
- package/source/components/style/border.css +65 -1
- package/source/components/style/button.css +205 -1
- package/source/components/style/card.css +149 -1
- package/source/components/style/color.css +166 -1
- package/source/components/style/common.css +159 -1
- package/source/components/style/control.css +14 -1
- package/source/components/style/data-grid.css +447 -1
- package/source/components/style/display.css +32 -1
- package/source/components/style/floating-ui.css +42 -1
- package/source/components/style/form.css +47 -1
- package/source/components/style/host.css +14 -1
- package/source/components/style/icons.css +1584 -1
- package/source/components/style/link.css +37 -1
- package/source/components/style/normalize.css +144 -1
- package/source/components/style/popper.css +101 -1
- package/source/components/style/property.css +327 -1
- package/source/components/style/ripple.css +13 -1
- package/source/components/style/skeleton.css +164 -1
- package/source/components/style/space.css +240 -1
- package/source/components/style/spinner.css +7 -1
- package/source/components/style/table.css +39 -1
- package/source/components/style/theme.css +356 -1
- package/source/components/style/typography.css +178 -1
- package/source/monster.mjs +1 -0
- package/source/types/version.mjs +1 -1
- package/test/cases/monster.mjs +1 -1
- package/test/web/test.html +2 -2
- package/test/web/tests.js +119 -64
@@ -1,2 +1,38 @@
|
|
1
1
|
/** generated from link.pcss **/
|
2
|
-
a,
|
2
|
+
a,
|
3
|
+
a:active,
|
4
|
+
a:focus,
|
5
|
+
a:hover,
|
6
|
+
a:link,
|
7
|
+
a:visited {
|
8
|
+
color: var(--monster-color-secondary-1);
|
9
|
+
outline: none;
|
10
|
+
text-decoration: none;
|
11
|
+
transition: color .3s ease-in-out, text-decoration-color .3s ease-in-out;
|
12
|
+
}
|
13
|
+
a:active,
|
14
|
+
a:focus,
|
15
|
+
a:hover {
|
16
|
+
color: var(--monster-color-primary-2);
|
17
|
+
text-decoration: underline;
|
18
|
+
text-decoration-color: var(--monster-color-secondary-1);
|
19
|
+
text-decoration-thickness: 1px;
|
20
|
+
text-underline-offset: 2px;
|
21
|
+
}
|
22
|
+
a:focus {
|
23
|
+
outline: 1px dashed var(--monster-color-selection-1);
|
24
|
+
outline-offset: 2px;
|
25
|
+
}
|
26
|
+
@media (prefers-color-scheme: dark) {
|
27
|
+
a,
|
28
|
+
a:active,
|
29
|
+
a:focus,
|
30
|
+
a:hover,
|
31
|
+
a:link,
|
32
|
+
a:visited {
|
33
|
+
color: var(--monster-color-amber-2);
|
34
|
+
}
|
35
|
+
a:focus {
|
36
|
+
outline: 1px dashed var(--monster-color-selection-4);
|
37
|
+
}
|
38
|
+
}
|
@@ -1,2 +1,145 @@
|
|
1
1
|
/** generated from normalize.pcss **/
|
2
|
-
:where(html)
|
2
|
+
:where(html) {
|
3
|
+
line-height: 1.15;
|
4
|
+
-webkit-text-size-adjust: 100%;
|
5
|
+
-moz-text-size-adjust: 100%;
|
6
|
+
text-size-adjust: 100%;
|
7
|
+
}
|
8
|
+
:where(h1) {
|
9
|
+
font-size: 2em;
|
10
|
+
margin-block-end: .67em;
|
11
|
+
margin-block-start: .67em;
|
12
|
+
}
|
13
|
+
:where(dl, ol, ul) :where(dl, ol, ul) {
|
14
|
+
margin-block-end: 0;
|
15
|
+
margin-block-start: 0;
|
16
|
+
}
|
17
|
+
:where(hr) {
|
18
|
+
box-sizing: content-box;
|
19
|
+
color: inherit;
|
20
|
+
height: 0;
|
21
|
+
}
|
22
|
+
:where(abbr[title]) {
|
23
|
+
text-decoration: underline;
|
24
|
+
-webkit-text-decoration: underline dotted;
|
25
|
+
text-decoration: underline dotted;
|
26
|
+
}
|
27
|
+
:where(b, strong) {
|
28
|
+
font-weight: bolder;
|
29
|
+
}
|
30
|
+
:where(code, kbd, pre, samp) {
|
31
|
+
font-family: monospace, monospace;
|
32
|
+
font-size: 1em;
|
33
|
+
}
|
34
|
+
:where(small) {
|
35
|
+
font-size: 80%;
|
36
|
+
}
|
37
|
+
:where(table) {
|
38
|
+
border-color: currentColor;
|
39
|
+
text-indent: 0;
|
40
|
+
}
|
41
|
+
:where(button, input, select) {
|
42
|
+
margin: 0;
|
43
|
+
}
|
44
|
+
:where(button) {
|
45
|
+
text-transform: none;
|
46
|
+
}
|
47
|
+
:where(
|
48
|
+
button,
|
49
|
+
input:is([type="button" i], [type="reset" i], [type="submit" i])
|
50
|
+
) {
|
51
|
+
-webkit-appearance: button;
|
52
|
+
}
|
53
|
+
:where(progress) {
|
54
|
+
vertical-align: baseline;
|
55
|
+
}
|
56
|
+
:where(select) {
|
57
|
+
text-transform: none;
|
58
|
+
}
|
59
|
+
:where(textarea) {
|
60
|
+
margin: 0;
|
61
|
+
}
|
62
|
+
:where(input[type="search" i]) {
|
63
|
+
-webkit-appearance: textfield;
|
64
|
+
outline-offset: -2px;
|
65
|
+
}
|
66
|
+
::-webkit-inner-spin-button,
|
67
|
+
::-webkit-outer-spin-button {
|
68
|
+
height: auto;
|
69
|
+
}
|
70
|
+
::-webkit-input-placeholder {
|
71
|
+
color: inherit;
|
72
|
+
opacity: 0.54;
|
73
|
+
}
|
74
|
+
::-webkit-search-decoration {
|
75
|
+
-webkit-appearance: none;
|
76
|
+
}
|
77
|
+
::-webkit-file-upload-button {
|
78
|
+
-webkit-appearance: button;
|
79
|
+
font: inherit;
|
80
|
+
}
|
81
|
+
:where(
|
82
|
+
button,
|
83
|
+
input:is(
|
84
|
+
[type="button" i],
|
85
|
+
[type="color" i],
|
86
|
+
[type="reset" i],
|
87
|
+
[type="submit" i]
|
88
|
+
)
|
89
|
+
)::-moz-focus-inner {
|
90
|
+
border-style: none;
|
91
|
+
padding: 0;
|
92
|
+
}
|
93
|
+
:where(
|
94
|
+
button,
|
95
|
+
input:is(
|
96
|
+
[type="button" i],
|
97
|
+
[type="color" i],
|
98
|
+
[type="reset" i],
|
99
|
+
[type="submit" i]
|
100
|
+
)
|
101
|
+
)::-moz-focusring {
|
102
|
+
outline: 1px dotted ButtonText;
|
103
|
+
}
|
104
|
+
:where(:-moz-ui-invalid) {
|
105
|
+
box-shadow: none;
|
106
|
+
}
|
107
|
+
:where(dialog) {
|
108
|
+
background-color: #fff;
|
109
|
+
border: solid;
|
110
|
+
color: #000;
|
111
|
+
height: -moz-fit-content;
|
112
|
+
height: fit-content;
|
113
|
+
left: 0;
|
114
|
+
margin: auto;
|
115
|
+
padding: 1em;
|
116
|
+
position: absolute;
|
117
|
+
right: 0;
|
118
|
+
width: -moz-fit-content;
|
119
|
+
width: fit-content;
|
120
|
+
}
|
121
|
+
:where(dialog:not([open])) {
|
122
|
+
display: none;
|
123
|
+
}
|
124
|
+
:where(summary) {
|
125
|
+
display: list-item;
|
126
|
+
}
|
127
|
+
html {
|
128
|
+
height: 100%;
|
129
|
+
}
|
130
|
+
body,
|
131
|
+
html {
|
132
|
+
min-height: calc(100vh - 40px);
|
133
|
+
}
|
134
|
+
body {
|
135
|
+
box-sizing: border-box;
|
136
|
+
margin: 0;
|
137
|
+
padding: 0;
|
138
|
+
word-break: break-word;
|
139
|
+
}
|
140
|
+
body:focus-visible {
|
141
|
+
outline: none;
|
142
|
+
}
|
143
|
+
:focus-visible {
|
144
|
+
outline: none;
|
145
|
+
}
|
@@ -1,2 +1,102 @@
|
|
1
1
|
/** generated from popper.pcss **/
|
2
|
-
div[data-monster-role=popper
|
2
|
+
div[data-monster-role="popper"] {
|
3
|
+
background: var(--monster-bg-color-primary-1);
|
4
|
+
border-color: var(--monster-bg-color-primary-4);
|
5
|
+
border-radius: var(--monster-border-radius);
|
6
|
+
border-style: var(--monster-border-style);
|
7
|
+
border-width: var(--monster-border-width);
|
8
|
+
box-shadow: var(--monster-box-shadow-1);
|
9
|
+
box-sizing: border-box;
|
10
|
+
color: var(--monster-color-primary-1);
|
11
|
+
display: none;
|
12
|
+
padding: 1.1em;
|
13
|
+
z-index: var(--monster-z-index-modal);
|
14
|
+
}
|
15
|
+
[data-popper-arrow],
|
16
|
+
[data-popper-arrow]:before {
|
17
|
+
background: inherit;
|
18
|
+
height: calc(
|
19
|
+
max(
|
20
|
+
var(--monster-popper-witharrrow-distance),
|
21
|
+
-1 *
|
22
|
+
var(--monster-popper-witharrrow-distance)
|
23
|
+
) *
|
24
|
+
2
|
25
|
+
);
|
26
|
+
position: absolute;
|
27
|
+
width: calc(
|
28
|
+
max(
|
29
|
+
var(--monster-popper-witharrrow-distance),
|
30
|
+
-1 *
|
31
|
+
var(--monster-popper-witharrrow-distance)
|
32
|
+
) *
|
33
|
+
2
|
34
|
+
);
|
35
|
+
}
|
36
|
+
[data-popper-arrow] {
|
37
|
+
visibility: hidden;
|
38
|
+
}
|
39
|
+
[data-popper-arrow]:before {
|
40
|
+
box-sizing: border-box;
|
41
|
+
content: "";
|
42
|
+
transform: rotate(45deg);
|
43
|
+
visibility: visible;
|
44
|
+
}
|
45
|
+
div[data-popper-placement^="top"] > [data-popper-arrow] {
|
46
|
+
bottom: calc(
|
47
|
+
var(--monster-popper-witharrrow-distance) -
|
48
|
+
var(--monster-border-width) /
|
49
|
+
2
|
50
|
+
);
|
51
|
+
}
|
52
|
+
div[data-popper-placement^="top"] > [data-popper-arrow]:before {
|
53
|
+
border-bottom: var(--monster-border-width) var(--monster-border-style)
|
54
|
+
var(--monster-bg-color-primary-4);
|
55
|
+
border-left: transparent;
|
56
|
+
border-right: var(--monster-border-width) var(--monster-border-style)
|
57
|
+
var(--monster-bg-color-primary-4);
|
58
|
+
border-top: transparent;
|
59
|
+
}
|
60
|
+
div[data-popper-placement^="bottom"] > [data-popper-arrow] {
|
61
|
+
top: calc(
|
62
|
+
var(--monster-popper-witharrrow-distance) -
|
63
|
+
var(--monster-border-width)
|
64
|
+
);
|
65
|
+
}
|
66
|
+
div[data-popper-placement^="bottom"] > [data-popper-arrow]:before {
|
67
|
+
border-bottom: transparent;
|
68
|
+
border-left: var(--monster-border-width) var(--monster-border-style)
|
69
|
+
var(--monster-bg-color-primary-4);
|
70
|
+
border-right: transparent;
|
71
|
+
border-top: var(--monster-border-width) var(--monster-border-style)
|
72
|
+
var(--monster-bg-color-primary-4);
|
73
|
+
}
|
74
|
+
div[data-popper-placement^="left"] > [data-popper-arrow] {
|
75
|
+
right: calc(
|
76
|
+
var(--monster-popper-witharrrow-distance) -
|
77
|
+
var(--monster-border-width)
|
78
|
+
);
|
79
|
+
}
|
80
|
+
div[data-popper-placement^="left"] > [data-popper-arrow]:before {
|
81
|
+
border-bottom: transparent;
|
82
|
+
border-left: transparent;
|
83
|
+
border-right: var(--monster-border-width) var(--monster-border-style)
|
84
|
+
var(--monster-bg-color-primary-4);
|
85
|
+
border-top: var(--monster-border-width) var(--monster-border-style)
|
86
|
+
var(--monster-bg-color-primary-4);
|
87
|
+
}
|
88
|
+
div[data-popper-placement^="right"] > [data-popper-arrow] {
|
89
|
+
left: calc(
|
90
|
+
var(--monster-popper-witharrrow-distance) -
|
91
|
+
var(--monster-border-width) /
|
92
|
+
2
|
93
|
+
);
|
94
|
+
}
|
95
|
+
div[data-popper-placement^="right"] > [data-popper-arrow]:before {
|
96
|
+
border-bottom: var(--monster-border-width) var(--monster-border-style)
|
97
|
+
var(--monster-bg-color-primary-4);
|
98
|
+
border-left: var(--monster-border-width) var(--monster-border-style)
|
99
|
+
var(--monster-bg-color-primary-4);
|
100
|
+
border-right: transparent;
|
101
|
+
border-top: transparent;
|
102
|
+
}
|
@@ -1,2 +1,328 @@
|
|
1
1
|
/** generated from property.pcss **/
|
2
|
-
:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,"Quicksand","Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--monster-font-family-monospace:"Consolas","Courier New","Roboto Mono","Source Code Pro","Fira Mono",monospace;--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-cinnamon-1);--monster-color-primary-4:var(--monster-color-cinnamon-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-6);--monster-bg-color-primary-4:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1)}}:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1)}}:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3)}}:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3)}}:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}}:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045;--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-theme-control-bg-color:var(--monster-color-seashell-1);--monster-theme-control-color:var(--monster-color-seashell-6);--monster-theme-control-hover-color:var(--monster-color-seashell-6);--monster-theme-control-hover-bg-color:var(--monster-color-seashell-2);--monster-theme-control-border-width:2px;--monster-theme-control-border-style:solid;--monster-theme-control-border-radius:0;--monster-theme-control-border-color:var(--monster-color-primary-1)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-control-bg-color:var(--monster-color-gray-5);--monster-theme-control-color:var(--monster-color-gray-1);--monster-theme-control-border-color:var(--monster-color-gray-3);--monster-theme-control-hover-color:var(--monster-color-gray-1);--monster-theme-control-hover-bg-color:var(--monster-color-gray-6)}}:after,:before,:root{--monster-theme-on-color:var(--monster-color-green-1);--monster-theme-on-bg-color:var(--monster-color-green-5);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-on-color:var(--monster-color-gray-6);--monster-theme-on-bg-color:var(--monster-color-gray-1);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-5)}}:after,:before,:root{--monster-border-style:solid;--monster-border-width:3px;--monster-border-radius:0;--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px;--monster-dragger-width:2px;--monster-dragger-handle-width:4px;--monster-dragger-handle-height:50px}
|
2
|
+
:after,
|
3
|
+
:before,
|
4
|
+
:root {
|
5
|
+
--monster-font-family:
|
6
|
+
-apple-system, BlinkMacSystemFont, "Quicksand", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
7
|
+
--monster-font-family-monospace: "Consolas", "Courier New", "Roboto Mono",
|
8
|
+
"Source Code Pro", "Fira Mono", monospace;
|
9
|
+
--monster-color-primary-1: var(--monster-color-gray-6);
|
10
|
+
--monster-color-primary-2: var(--monster-color-gray-6);
|
11
|
+
--monster-color-primary-3: var(--monster-color-cinnamon-1);
|
12
|
+
--monster-color-primary-4: var(--monster-color-cinnamon-1);
|
13
|
+
--monster-bg-color-primary-1: var(--monster-color-gray-1);
|
14
|
+
--monster-bg-color-primary-2: var(--monster-color-gray-2);
|
15
|
+
--monster-bg-color-primary-3: var(--monster-color-gray-6);
|
16
|
+
--monster-bg-color-primary-4: var(--monster-color-gray-4);
|
17
|
+
}
|
18
|
+
@media (prefers-color-scheme: dark) {
|
19
|
+
:after,
|
20
|
+
:before,
|
21
|
+
:root {
|
22
|
+
--monster-color-primary-1: var(--monster-color-gray-1);
|
23
|
+
--monster-color-primary-2: var(--monster-color-gray-1);
|
24
|
+
--monster-color-primary-3: var(--monster-color-gray-6);
|
25
|
+
--monster-color-primary-4: var(--monster-color-gray-6);
|
26
|
+
--monster-bg-color-primary-1: var(--monster-color-gray-6);
|
27
|
+
--monster-bg-color-primary-2: var(--monster-color-gray-3);
|
28
|
+
--monster-bg-color-primary-3: var(--monster-color-gray-2);
|
29
|
+
--monster-bg-color-primary-4: var(--monster-color-gray-1);
|
30
|
+
}
|
31
|
+
}
|
32
|
+
:after,
|
33
|
+
:before,
|
34
|
+
:root {
|
35
|
+
--monster-color-secondary-1: var(--monster-color-red-4);
|
36
|
+
--monster-color-secondary-2: var(--monster-color-red-4);
|
37
|
+
--monster-color-secondary-3: var(--monster-color-red-1);
|
38
|
+
--monster-color-secondary-4: var(--monster-color-red-1);
|
39
|
+
--monster-bg-color-secondary-1: var(--monster-color-gray-1);
|
40
|
+
--monster-bg-color-secondary-2: var(--monster-color-red-2);
|
41
|
+
--monster-bg-color-secondary-3: var(--monster-color-red-3);
|
42
|
+
--monster-bg-color-secondary-4: var(--monster-color-red-6);
|
43
|
+
}
|
44
|
+
@media (prefers-color-scheme: dark) {
|
45
|
+
:after,
|
46
|
+
:before,
|
47
|
+
:root {
|
48
|
+
--monster-color-secondary-1: var(--monster-color-red-1);
|
49
|
+
--monster-color-secondary-2: var(--monster-color-red-1);
|
50
|
+
--monster-color-secondary-3: var(--monster-color-red-6);
|
51
|
+
--monster-color-secondary-4: var(--monster-color-red-4);
|
52
|
+
--monster-bg-color-secondary-1: var(--monster-color-gray-6);
|
53
|
+
--monster-bg-color-secondary-2: var(--monster-color-red-3);
|
54
|
+
--monster-bg-color-secondary-3: var(--monster-color-red-2);
|
55
|
+
--monster-bg-color-secondary-4: var(--monster-color-red-1);
|
56
|
+
}
|
57
|
+
}
|
58
|
+
:after,
|
59
|
+
:before,
|
60
|
+
:root {
|
61
|
+
--monster-color-tertiary-1: var(--monster-color-magenta-4);
|
62
|
+
--monster-color-tertiary-2: var(--monster-color-magenta-4);
|
63
|
+
--monster-color-tertiary-3: var(--monster-color-magenta-6);
|
64
|
+
--monster-color-tertiary-4: var(--monster-color-magenta-1);
|
65
|
+
--monster-bg-color-tertiary-1: var(--monster-color-gray-1);
|
66
|
+
--monster-bg-color-tertiary-2: var(--monster-color-magenta-1);
|
67
|
+
--monster-bg-color-tertiary-3: var(--monster-color-magenta-2);
|
68
|
+
--monster-bg-color-tertiary-4: var(--monster-color-magenta-6);
|
69
|
+
}
|
70
|
+
@media (prefers-color-scheme: dark) {
|
71
|
+
:after,
|
72
|
+
:before,
|
73
|
+
:root {
|
74
|
+
--monster-color-tertiary-1: var(--monster-color-magenta-1);
|
75
|
+
--monster-color-tertiary-2: var(--monster-color-magenta-6);
|
76
|
+
--monster-color-tertiary-3: var(--monster-color-magenta-4);
|
77
|
+
--monster-color-tertiary-4: var(--monster-color-magenta-4);
|
78
|
+
--monster-bg-color-tertiary-1: var(--monster-color-gray-6);
|
79
|
+
--monster-bg-color-tertiary-2: var(--monster-color-magenta-2);
|
80
|
+
--monster-bg-color-tertiary-3: var(--monster-color-magenta-1);
|
81
|
+
--monster-bg-color-tertiary-4: var(--monster-color-magenta-1);
|
82
|
+
}
|
83
|
+
}
|
84
|
+
:after,
|
85
|
+
:before,
|
86
|
+
:root {
|
87
|
+
--monster-color-destructive-1: var(--monster-color-red-1);
|
88
|
+
--monster-color-destructive-2: var(--monster-color-red-4);
|
89
|
+
--monster-color-destructive-3: var(--monster-color-red-6);
|
90
|
+
--monster-color-destructive-4: var(--monster-color-red-1);
|
91
|
+
--monster-bg-color-destructive-1: var(--monster-color-red-4);
|
92
|
+
--monster-bg-color-destructive-2: var(--monster-color-gray-1);
|
93
|
+
--monster-bg-color-destructive-3: var(--monster-color-red-2);
|
94
|
+
--monster-bg-color-destructive-4: var(--monster-color-red-5);
|
95
|
+
}
|
96
|
+
@media (prefers-color-scheme: dark) {
|
97
|
+
:after,
|
98
|
+
:before,
|
99
|
+
:root {
|
100
|
+
--monster-color-destructive-1: var(--monster-color-red-1);
|
101
|
+
--monster-color-destructive-2: var(--monster-color-red-3);
|
102
|
+
--monster-color-destructive-3: var(--monster-color-red-4);
|
103
|
+
--monster-color-destructive-4: var(--monster-color-red-1);
|
104
|
+
--monster-bg-color-destructive-1: var(--monster-color-red-5);
|
105
|
+
--monster-bg-color-destructive-2: var(--monster-color-gray-6);
|
106
|
+
--monster-bg-color-destructive-3: var(--monster-color-red-1);
|
107
|
+
--monster-bg-color-destructive-4: var(--monster-color-red-4);
|
108
|
+
}
|
109
|
+
}
|
110
|
+
:after,
|
111
|
+
:before,
|
112
|
+
:root {
|
113
|
+
--monster-color-success-1: var(--monster-color-green-1);
|
114
|
+
--monster-color-success-2: var(--monster-color-green-4);
|
115
|
+
--monster-color-success-3: var(--monster-color-green-6);
|
116
|
+
--monster-color-success-4: var(--monster-color-green-1);
|
117
|
+
--monster-bg-color-success-1: var(--monster-color-green-3);
|
118
|
+
--monster-bg-color-success-2: var(--monster-color-gray-1);
|
119
|
+
--monster-bg-color-success-3: var(--monster-color-green-2);
|
120
|
+
--monster-bg-color-success-4: var(--monster-color-green-5);
|
121
|
+
}
|
122
|
+
@media (prefers-color-scheme: dark) {
|
123
|
+
:after,
|
124
|
+
:before,
|
125
|
+
:root {
|
126
|
+
--monster-color-success-1: var(--monster-color-green-1);
|
127
|
+
--monster-color-success-2: var(--monster-color-green-2);
|
128
|
+
--monster-color-success-3: var(--monster-color-green-4);
|
129
|
+
--monster-color-success-4: var(--monster-color-green-1);
|
130
|
+
--monster-bg-color-success-1: var(--monster-color-green-5);
|
131
|
+
--monster-bg-color-success-2: var(--monster-color-gray-6);
|
132
|
+
--monster-bg-color-success-3: var(--monster-color-green-1);
|
133
|
+
--monster-bg-color-success-4: var(--monster-color-green-3);
|
134
|
+
}
|
135
|
+
}
|
136
|
+
:after,
|
137
|
+
:before,
|
138
|
+
:root {
|
139
|
+
--monster-color-warning-1: var(--monster-color-orange-1);
|
140
|
+
--monster-color-warning-2: var(--monster-color-orange-4);
|
141
|
+
--monster-color-warning-3: var(--monster-color-orange-6);
|
142
|
+
--monster-color-warning-4: var(--monster-color-orange-1);
|
143
|
+
--monster-bg-color-warning-1: var(--monster-color-orange-3);
|
144
|
+
--monster-bg-color-warning-2: var(--monster-color-gray-1);
|
145
|
+
--monster-bg-color-warning-3: var(--monster-color-orange-2);
|
146
|
+
--monster-bg-color-warning-4: var(--monster-color-orange-5);
|
147
|
+
}
|
148
|
+
@media (prefers-color-scheme: dark) {
|
149
|
+
:after,
|
150
|
+
:before,
|
151
|
+
:root {
|
152
|
+
--monster-color-warning-1: var(--monster-color-orange-1);
|
153
|
+
--monster-color-warning-2: var(--monster-color-orange-3);
|
154
|
+
--monster-color-warning-3: var(--monster-color-orange-4);
|
155
|
+
--monster-color-warning-4: var(--monster-color-orange-1);
|
156
|
+
--monster-bg-color-warning-1: var(--monster-color-orange-5);
|
157
|
+
--monster-bg-color-warning-2: var(--monster-color-gray-6);
|
158
|
+
--monster-bg-color-warning-3: var(--monster-color-orange-1);
|
159
|
+
--monster-bg-color-warning-4: var(--monster-color-orange-3);
|
160
|
+
}
|
161
|
+
}
|
162
|
+
:after,
|
163
|
+
:before,
|
164
|
+
:root {
|
165
|
+
--monster-color-error-1: var(--monster-color-red-1);
|
166
|
+
--monster-color-error-2: var(--monster-color-red-4);
|
167
|
+
--monster-color-error-3: var(--monster-color-red-6);
|
168
|
+
--monster-color-error-4: var(--monster-color-red-1);
|
169
|
+
--monster-bg-color-error-1: var(--monster-color-red-4);
|
170
|
+
--monster-bg-color-error-2: var(--monster-color-gray-1);
|
171
|
+
--monster-bg-color-error-3: var(--monster-color-red-2);
|
172
|
+
--monster-bg-color-error-4: var(--monster-color-red-5);
|
173
|
+
}
|
174
|
+
@media (prefers-color-scheme: dark) {
|
175
|
+
:after,
|
176
|
+
:before,
|
177
|
+
:root {
|
178
|
+
--monster-color-error-1: var(--monster-color-red-1);
|
179
|
+
--monster-color-error-2: var(--monster-color-red-3);
|
180
|
+
--monster-color-error-3: var(--monster-color-red-4);
|
181
|
+
--monster-color-error-4: var(--monster-color-red-1);
|
182
|
+
--monster-bg-color-error-1: var(--monster-color-red-5);
|
183
|
+
--monster-bg-color-error-2: var(--monster-color-gray-6);
|
184
|
+
--monster-bg-color-error-3: var(--monster-color-red-1);
|
185
|
+
--monster-bg-color-error-4: var(--monster-color-red-4);
|
186
|
+
}
|
187
|
+
}
|
188
|
+
:after,
|
189
|
+
:before,
|
190
|
+
:root {
|
191
|
+
--monster-color-selection-1: var(--monster-color-gray-6);
|
192
|
+
--monster-color-selection-2: var(--monster-color-gray-6);
|
193
|
+
--monster-color-selection-3: var(--monster-color-gray-6);
|
194
|
+
--monster-color-selection-4: var(--monster-color-gray-1);
|
195
|
+
--monster-bg-color-selection-1: var(--monster-color-yellow-2);
|
196
|
+
--monster-bg-color-selection-2: var(--monster-color-yellow-1);
|
197
|
+
--monster-bg-color-selection-3: var(--monster-color-yellow-2);
|
198
|
+
--monster-bg-color-selection-4: var(--monster-color-yellow-6);
|
199
|
+
}
|
200
|
+
@media (prefers-color-scheme: dark) {
|
201
|
+
:after,
|
202
|
+
:before,
|
203
|
+
:root {
|
204
|
+
--monster-color-selection-1: var(--monster-color-gray-6);
|
205
|
+
--monster-color-selection-2: var(--monster-color-gray-6);
|
206
|
+
--monster-color-selection-3: var(--monster-color-gray-6);
|
207
|
+
--monster-color-selection-4: var(--monster-color-gray-1);
|
208
|
+
--monster-bg-color-selection-1: var(--monster-color-yellow-2);
|
209
|
+
--monster-bg-color-selection-2: var(--monster-color-yellow-1);
|
210
|
+
--monster-bg-color-selection-3: var(--monster-color-yellow-2);
|
211
|
+
--monster-bg-color-selection-4: var(--monster-color-yellow-6);
|
212
|
+
}
|
213
|
+
}
|
214
|
+
:after,
|
215
|
+
:before,
|
216
|
+
:root {
|
217
|
+
--monster-color-primary-disabled-1: var(--monster-color-gray-4);
|
218
|
+
--monster-color-primary-disabled-2: var(--monster-color-gray-4);
|
219
|
+
--monster-color-primary-disabled-3: var(--monster-color-gray-4);
|
220
|
+
--monster-color-primary-disabled-4: var(--monster-color-gray-4);
|
221
|
+
--monster-bg-color-primary-disabled-1: var(--monster-color-gray-1);
|
222
|
+
--monster-bg-color-primary-disabled-2: var(--monster-color-gray-2);
|
223
|
+
--monster-bg-color-primary-disabled-3: var(--monster-color-gray-3);
|
224
|
+
--monster-bg-color-primary-disabled-4: var(--monster-color-gray-6);
|
225
|
+
}
|
226
|
+
@media (prefers-color-scheme: dark) {
|
227
|
+
:after,
|
228
|
+
:before,
|
229
|
+
:root {
|
230
|
+
--monster-color-primary-disabled-1: var(--monster-color-gray-4);
|
231
|
+
--monster-color-primary-disabled-2: var(--monster-color-gray-4);
|
232
|
+
--monster-color-primary-disabled-3: var(--monster-color-gray-3);
|
233
|
+
--monster-color-primary-disabled-4: var(--monster-color-gray-3);
|
234
|
+
--monster-bg-color-primary-disabled-1: var(--monster-color-gray-6);
|
235
|
+
--monster-bg-color-primary-disabled-2: var(--monster-color-gray-3);
|
236
|
+
--monster-bg-color-primary-disabled-3: var(--monster-color-gray-2);
|
237
|
+
--monster-bg-color-primary-disabled-4: var(--monster-color-gray-1);
|
238
|
+
}
|
239
|
+
}
|
240
|
+
:after,
|
241
|
+
:before,
|
242
|
+
:root {
|
243
|
+
--monster-color-gradient-1: #833ab4;
|
244
|
+
--monster-color-gradient-2: #fd1d1d;
|
245
|
+
--monster-color-gradient-3: #fcb045;
|
246
|
+
--monster-box-shadow-1: none;
|
247
|
+
--monster-box-shadow-2: -1px 1px 10px 1px hsla(0, 0%, 76%, 0.61);
|
248
|
+
--monster-text-shadow: none;
|
249
|
+
--monster-theme-control-bg-color: var(--monster-color-seashell-1);
|
250
|
+
--monster-theme-control-color: var(--monster-color-seashell-6);
|
251
|
+
--monster-theme-control-hover-color: var(--monster-color-seashell-6);
|
252
|
+
--monster-theme-control-hover-bg-color: var(--monster-color-seashell-2);
|
253
|
+
--monster-theme-control-border-width: 2px;
|
254
|
+
--monster-theme-control-border-style: solid;
|
255
|
+
--monster-theme-control-border-radius: 0;
|
256
|
+
--monster-theme-control-border-color: var(--monster-color-primary-1);
|
257
|
+
}
|
258
|
+
@media (prefers-color-scheme: dark) {
|
259
|
+
:after,
|
260
|
+
:before,
|
261
|
+
:root {
|
262
|
+
--monster-theme-control-bg-color: var(--monster-color-gray-5);
|
263
|
+
--monster-theme-control-color: var(--monster-color-gray-1);
|
264
|
+
--monster-theme-control-border-color: var(--monster-color-gray-3);
|
265
|
+
--monster-theme-control-hover-color: var(--monster-color-gray-1);
|
266
|
+
--monster-theme-control-hover-bg-color: var(--monster-color-gray-6);
|
267
|
+
}
|
268
|
+
}
|
269
|
+
:after,
|
270
|
+
:before,
|
271
|
+
:root {
|
272
|
+
--monster-theme-on-color: var(--monster-color-green-1);
|
273
|
+
--monster-theme-on-bg-color: var(--monster-color-green-5);
|
274
|
+
--monster-theme-off-color: var(--monster-color-gray-1);
|
275
|
+
--monster-theme-off-bg-color: var(--monster-color-gray-4);
|
276
|
+
}
|
277
|
+
@media (prefers-color-scheme: dark) {
|
278
|
+
:after,
|
279
|
+
:before,
|
280
|
+
:root {
|
281
|
+
--monster-theme-on-color: var(--monster-color-gray-6);
|
282
|
+
--monster-theme-on-bg-color: var(--monster-color-gray-1);
|
283
|
+
--monster-theme-off-color: var(--monster-color-gray-1);
|
284
|
+
--monster-theme-off-bg-color: var(--monster-color-gray-5);
|
285
|
+
}
|
286
|
+
}
|
287
|
+
:after,
|
288
|
+
:before,
|
289
|
+
:root {
|
290
|
+
--monster-border-style: solid;
|
291
|
+
--monster-border-width: 3px;
|
292
|
+
--monster-border-radius: 0;
|
293
|
+
--monster-popper-witharrrow-distance: -4px;
|
294
|
+
--monster-z-index-default: 0;
|
295
|
+
--monster-z-index-outline: 10;
|
296
|
+
--monster-z-index-dropdown: 200;
|
297
|
+
--monster-z-index-dropdown-overlay: 210;
|
298
|
+
--monster-z-index-sticky: 300;
|
299
|
+
--monster-z-index-sticky-overlay: 310;
|
300
|
+
--monster-z-index-fixed: 400;
|
301
|
+
--monster-z-index-fixed-overlay: 410;
|
302
|
+
--monster-z-index-modal-backdrop: 500;
|
303
|
+
--monster-z-index-modal-backdrop-overlay: 510;
|
304
|
+
--monster-z-index-offcanvas: 600;
|
305
|
+
--monster-z-index-offcanvas-overlay: 610;
|
306
|
+
--monster-z-index-modal: 700;
|
307
|
+
--monster-z-index-modal-overlay: 710;
|
308
|
+
--monster-z-index-popover: 800;
|
309
|
+
--monster-z-index-popover-overlay: 810;
|
310
|
+
--monster-z-index-tooltip: 800;
|
311
|
+
--monster-z-index-tooltip-overlay: 910;
|
312
|
+
--monster-space-0: 0;
|
313
|
+
--monster-space-1: 2px;
|
314
|
+
--monster-space-2: 4px;
|
315
|
+
--monster-space-3: 6px;
|
316
|
+
--monster-space-4: 10px;
|
317
|
+
--monster-space-5: 16px;
|
318
|
+
--monster-space-6: 26px;
|
319
|
+
--monster-space-7: 42px;
|
320
|
+
--monster-breakpoint-0: 480px;
|
321
|
+
--monster-breakpoint-4: 480px;
|
322
|
+
--monster-breakpoint-7: 768px;
|
323
|
+
--monster-breakpoint-9: 992px;
|
324
|
+
--monster-breakpoint-12: 1200px;
|
325
|
+
--monster-dragger-width: 2px;
|
326
|
+
--monster-dragger-handle-width: 4px;
|
327
|
+
--monster-dragger-handle-height: 50px;
|
328
|
+
}
|
@@ -1,2 +1,14 @@
|
|
1
1
|
/** generated from ripple.pcss **/
|
2
|
-
span.monster-fx-ripple
|
2
|
+
span.monster-fx-ripple {
|
3
|
+
animation: monster-fx-ripple .6s linear;
|
4
|
+
background-color: hsla(0, 0%, 100%, 0.7);
|
5
|
+
border-radius: 50%;
|
6
|
+
position: absolute;
|
7
|
+
transform: scale(0);
|
8
|
+
}
|
9
|
+
@keyframes monster-fx-ripple {
|
10
|
+
to {
|
11
|
+
opacity: 0;
|
12
|
+
transform: scale(4);
|
13
|
+
}
|
14
|
+
}
|