tweak-ui 0.4.3 → 0.5.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/LICENSE +7 -7
- package/README.md +32 -32
- package/dist/lib/builder.d.ts +166 -162
- package/dist/lib/builder.d.ts.map +1 -1
- package/dist/lib/builder.js +250 -0
- package/dist/lib/builder.js.map +1 -0
- package/dist/lib/color-formats/array-format.d.ts +8 -8
- package/dist/lib/color-formats/array-format.js +18 -0
- package/dist/lib/color-formats/array-format.js.map +1 -0
- package/dist/lib/color-formats/converter.d.ts +18 -18
- package/dist/lib/color-formats/converter.js +85 -0
- package/dist/lib/color-formats/converter.js.map +1 -0
- package/dist/lib/color-formats/css-string-format.d.ts +7 -7
- package/dist/lib/color-formats/css-string-format.js +28 -0
- package/dist/lib/color-formats/css-string-format.js.map +1 -0
- package/dist/lib/color-formats/formatter.d.ts +8 -8
- package/dist/lib/color-formats/formatter.js +35 -0
- package/dist/lib/color-formats/formatter.js.map +1 -0
- package/dist/lib/color-formats/hex-string-format.d.ts +7 -7
- package/dist/lib/color-formats/hex-string-format.js +28 -0
- package/dist/lib/color-formats/hex-string-format.js.map +1 -0
- package/dist/lib/color-formats/index.d.ts +3 -3
- package/dist/lib/color-formats/index.js +4 -0
- package/dist/lib/color-formats/index.js.map +1 -0
- package/dist/lib/color-formats/number-format.d.ts +8 -8
- package/dist/lib/color-formats/number-format.js +23 -0
- package/dist/lib/color-formats/number-format.js.map +1 -0
- package/dist/lib/color-formats/object-format.d.ts +14 -14
- package/dist/lib/color-formats/object-format.js +23 -0
- package/dist/lib/color-formats/object-format.js.map +1 -0
- package/dist/lib/color-formats/types.d.ts +101 -101
- package/dist/lib/color-formats/types.js +2 -0
- package/dist/lib/color-formats/types.js.map +1 -0
- package/dist/lib/components/button.d.ts +28 -28
- package/dist/lib/components/button.d.ts.map +1 -1
- package/dist/lib/components/button.js +15 -0
- package/dist/lib/components/button.js.map +1 -0
- package/dist/lib/components/content.d.ts +21 -21
- package/dist/lib/components/content.d.ts.map +1 -1
- package/dist/lib/components/content.js +10 -0
- package/dist/lib/components/content.js.map +1 -0
- package/dist/lib/components/controls/angle.d.ts +51 -51
- package/dist/lib/components/controls/angle.d.ts.map +1 -1
- package/dist/lib/components/controls/angle.js +201 -0
- package/dist/lib/components/controls/angle.js.map +1 -0
- package/dist/lib/components/controls/checkbox.d.ts +28 -28
- package/dist/lib/components/controls/checkbox.d.ts.map +1 -1
- package/dist/lib/components/controls/checkbox.js +31 -0
- package/dist/lib/components/controls/checkbox.js.map +1 -0
- package/dist/lib/components/controls/color-picker.d.ts +56 -56
- package/dist/lib/components/controls/color-picker.d.ts.map +1 -1
- package/dist/lib/components/controls/color-picker.js +267 -0
- package/dist/lib/components/controls/color-picker.js.map +1 -0
- package/dist/lib/components/controls/color.d.ts +51 -51
- package/dist/lib/components/controls/color.d.ts.map +1 -1
- package/dist/lib/components/controls/color.js +77 -0
- package/dist/lib/components/controls/color.js.map +1 -0
- package/dist/lib/components/controls/index.d.ts +10 -10
- package/dist/lib/components/controls/index.js +11 -0
- package/dist/lib/components/controls/index.js.map +1 -0
- package/dist/lib/components/controls/number.d.ts +47 -47
- package/dist/lib/components/controls/number.d.ts.map +1 -1
- package/dist/lib/components/controls/number.js +142 -0
- package/dist/lib/components/controls/number.js.map +1 -0
- package/dist/lib/components/controls/point.d.ts +47 -47
- package/dist/lib/components/controls/point.d.ts.map +1 -1
- package/dist/lib/components/controls/point.js +137 -0
- package/dist/lib/components/controls/point.js.map +1 -0
- package/dist/lib/components/controls/position.d.ts +55 -55
- package/dist/lib/components/controls/position.d.ts.map +1 -1
- package/dist/lib/components/controls/position.js +36 -0
- package/dist/lib/components/controls/position.js.map +1 -0
- package/dist/lib/components/controls/select.d.ts +59 -59
- package/dist/lib/components/controls/select.d.ts.map +1 -1
- package/dist/lib/components/controls/select.js +132 -0
- package/dist/lib/components/controls/select.js.map +1 -0
- package/dist/lib/components/controls/spherical.d.ts +74 -74
- package/dist/lib/components/controls/spherical.d.ts.map +1 -1
- package/dist/lib/components/controls/spherical.js +302 -0
- package/dist/lib/components/controls/spherical.js.map +1 -0
- package/dist/lib/components/controls/text.d.ts +35 -35
- package/dist/lib/components/controls/text.d.ts.map +1 -1
- package/dist/lib/components/controls/text.js +24 -0
- package/dist/lib/components/controls/text.js.map +1 -0
- package/dist/lib/components/groups/accordion.d.ts +21 -21
- package/dist/lib/components/groups/accordion.d.ts.map +1 -1
- package/dist/lib/components/groups/accordion.js +34 -0
- package/dist/lib/components/groups/accordion.js.map +1 -0
- package/dist/lib/components/groups/container.d.ts +24 -24
- package/dist/lib/components/groups/container.d.ts.map +1 -1
- package/dist/lib/components/groups/container.js +19 -0
- package/dist/lib/components/groups/container.js.map +1 -0
- package/dist/lib/components/groups/group.d.ts +48 -48
- package/dist/lib/components/groups/group.d.ts.map +1 -1
- package/dist/lib/components/groups/group.js +50 -0
- package/dist/lib/components/groups/group.js.map +1 -0
- package/dist/lib/components/groups/index.d.ts +4 -4
- package/dist/lib/components/groups/index.js +5 -0
- package/dist/lib/components/groups/index.js.map +1 -0
- package/dist/lib/components/groups/tabs.d.ts +21 -21
- package/dist/lib/components/groups/tabs.d.ts.map +1 -1
- package/dist/lib/components/groups/tabs.js +31 -0
- package/dist/lib/components/groups/tabs.js.map +1 -0
- package/dist/lib/components/image.d.ts +36 -36
- package/dist/lib/components/image.d.ts.map +1 -1
- package/dist/lib/components/image.js +46 -0
- package/dist/lib/components/image.js.map +1 -0
- package/dist/lib/components/index.d.ts +5 -5
- package/dist/lib/components/index.js +6 -0
- package/dist/lib/components/index.js.map +1 -0
- package/dist/lib/core/index.d.ts +4 -4
- package/dist/lib/core/index.js +5 -0
- package/dist/lib/core/index.js.map +1 -0
- package/dist/lib/core/registry.d.ts +17 -17
- package/dist/lib/core/registry.js +30 -0
- package/dist/lib/core/registry.js.map +1 -0
- package/dist/lib/core/render.d.ts +9 -9
- package/dist/lib/core/render.d.ts.map +1 -1
- package/dist/lib/core/render.js +19 -0
- package/dist/lib/core/render.js.map +1 -0
- package/dist/lib/core/types.d.ts +87 -87
- package/dist/lib/core/types.d.ts.map +1 -1
- package/dist/lib/core/types.js +2 -0
- package/dist/lib/core/types.js.map +1 -0
- package/dist/lib/core/utils.d.ts +93 -93
- package/dist/lib/core/utils.d.ts.map +1 -1
- package/dist/lib/core/utils.js +193 -0
- package/dist/lib/core/utils.js.map +1 -0
- package/dist/lib/core/value-accessor.d.ts +17 -17
- package/dist/lib/core/value-accessor.js +52 -0
- package/dist/lib/core/value-accessor.js.map +1 -0
- package/dist/lib/index.d.ts +21 -27
- package/dist/lib/index.d.ts.map +1 -1
- package/dist/lib/index.js +29 -0
- package/dist/lib/index.js.map +1 -0
- package/dist/lib/mount.d.ts +45 -45
- package/dist/lib/mount.js +85 -0
- package/dist/lib/mount.js.map +1 -0
- package/dist/tweak-ui.css +133 -138
- package/dist/tweak-ui.css.map +1 -1
- package/dist/tweak-ui.min.css +1 -1
- package/dist/tweak-ui.min.css.map +1 -1
- package/dist/tweak-ui.module.js +2733 -2396
- package/dist/tweak-ui.module.js.map +1 -1
- package/dist/tweak-ui.umd.js +1 -4419
- package/dist/tweak-ui.umd.js.map +1 -1
- package/package.json +25 -42
- package/dist/index.html +0 -1063
- package/dist/lib/color-formats/array-format.spec.d.ts +0 -2
- package/dist/lib/color-formats/array-format.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/converter.spec.d.ts +0 -2
- package/dist/lib/color-formats/converter.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/css-string-format.spec.d.ts +0 -2
- package/dist/lib/color-formats/css-string-format.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/formatter.spec.d.ts +0 -2
- package/dist/lib/color-formats/formatter.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/hex-string-format.spec.d.ts +0 -2
- package/dist/lib/color-formats/hex-string-format.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/number-format.spec.d.ts +0 -2
- package/dist/lib/color-formats/number-format.spec.d.ts.map +0 -1
- package/dist/lib/color-formats/object-format.spec.d.ts +0 -2
- package/dist/lib/color-formats/object-format.spec.d.ts.map +0 -1
- package/dist/scss/_style.scss +0 -120
- package/dist/scss/_themes.scss +0 -23
- package/dist/scss/_utils.scss +0 -24
- package/dist/scss/_variables.scss +0 -30
- package/dist/scss/controls/_angle.scss +0 -64
- package/dist/scss/controls/_button.scss +0 -0
- package/dist/scss/controls/_checkbox.scss +0 -19
- package/dist/scss/controls/_color-picker.scss +0 -124
- package/dist/scss/controls/_color.scss +0 -14
- package/dist/scss/controls/_container.scss +0 -13
- package/dist/scss/controls/_group.scss +0 -69
- package/dist/scss/controls/_image.scss +0 -27
- package/dist/scss/controls/_number.scss +0 -38
- package/dist/scss/controls/_point.scss +0 -36
- package/dist/scss/controls/_position.scss +0 -9
- package/dist/scss/controls/_select.scss +0 -0
- package/dist/scss/controls/_spherical.scss +0 -87
- package/dist/scss/controls/_tabs.scss +0 -38
- package/dist/scss/controls/_text.scss +0 -0
- package/dist/scss/index.scss +0 -21
- package/dist/tweak-ui.umd.min.js +0 -17
- package/dist/tweak-ui.umd.min.js.map +0 -1
package/dist/tweak-ui.css
CHANGED
|
@@ -1,4 +1,27 @@
|
|
|
1
1
|
@charset "UTF-8";
|
|
2
|
+
:root {
|
|
3
|
+
--twui-gap: 0.0625rem;
|
|
4
|
+
--twui-size: 1.5rem;
|
|
5
|
+
--twui-label-width: 7rem;
|
|
6
|
+
--twui-label-pad-x: 0.25rem;
|
|
7
|
+
--twui-label-pad-y: 0.0rem;
|
|
8
|
+
--twui-input-height: var(--twui-size);
|
|
9
|
+
--twui-input-pad-x: 0.375rem;
|
|
10
|
+
--twui-input-pad-y: 0.0rem;
|
|
11
|
+
--twui-button-height: var(--twui-size);
|
|
12
|
+
--twui-button-pad-x: 0.5rem;
|
|
13
|
+
--twui-button-pad-y: 0.25rem;
|
|
14
|
+
--twui-color-primary: #344955;
|
|
15
|
+
--twui-color-primary-dark: #0b222c;
|
|
16
|
+
--twui-color-primary-light: #5f7481;
|
|
17
|
+
--twui-color-secondary: #4A6572;
|
|
18
|
+
--twui-color-secondary-dark: #203b47;
|
|
19
|
+
--twui-color-secondary-light: #7793a1;
|
|
20
|
+
--twui-color-on-primary: #E0E5E7;
|
|
21
|
+
--twui-color-on-secondary: #E0E5E7;
|
|
22
|
+
--twui-color-accent: #f9AA33;
|
|
23
|
+
}
|
|
24
|
+
|
|
2
25
|
.twui-dark {
|
|
3
26
|
--twui-color-primary: #263238;
|
|
4
27
|
--twui-color-primary-dark: #000a12;
|
|
@@ -24,15 +47,14 @@
|
|
|
24
47
|
}
|
|
25
48
|
|
|
26
49
|
.twui-root {
|
|
27
|
-
|
|
28
|
-
background-color: var(--twui-color-primary
|
|
29
|
-
color:
|
|
30
|
-
|
|
31
|
-
font-
|
|
32
|
-
font-size: 0.75rem;
|
|
50
|
+
text-shadow: 1px 1px 1px #000000;
|
|
51
|
+
background-color: var(--twui-color-primary);
|
|
52
|
+
color: var(--twui-color-on-primary);
|
|
53
|
+
font-family: var(--twui-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
|
|
54
|
+
font-size: var(--twui-font-size, 12px);
|
|
33
55
|
padding: 0;
|
|
34
56
|
margin: 0;
|
|
35
|
-
width: 20rem;
|
|
57
|
+
width: var(--twui-width, 20rem);
|
|
36
58
|
flex: auto 0 0;
|
|
37
59
|
overflow: auto;
|
|
38
60
|
overflow-x: hidden;
|
|
@@ -42,24 +64,21 @@
|
|
|
42
64
|
width: 0.5rem;
|
|
43
65
|
}
|
|
44
66
|
.twui-root::-webkit-scrollbar-track {
|
|
45
|
-
background-color:
|
|
46
|
-
background-color: var(--twui-color-primary, #344955);
|
|
67
|
+
background-color: var(--twui-color-primary);
|
|
47
68
|
}
|
|
48
69
|
.twui-root::-webkit-scrollbar-thumb {
|
|
49
70
|
border-width: 1px;
|
|
50
71
|
border-style: solid;
|
|
51
72
|
transition: background-color 0.2s ease-in-out;
|
|
52
|
-
background-color:
|
|
53
|
-
|
|
54
|
-
border-color: #0b222c;
|
|
55
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
73
|
+
background-color: var(--twui-color-primary);
|
|
74
|
+
border-color: var(--twui-color-primary-dark);
|
|
56
75
|
}
|
|
57
76
|
.twui-root::-webkit-scrollbar-thumb:hover {
|
|
58
|
-
background-color:
|
|
59
|
-
background-color: var(--twui-color-secondary, #4A6572);
|
|
77
|
+
background-color: var(--twui-color-secondary);
|
|
60
78
|
}
|
|
61
79
|
.twui-root label {
|
|
62
80
|
user-select: none;
|
|
81
|
+
font-weight: 500;
|
|
63
82
|
}
|
|
64
83
|
.twui-root select, .twui-root button, .twui-root a {
|
|
65
84
|
cursor: pointer;
|
|
@@ -67,10 +86,8 @@
|
|
|
67
86
|
.twui-root input:not([type=checkbox]),
|
|
68
87
|
.twui-root button,
|
|
69
88
|
.twui-root select {
|
|
70
|
-
background-color:
|
|
71
|
-
|
|
72
|
-
color: #E0E5E7;
|
|
73
|
-
color: var(--twui-color-on-secondary, #E0E5E7);
|
|
89
|
+
background-color: var(--twui-color-secondary);
|
|
90
|
+
color: var(--twui-color-on-secondary);
|
|
74
91
|
-webkit-appearance: none;
|
|
75
92
|
-moz-appearance: none;
|
|
76
93
|
appearance: none;
|
|
@@ -78,35 +95,34 @@
|
|
|
78
95
|
outline: none;
|
|
79
96
|
border: none;
|
|
80
97
|
box-sizing: border-box;
|
|
81
|
-
height:
|
|
82
|
-
line-height:
|
|
83
|
-
padding:
|
|
84
|
-
margin:
|
|
98
|
+
height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
99
|
+
line-height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
100
|
+
padding: var(--twui-input-pad-y) var(--twui-input-pad-x);
|
|
101
|
+
margin: var(--twui-gap);
|
|
85
102
|
}
|
|
86
103
|
.twui-root button {
|
|
87
|
-
line-height:
|
|
88
|
-
padding:
|
|
89
|
-
margin:
|
|
90
|
-
font-weight:
|
|
104
|
+
line-height: calc(var(--twui-size) - 2 * var(--twui-gap) - 2 * var(--twui-button-pad-y));
|
|
105
|
+
padding: var(--twui-button-pad-y) var(--twui-button-pad-x);
|
|
106
|
+
margin: var(--twui-gap);
|
|
107
|
+
font-weight: bold;
|
|
91
108
|
text-align: center;
|
|
92
109
|
white-space: nowrap;
|
|
93
110
|
}
|
|
111
|
+
.twui-root button:active {
|
|
112
|
+
transform: translateY(1px);
|
|
113
|
+
}
|
|
94
114
|
.twui-root button, .twui-root select, .twui-root input:not([type=checkbox]), .twui-root .twui-progress {
|
|
95
115
|
border-bottom: 1px solid;
|
|
96
|
-
border-color:
|
|
97
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
116
|
+
border-color: var(--twui-color-primary-dark);
|
|
98
117
|
transition: border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
|
|
99
118
|
}
|
|
100
119
|
.twui-root button:hover, .twui-root button.checked, .twui-root select:hover, .twui-root select.checked, .twui-root input:not([type=checkbox]):hover, .twui-root input:not([type=checkbox]).checked, .twui-root .twui-progress:hover, .twui-root .twui-progress.checked {
|
|
101
|
-
background-color:
|
|
102
|
-
|
|
103
|
-
border-color: #203b47;
|
|
104
|
-
border-color: var(--twui-color-secondary-dark, #203b47);
|
|
120
|
+
background-color: var(--twui-color-secondary-light);
|
|
121
|
+
border-color: var(--twui-color-secondary-dark);
|
|
105
122
|
}
|
|
106
123
|
.twui-root button:focus, .twui-root button.checked, .twui-root select:focus, .twui-root select.checked, .twui-root input:not([type=checkbox]):focus, .twui-root input:not([type=checkbox]).checked, .twui-root .twui-progress:focus, .twui-root .twui-progress.checked {
|
|
107
124
|
outline: none;
|
|
108
|
-
border-color:
|
|
109
|
-
border-color: var(--twui-color-accent, #f9AA33);
|
|
125
|
+
border-color: var(--twui-color-accent);
|
|
110
126
|
}
|
|
111
127
|
.twui-root button:disabled,
|
|
112
128
|
.twui-root button .disabled, .twui-root select:disabled,
|
|
@@ -121,12 +137,28 @@
|
|
|
121
137
|
cursor: not-allowed;
|
|
122
138
|
}
|
|
123
139
|
.twui-root select:focus, .twui-root input:not([type=checkbox]):focus {
|
|
124
|
-
color:
|
|
125
|
-
color: var(--twui-color-accent, #f9AA33);
|
|
140
|
+
color: var(--twui-color-accent);
|
|
126
141
|
}
|
|
127
142
|
.twui-root input[type=number] {
|
|
128
143
|
padding-right: 0;
|
|
129
144
|
}
|
|
145
|
+
.twui-root input[type=checkbox] {
|
|
146
|
+
margin: 0;
|
|
147
|
+
appearance: none;
|
|
148
|
+
width: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
149
|
+
height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
150
|
+
text-align: center;
|
|
151
|
+
cursor: pointer;
|
|
152
|
+
}
|
|
153
|
+
.twui-root input[type=checkbox]::before {
|
|
154
|
+
content: "✔";
|
|
155
|
+
opacity: 0.125;
|
|
156
|
+
font-weight: bold;
|
|
157
|
+
}
|
|
158
|
+
.twui-root input[type=checkbox]:checked::before {
|
|
159
|
+
content: "✔";
|
|
160
|
+
opacity: 1;
|
|
161
|
+
}
|
|
130
162
|
|
|
131
163
|
.twui-angle {
|
|
132
164
|
display: flex;
|
|
@@ -149,8 +181,8 @@
|
|
|
149
181
|
}
|
|
150
182
|
.twui-angle label {
|
|
151
183
|
text-align: right;
|
|
152
|
-
line-height:
|
|
153
|
-
padding: 0
|
|
184
|
+
line-height: var(--twui-input-height);
|
|
185
|
+
padding: 0 var(--twui-label-pad-x);
|
|
154
186
|
}
|
|
155
187
|
.twui-angle input[type=number] {
|
|
156
188
|
width: 3.5rem;
|
|
@@ -169,30 +201,26 @@
|
|
|
169
201
|
top: 1rem;
|
|
170
202
|
border: 1px solid;
|
|
171
203
|
border-radius: 50%;
|
|
172
|
-
border-color:
|
|
173
|
-
border-color: var(--twui-color-primary-light, #5f7481);
|
|
204
|
+
border-color: var(--twui-color-primary-light);
|
|
174
205
|
box-sizing: border-box;
|
|
175
|
-
background-image: conic-gradient(var(--twui-color-primary-light
|
|
206
|
+
background-image: conic-gradient(var(--twui-color-primary-light) var(--angle-percent), transparent 0);
|
|
176
207
|
transform: scaleX(-1) rotate(180deg);
|
|
177
208
|
}
|
|
178
209
|
.twui-angle .angle-knob {
|
|
179
210
|
border: 0px solid transparent;
|
|
180
211
|
border-radius: 100%;
|
|
181
|
-
background-color:
|
|
182
|
-
background-color: var(--twui-color-primary-light, #5f7481);
|
|
212
|
+
background-color: var(--twui-color-primary-light);
|
|
183
213
|
}
|
|
184
214
|
.twui-angle .angle-knob:hover {
|
|
185
|
-
background-color:
|
|
186
|
-
background-color: var(--twui-color-secondary-light, #7793a1);
|
|
215
|
+
background-color: var(--twui-color-secondary-light);
|
|
187
216
|
}
|
|
188
217
|
.twui-angle .angle-pane.is-dragging .angle-knob {
|
|
189
|
-
background-color:
|
|
190
|
-
background-color: var(--twui-color-accent, #f9AA33);
|
|
218
|
+
background-color: var(--twui-color-accent);
|
|
191
219
|
}
|
|
192
220
|
|
|
193
221
|
.twui-checkbox {
|
|
194
|
-
min-height:
|
|
195
|
-
line-height:
|
|
222
|
+
min-height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
223
|
+
line-height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
196
224
|
display: flex;
|
|
197
225
|
flex-direction: row;
|
|
198
226
|
align-items: center;
|
|
@@ -202,8 +230,7 @@
|
|
|
202
230
|
transition: background-color 0.2s ease-in-out;
|
|
203
231
|
}
|
|
204
232
|
.twui-checkbox:hover {
|
|
205
|
-
background-color:
|
|
206
|
-
background-color: var(--twui-color-secondary, #4A6572);
|
|
233
|
+
background-color: var(--twui-color-secondary);
|
|
207
234
|
}
|
|
208
235
|
.twui-checkbox input {
|
|
209
236
|
margin-right: 1ch;
|
|
@@ -218,7 +245,7 @@
|
|
|
218
245
|
.twui-color-picker .color-picker-panel {
|
|
219
246
|
flex: 1;
|
|
220
247
|
position: relative;
|
|
221
|
-
margin:
|
|
248
|
+
margin: var(--twui-gap);
|
|
222
249
|
}
|
|
223
250
|
.twui-color-picker .color-picker-inputs {
|
|
224
251
|
flex: none;
|
|
@@ -249,8 +276,7 @@
|
|
|
249
276
|
.twui-color-picker .color-picker-h:focus,
|
|
250
277
|
.twui-color-picker .color-picker-a:focus {
|
|
251
278
|
outline: none;
|
|
252
|
-
border-color:
|
|
253
|
-
border-color: var(--twui-color-accent, #f9AA33);
|
|
279
|
+
border-color: var(--twui-color-accent);
|
|
254
280
|
}
|
|
255
281
|
.twui-color-picker .color-picker-sv {
|
|
256
282
|
width: 100%;
|
|
@@ -260,8 +286,7 @@
|
|
|
260
286
|
cursor: crosshair;
|
|
261
287
|
z-index: 1;
|
|
262
288
|
border-bottom: 1px solid;
|
|
263
|
-
border-color:
|
|
264
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
289
|
+
border-color: var(--twui-color-primary-dark);
|
|
265
290
|
}
|
|
266
291
|
.twui-color-picker .color-picker-sv-bg {
|
|
267
292
|
position: absolute;
|
|
@@ -287,10 +312,9 @@
|
|
|
287
312
|
height: 1rem;
|
|
288
313
|
box-sizing: border-box;
|
|
289
314
|
cursor: ew-resize;
|
|
290
|
-
margin-top:
|
|
315
|
+
margin-top: calc(var(--twui-gap) * 2);
|
|
291
316
|
border-bottom: 1px solid;
|
|
292
|
-
border-color:
|
|
293
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
317
|
+
border-color: var(--twui-color-primary-dark);
|
|
294
318
|
}
|
|
295
319
|
.twui-color-picker .color-picker-h-cursor,
|
|
296
320
|
.twui-color-picker .color-picker-a-cursor {
|
|
@@ -317,8 +341,7 @@
|
|
|
317
341
|
.twui-color-picker .color-picker-sv,
|
|
318
342
|
.twui-color-picker .color-picker-h,
|
|
319
343
|
.twui-color-picker .color-picker-a {
|
|
320
|
-
border-color:
|
|
321
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
344
|
+
border-color: var(--twui-color-primary-dark);
|
|
322
345
|
}
|
|
323
346
|
|
|
324
347
|
.twui-color {
|
|
@@ -352,18 +375,17 @@
|
|
|
352
375
|
display: flex;
|
|
353
376
|
flex-flow: column nowrap;
|
|
354
377
|
align-items: stretch;
|
|
355
|
-
border-color:
|
|
356
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
378
|
+
border-color: var(--twui-color-primary-dark);
|
|
357
379
|
}
|
|
358
380
|
|
|
359
381
|
.twui-group-title {
|
|
360
382
|
margin: 0;
|
|
361
383
|
width: auto;
|
|
362
|
-
height:
|
|
363
|
-
line-height:
|
|
364
|
-
background-color:
|
|
365
|
-
|
|
366
|
-
|
|
384
|
+
height: var(--twui-size);
|
|
385
|
+
line-height: var(--twui-size);
|
|
386
|
+
background-color: var(--twui-color-primary-dark);
|
|
387
|
+
padding-left: calc(2 * var(--twui-gap));
|
|
388
|
+
font-weight: bold;
|
|
367
389
|
}
|
|
368
390
|
|
|
369
391
|
.twui-group-collapsible .twui-group-title {
|
|
@@ -372,42 +394,40 @@
|
|
|
372
394
|
}
|
|
373
395
|
|
|
374
396
|
.twui-group-collapsible > .twui-group-title::before {
|
|
375
|
-
content: "
|
|
397
|
+
content: "🗁";
|
|
376
398
|
display: inline-block;
|
|
377
|
-
width:
|
|
378
|
-
height:
|
|
399
|
+
width: var(--twui-size);
|
|
400
|
+
height: var(--twui-size);
|
|
379
401
|
text-align: center;
|
|
380
402
|
transition: transform 0.1s ease-in-out;
|
|
381
|
-
transform: rotateZ(90deg);
|
|
382
403
|
}
|
|
383
404
|
|
|
384
405
|
.twui-group-inset,
|
|
385
406
|
.twui-group-collapsible > .twui-group-collapsible {
|
|
386
407
|
border-left: 0.25rem solid;
|
|
387
|
-
border-left-color:
|
|
388
|
-
border-left-color: var(--twui-color-primary-light, #5f7481);
|
|
408
|
+
border-left-color: var(--twui-color-primary-light);
|
|
389
409
|
}
|
|
390
410
|
|
|
391
411
|
.twui-group-collapsed > .twui-group-title::before {
|
|
392
|
-
|
|
412
|
+
content: "🗀";
|
|
393
413
|
}
|
|
394
414
|
|
|
395
415
|
.twui-group-control {
|
|
396
416
|
display: flex;
|
|
397
417
|
flex-flow: row nowrap;
|
|
398
418
|
align-items: stretch;
|
|
399
|
-
min-height:
|
|
419
|
+
min-height: var(--twui-size);
|
|
400
420
|
box-sizing: border-box;
|
|
401
421
|
}
|
|
402
422
|
.twui-group-control > label:first-child {
|
|
403
423
|
flex: none;
|
|
404
424
|
box-sizing: border-box;
|
|
405
|
-
width:
|
|
406
|
-
min-width:
|
|
407
|
-
min-height:
|
|
408
|
-
line-height:
|
|
409
|
-
padding:
|
|
410
|
-
margin:
|
|
425
|
+
width: calc(var(--twui-label-width) - 2 * var(--twui-label-pad-x));
|
|
426
|
+
min-width: calc(var(--twui-label-width) - 2 * var(--twui-label-pad-x));
|
|
427
|
+
min-height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
428
|
+
line-height: calc(var(--twui-size) - 2 * var(--twui-gap));
|
|
429
|
+
padding: var(--twui-label-pad-y) var(--twui-label-pad-x);
|
|
430
|
+
margin: var(--twui-gap);
|
|
411
431
|
overflow: hidden;
|
|
412
432
|
}
|
|
413
433
|
.twui-group-control > section {
|
|
@@ -459,22 +479,19 @@
|
|
|
459
479
|
.twui-slider .twui-progress {
|
|
460
480
|
flex: 1;
|
|
461
481
|
display: flex;
|
|
462
|
-
margin:
|
|
482
|
+
margin: var(--twui-gap);
|
|
463
483
|
cursor: ew-resize;
|
|
464
484
|
transition: background-color 0.2s ease-in-out;
|
|
465
|
-
background-color:
|
|
466
|
-
background-color: var(--twui-color-secondary, #4A6572);
|
|
485
|
+
background-color: var(--twui-color-secondary);
|
|
467
486
|
}
|
|
468
487
|
.twui-slider .twui-progress:hover {
|
|
469
|
-
background-color:
|
|
470
|
-
background-color: var(--twui-color-secondary-dark, #203b47);
|
|
488
|
+
background-color: var(--twui-color-secondary-dark);
|
|
471
489
|
}
|
|
472
490
|
.twui-slider .twui-progress.disabled {
|
|
473
491
|
cursor: not-allowed;
|
|
474
492
|
}
|
|
475
493
|
.twui-slider .twui-progress-bar {
|
|
476
|
-
background-color:
|
|
477
|
-
background-color: var(--twui-color-secondary-light, #7793a1);
|
|
494
|
+
background-color: var(--twui-color-secondary-light);
|
|
478
495
|
}
|
|
479
496
|
.twui-slider input[type=number] {
|
|
480
497
|
flex: none;
|
|
@@ -482,12 +499,9 @@
|
|
|
482
499
|
}
|
|
483
500
|
|
|
484
501
|
.twui-point {
|
|
485
|
-
background-color:
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
489
|
-
background-image: linear-gradient(#5f7481 1px, transparent 1px), linear-gradient(90deg, #5f7481 1px, transparent 1px);
|
|
490
|
-
background-image: linear-gradient(var(--twui-color-primary-light, #5f7481) 1px, transparent 1px), linear-gradient(90deg, var(--twui-color-primary-light, #5f7481) 1px, transparent 1px);
|
|
502
|
+
background-color: var(--twui-color-secondary);
|
|
503
|
+
border-color: var(--twui-color-primary-dark);
|
|
504
|
+
background-image: linear-gradient(var(--twui-color-primary-light) 1px, transparent 1px), linear-gradient(90deg, var(--twui-color-primary-light) 1px, transparent 1px);
|
|
491
505
|
background-size: 10% 10%, 10% 10%;
|
|
492
506
|
transition: border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
|
|
493
507
|
position: relative;
|
|
@@ -500,18 +514,15 @@
|
|
|
500
514
|
}
|
|
501
515
|
.twui-point .point-x-axis,
|
|
502
516
|
.twui-point .point-y-axis {
|
|
503
|
-
background-color:
|
|
504
|
-
background-color: var(--twui-color-primary-dark, #0b222c);
|
|
517
|
+
background-color: var(--twui-color-primary-dark);
|
|
505
518
|
}
|
|
506
519
|
.twui-point:focus {
|
|
507
|
-
border-color:
|
|
508
|
-
border-color: var(--twui-color-accent, #f9AA33);
|
|
520
|
+
border-color: var(--twui-color-accent);
|
|
509
521
|
outline: none;
|
|
510
522
|
}
|
|
511
523
|
.twui-point:focus .point-x-axis,
|
|
512
524
|
.twui-point:focus .point-y-axis {
|
|
513
|
-
background-color:
|
|
514
|
-
background-color: var(--twui-color-accent, #f9AA33);
|
|
525
|
+
background-color: var(--twui-color-accent);
|
|
515
526
|
}
|
|
516
527
|
|
|
517
528
|
.twui-spherical {
|
|
@@ -535,8 +546,8 @@
|
|
|
535
546
|
}
|
|
536
547
|
.twui-spherical label {
|
|
537
548
|
text-align: right;
|
|
538
|
-
line-height:
|
|
539
|
-
padding: 0
|
|
549
|
+
line-height: var(--twui-input-height);
|
|
550
|
+
padding: 0 var(--twui-label-pad-x);
|
|
540
551
|
}
|
|
541
552
|
.twui-spherical input[type=number] {
|
|
542
553
|
width: 3.5rem;
|
|
@@ -555,8 +566,7 @@
|
|
|
555
566
|
top: 1rem;
|
|
556
567
|
border: 1px solid;
|
|
557
568
|
border-radius: 50%;
|
|
558
|
-
border-color:
|
|
559
|
-
border-color: var(--twui-color-primary-light, #5f7481);
|
|
569
|
+
border-color: var(--twui-color-primary-light);
|
|
560
570
|
box-sizing: border-box;
|
|
561
571
|
}
|
|
562
572
|
.twui-spherical .pane::after {
|
|
@@ -566,46 +576,38 @@
|
|
|
566
576
|
left: 50%;
|
|
567
577
|
width: calc(50% - 1rem);
|
|
568
578
|
height: 1px;
|
|
569
|
-
background-color:
|
|
570
|
-
background-color: var(--twui-color-primary-light, #5f7481);
|
|
579
|
+
background-color: var(--twui-color-primary-light);
|
|
571
580
|
transform-origin: left center;
|
|
572
581
|
transform: rotate(var(--spherical-phi));
|
|
573
582
|
}
|
|
574
583
|
.twui-spherical .phi-knob {
|
|
575
584
|
border: 0px solid transparent;
|
|
576
585
|
border-radius: 100%;
|
|
577
|
-
background-color:
|
|
578
|
-
background-color: var(--twui-color-primary-light, #5f7481);
|
|
586
|
+
background-color: var(--twui-color-primary-light);
|
|
579
587
|
}
|
|
580
588
|
.twui-spherical .phi-knob:hover {
|
|
581
|
-
background-color:
|
|
582
|
-
background-color: var(--twui-color-secondary-light, #7793a1);
|
|
589
|
+
background-color: var(--twui-color-secondary-light);
|
|
583
590
|
}
|
|
584
591
|
.twui-spherical .phi-pane.is-dragging .phi-knob {
|
|
585
|
-
background-color:
|
|
586
|
-
background-color: var(--twui-color-accent, #f9AA33);
|
|
592
|
+
background-color: var(--twui-color-accent);
|
|
587
593
|
}
|
|
588
594
|
.twui-spherical .theta-knob {
|
|
589
595
|
border: 1px solid transparent;
|
|
590
596
|
border-radius: 100%;
|
|
591
|
-
border-color:
|
|
592
|
-
border-color: var(--twui-color-primary-light, #5f7481);
|
|
597
|
+
border-color: var(--twui-color-primary-light);
|
|
593
598
|
}
|
|
594
599
|
.twui-spherical .theta-knob:hover {
|
|
595
|
-
border-color:
|
|
596
|
-
border-color: var(--twui-color-secondary-light, #7793a1);
|
|
600
|
+
border-color: var(--twui-color-secondary-light);
|
|
597
601
|
}
|
|
598
602
|
.twui-spherical .theta-pane.is-dragging .theta-knob {
|
|
599
|
-
border-color:
|
|
600
|
-
border-color: var(--twui-color-accent, #f9AA33);
|
|
603
|
+
border-color: var(--twui-color-accent);
|
|
601
604
|
}
|
|
602
605
|
|
|
603
606
|
.twui-tabs {
|
|
604
607
|
display: flex;
|
|
605
608
|
flex-flow: column nowrap;
|
|
606
609
|
align-items: stretch;
|
|
607
|
-
border-color:
|
|
608
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
610
|
+
border-color: var(--twui-color-primary-dark);
|
|
609
611
|
}
|
|
610
612
|
|
|
611
613
|
.twui-tabs-list {
|
|
@@ -619,26 +621,19 @@
|
|
|
619
621
|
border: 0;
|
|
620
622
|
border-top: 1px solid;
|
|
621
623
|
margin: 0;
|
|
622
|
-
height:
|
|
623
|
-
line-height:
|
|
624
|
-
background-color:
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
border-color: var(--twui-color-primary, #344955);
|
|
628
|
-
color: #E0E5E7;
|
|
629
|
-
color: var(--twui-color-on-primary, #E0E5E7);
|
|
624
|
+
height: var(--twui-size);
|
|
625
|
+
line-height: calc(var(--twui-size) - 2 * var(--twui-button-pad-y));
|
|
626
|
+
background-color: var(--twui-color-primary-dark);
|
|
627
|
+
border-color: var(--twui-color-primary);
|
|
628
|
+
color: var(--twui-color-on-primary);
|
|
630
629
|
}
|
|
631
630
|
.twui-tabs-list > button:hover {
|
|
632
|
-
background-color:
|
|
633
|
-
|
|
634
|
-
border-color: #0b222c;
|
|
635
|
-
border-color: var(--twui-color-primary-dark, #0b222c);
|
|
631
|
+
background-color: var(--twui-color-primary);
|
|
632
|
+
border-color: var(--twui-color-primary-dark);
|
|
636
633
|
}
|
|
637
634
|
.twui-tabs-list > button.is-active {
|
|
638
|
-
background-color:
|
|
639
|
-
|
|
640
|
-
border-color: #f9AA33;
|
|
641
|
-
border-color: var(--twui-color-accent, #f9AA33);
|
|
635
|
+
background-color: var(--twui-color-primary);
|
|
636
|
+
border-color: var(--twui-color-accent);
|
|
642
637
|
}
|
|
643
638
|
|
|
644
639
|
.twui-position {
|
package/dist/tweak-ui.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../src/style/
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../src/style/_style.scss","../src/style/controls/_angle.scss","../src/style/controls/_checkbox.scss","../src/style/controls/_color-picker.scss","../src/style/controls/_color.scss","../src/style/controls/_container.scss","../src/style/controls/_group.scss","../src/style/controls/_image.scss","../src/style/controls/_number.scss","../src/style/controls/_point.scss","../src/style/controls/_spherical.scss","../src/style/controls/_tabs.scss","../src/style/controls/_position.scss"],"names":[],"mappings":";AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAOF;EACE;EACA;;AAGF;EACE;;AAGF;AAAA;AAAA;EAGE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEF;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EAEE;EACA;;AAGF;EAEE;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;;AAIJ;EACE;EACA;;AAIA;EACE;;AAIJ;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;;;AC1LJ;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AACA;EACE;;AAKN;EACE;EACA;EACA;;AAEF;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;;;AC7DJ;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;ACjBJ;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAGF;EACE;EACA;EACA;;AAOF;AAAA;AAAA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,kBACkB;EAIlB;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;EAGE;;;AC1HJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;;ACXJ;EACE;EACA;EACA;EACA;;;AAGF;EACE;;AACA;EACE;;;ACRJ;EACE;EACA;EACA;EAEA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGF;EACE;EACA;EACA;EACA;;;ACpEJ;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;;AACA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;ACtBJ;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;EACA;EACA;EACA;EACA;EAEA;;AACA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;;AClCJ;EACE;EACA;EACA,kBACE;EAEF;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAEA;AAAA;EAEE;;AAGF;EAKE;EACA;;AALA;AAAA;EAEE;;;AC3BN;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AACA;EACE;;AAKN;EACE;EACA;EACA;;AAEF;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;;;ACnFJ;EACE;EACA;EACA;EAEA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;ACrCJ;EACE;EACA;EACA;;AAEA;EACE","file":"tweak-ui.css"}
|
package/dist/tweak-ui.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.twui-dark{--twui-color-primary: #263238;--twui-color-primary-dark: #000a12;--twui-color-primary-light: #4f5b62;--twui-color-secondary: #37474f;--twui-color-secondary-dark: #102027;--twui-color-secondary-light: #62727b;--twui-color-on-primary: #fff;--twui-color-on-secondary: #fff;--twui-color-accent: #f9AA33}.twui-light{--twui-color-primary: #fafafa;--twui-color-primary-dark: #c7c7c7;--twui-color-primary-light: #ffffff;--twui-color-secondary: #cfd8dc;--twui-color-secondary-dark: #9ea7aa;--twui-color-secondary-light: #ffffff;--twui-color-on-primary: #000000;--twui-color-on-secondary: #000000;--twui-color-accent: #2196f3}.twui-root{background-color:#344955;background-color:var(--twui-color-primary, #344955);color:#e0e5e7;color:var(--twui-color-on-primary, #E0E5E7);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:.75rem;padding:0;margin:0;width:20rem;flex:auto 0 0;overflow:auto;overflow-x:hidden;box-sizing:border-box}.twui-root::-webkit-scrollbar{width:.5rem}.twui-root::-webkit-scrollbar-track{background-color:#344955;background-color:var(--twui-color-primary, #344955)}.twui-root::-webkit-scrollbar-thumb{border-width:1px;border-style:solid;transition:background-color .2s ease-in-out;background-color:#344955;background-color:var(--twui-color-primary, #344955);border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-root::-webkit-scrollbar-thumb:hover{background-color:#4a6572;background-color:var(--twui-color-secondary, #4A6572)}.twui-root label{user-select:none}.twui-root select,.twui-root button,.twui-root a{cursor:pointer}.twui-root input:not([type=checkbox]),.twui-root button,.twui-root select{background-color:#4a6572;background-color:var(--twui-color-secondary, #4A6572);color:#e0e5e7;color:var(--twui-color-on-secondary, #E0E5E7);-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;outline:none;border:none;box-sizing:border-box;height:1.25rem;line-height:1.25rem;padding:0rem .25rem;margin:.125rem}.twui-root button{line-height:.75rem;padding:.25rem .5rem;margin:.125rem;font-weight:400;text-align:center;white-space:nowrap}.twui-root button,.twui-root select,.twui-root input:not([type=checkbox]),.twui-root .twui-progress{border-bottom:1px solid;border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c);transition:border-color .2s ease-in-out,background-color .2s ease-in-out}.twui-root button:hover,.twui-root button.checked,.twui-root select:hover,.twui-root select.checked,.twui-root input:not([type=checkbox]):hover,.twui-root input:not([type=checkbox]).checked,.twui-root .twui-progress:hover,.twui-root .twui-progress.checked{background-color:#7793a1;background-color:var(--twui-color-secondary-light, #7793a1);border-color:#203b47;border-color:var(--twui-color-secondary-dark, #203b47)}.twui-root button:focus,.twui-root button.checked,.twui-root select:focus,.twui-root select.checked,.twui-root input:not([type=checkbox]):focus,.twui-root input:not([type=checkbox]).checked,.twui-root .twui-progress:focus,.twui-root .twui-progress.checked{outline:none;border-color:#f9aa33;border-color:var(--twui-color-accent, #f9AA33)}.twui-root button:disabled,.twui-root button .disabled,.twui-root select:disabled,.twui-root select .disabled,.twui-root input:not([type=checkbox]):disabled,.twui-root input:not([type=checkbox]) .disabled,.twui-root .twui-progress:disabled,.twui-root .twui-progress .disabled{opacity:.5;cursor:not-allowed}.twui-root .disabled{opacity:.5;cursor:not-allowed}.twui-root select:focus,.twui-root input:not([type=checkbox]):focus{color:#f9aa33;color:var(--twui-color-accent, #f9AA33)}.twui-root input[type=number]{padding-right:0}.twui-angle{display:flex;flex-direction:row;align-items:flex-start}.twui-angle .left-container{flex:1}.twui-angle .right-container{flex:none;display:grid;grid-template-columns:max-content max-content}.twui-angle .right-container .twui-checkbox{grid-column:span 2}.twui-angle .right-container .twui-checkbox input{margin-left:0}.twui-angle label{text-align:right;line-height:1.5rem;padding:0 .25rem}.twui-angle input[type=number]{width:3.5rem}.twui-angle .pane{position:relative;width:100%;padding-top:100%}.twui-angle .pane::before{position:absolute;content:"";width:calc(100% - 2rem);height:calc(100% - 2rem);left:1rem;top:1rem;border:1px solid;border-radius:50%;border-color:#5f7481;border-color:var(--twui-color-primary-light, #5f7481);box-sizing:border-box;background-image:conic-gradient(var(--twui-color-primary-light, #5f7481) var(--angle-percent), transparent 0);transform:scaleX(-1) rotate(180deg)}.twui-angle .angle-knob{border:0px solid transparent;border-radius:100%;background-color:#5f7481;background-color:var(--twui-color-primary-light, #5f7481)}.twui-angle .angle-knob:hover{background-color:#7793a1;background-color:var(--twui-color-secondary-light, #7793a1)}.twui-angle .angle-pane.is-dragging .angle-knob{background-color:#f9aa33;background-color:var(--twui-color-accent, #f9AA33)}.twui-checkbox{min-height:1.25rem;line-height:1.25rem;display:flex;flex-direction:row;align-items:center;margin:0;padding:0;cursor:pointer;transition:background-color .2s ease-in-out}.twui-checkbox:hover{background-color:#4a6572;background-color:var(--twui-color-secondary, #4A6572)}.twui-checkbox input{margin-right:1ch;margin-left:1ch}.twui-color-picker{flex:auto 1 1;display:flex;flex-direction:row}.twui-color-picker .color-picker-panel{flex:1;position:relative;margin:.125rem}.twui-color-picker .color-picker-inputs{flex:none;display:flex;flex-direction:column}.twui-color-picker .color-picker-inputs .input-r{border-color:red}.twui-color-picker .color-picker-inputs .input-g{border-color:lime}.twui-color-picker .color-picker-inputs .input-b{border-color:blue}.twui-color-picker .color-picker-inputs .input-a{border-image:linear-gradient(to right, #fff, transparent)}.twui-color-picker .color-picker-inputs .input-hex{border-color:#000}.twui-color-picker .color-picker-inputs input{display:block;width:4rem;flex:none}.twui-color-picker .color-picker-sv:focus,.twui-color-picker .color-picker-h:focus,.twui-color-picker .color-picker-a:focus{outline:none;border-color:#f9aa33;border-color:var(--twui-color-accent, #f9AA33)}.twui-color-picker .color-picker-sv{width:100%;padding-top:100%;position:relative;box-sizing:border-box;cursor:crosshair;z-index:1;border-bottom:1px solid;border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-color-picker .color-picker-sv-bg{position:absolute;top:0;left:0;right:0;bottom:0}.twui-color-picker .color-picker-sv-cursor{box-sizing:border-box;position:absolute;width:10px;height:10px;margin-top:-5px;margin-left:-5px;border:1px solid #fff;border-radius:5px;box-shadow:0px 0px 2px 1px rgba(0,0,0,.75)}.twui-color-picker .color-picker-h,.twui-color-picker .color-picker-a{position:relative;height:1rem;box-sizing:border-box;cursor:ew-resize;margin-top:.25rem;border-bottom:1px solid;border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-color-picker .color-picker-h-cursor,.twui-color-picker .color-picker-a-cursor{position:absolute;width:4px;height:calc(1rem - 2px);margin-left:-3px;border:1px solid #fff;border-radius:2px;box-shadow:0px 0px 2px 1px rgba(0,0,0,.75)}.twui-color-picker .color-picker-a{background-image:linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)),linear-gradient(to right, grey 50%, white 50%),linear-gradient(to bottom, grey 50%, white 50%);background-blend-mode:normal,difference,normal;background-size:1rem 1rem}.twui-color-picker .color-picker-a-bg{position:absolute;top:0;left:0;right:0;bottom:0}.twui-color-picker .color-picker-sv,.twui-color-picker .color-picker-h,.twui-color-picker .color-picker-a{border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-color{flex:auto 1 1;display:flex;flex-direction:column;align-items:stretch}.twui-color button{text-shadow:0 0 10px #000;color:#fff;font-weight:bold;text-transform:uppercase}.twui-container{display:flex;display:flex;flex-flow:column nowrap;align-items:stretch}.twui-container-horizontal{flex-direction:row}.twui-container-horizontal>*{flex:1}.twui-group{display:flex;flex-flow:column nowrap;align-items:stretch;border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-group-title{margin:0;width:auto;height:1.5rem;line-height:1.5rem;background-color:#0b222c;background-color:var(--twui-color-primary-dark, #0b222c);padding-left:.25rem}.twui-group-collapsible .twui-group-title{padding-left:0;cursor:pointer}.twui-group-collapsible>.twui-group-title::before{content:"▶";display:inline-block;width:1.5rem;height:1.5rem;text-align:center;transition:transform .1s ease-in-out;transform:rotateZ(90deg)}.twui-group-inset,.twui-group-collapsible>.twui-group-collapsible{border-left:.25rem solid;border-left-color:#5f7481;border-left-color:var(--twui-color-primary-light, #5f7481)}.twui-group-collapsed>.twui-group-title::before{transform:rotateZ(0deg)}.twui-group-control{display:flex;flex-flow:row nowrap;align-items:stretch;min-height:1.5rem;box-sizing:border-box}.twui-group-control>label:first-child{flex:none;box-sizing:border-box;width:6.5rem;min-width:6.5rem;min-height:1.25rem;line-height:1.25rem;padding:0rem .25rem;margin:.125rem;overflow:hidden}.twui-group-control>section{flex:1;display:flex;flex-flow:column nowrap;align-items:stretch}.twui-image{max-width:100%;display:block}.twui-image img{width:100%}.twui-image-aspect{position:relative}.twui-image-aspect::before{content:"";display:block;width:100%;padding-top:100%;padding-top:var(--twui-aspect)}.twui-image-aspect img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:fill;object-fit:var(--twui-fit)}.twui-number,.twui-slider{display:flex;flex-flow:row nowrap;align-items:stretch}.twui-number input{flex:1}.twui-slider .twui-progress{flex:1;display:flex;margin:.125rem;cursor:ew-resize;transition:background-color .2s ease-in-out;background-color:#4a6572;background-color:var(--twui-color-secondary, #4A6572)}.twui-slider .twui-progress:hover{background-color:#203b47;background-color:var(--twui-color-secondary-dark, #203b47)}.twui-slider .twui-progress.disabled{cursor:not-allowed}.twui-slider .twui-progress-bar{background-color:#7793a1;background-color:var(--twui-color-secondary-light, #7793a1)}.twui-slider input[type=number]{flex:none;width:3.5rem}.twui-point{background-color:#4a6572;background-color:var(--twui-color-secondary, #4A6572);border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c);background-image:linear-gradient(#5f7481 1px, transparent 1px),linear-gradient(90deg, #5f7481 1px, transparent 1px);background-image:linear-gradient(var(--twui-color-primary-light, #5f7481) 1px, transparent 1px),linear-gradient(90deg, var(--twui-color-primary-light, #5f7481) 1px, transparent 1px);background-size:10% 10%,10% 10%;transition:border-color .2s ease-in-out,background-color .2s ease-in-out;position:relative;width:100%;padding-top:100%;box-sizing:border-box;cursor:crosshair;z-index:1;overflow:visible}.twui-point .point-x-axis,.twui-point .point-y-axis{background-color:#0b222c;background-color:var(--twui-color-primary-dark, #0b222c)}.twui-point:focus{border-color:#f9aa33;border-color:var(--twui-color-accent, #f9AA33);outline:none}.twui-point:focus .point-x-axis,.twui-point:focus .point-y-axis{background-color:#f9aa33;background-color:var(--twui-color-accent, #f9AA33)}.twui-spherical{display:flex;flex-direction:row;align-items:flex-start}.twui-spherical .left-container{flex:1}.twui-spherical .right-container{flex:none;display:grid;grid-template-columns:max-content max-content}.twui-spherical .right-container .twui-checkbox{grid-column:span 2}.twui-spherical .right-container .twui-checkbox input{margin-left:0}.twui-spherical label{text-align:right;line-height:1.5rem;padding:0 .25rem}.twui-spherical input[type=number]{width:3.5rem}.twui-spherical .pane{position:relative;width:100%;padding-top:100%}.twui-spherical .pane::before{position:absolute;content:"";width:calc(100% - 2rem);height:calc(100% - 2rem);left:1rem;top:1rem;border:1px solid;border-radius:50%;border-color:#5f7481;border-color:var(--twui-color-primary-light, #5f7481);box-sizing:border-box}.twui-spherical .pane::after{position:absolute;content:"";top:50%;left:50%;width:calc(50% - 1rem);height:1px;background-color:#5f7481;background-color:var(--twui-color-primary-light, #5f7481);transform-origin:left center;transform:rotate(var(--spherical-phi))}.twui-spherical .phi-knob{border:0px solid transparent;border-radius:100%;background-color:#5f7481;background-color:var(--twui-color-primary-light, #5f7481)}.twui-spherical .phi-knob:hover{background-color:#7793a1;background-color:var(--twui-color-secondary-light, #7793a1)}.twui-spherical .phi-pane.is-dragging .phi-knob{background-color:#f9aa33;background-color:var(--twui-color-accent, #f9AA33)}.twui-spherical .theta-knob{border:1px solid transparent;border-radius:100%;border-color:#5f7481;border-color:var(--twui-color-primary-light, #5f7481)}.twui-spherical .theta-knob:hover{border-color:#7793a1;border-color:var(--twui-color-secondary-light, #7793a1)}.twui-spherical .theta-pane.is-dragging .theta-knob{border-color:#f9aa33;border-color:var(--twui-color-accent, #f9AA33)}.twui-tabs{display:flex;flex-flow:column nowrap;align-items:stretch;border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-tabs-list{display:flex;flex-flow:row wrap;align-items:stretch}.twui-tabs-list>button{flex:auto 1 11;border:0;border-top:1px solid;margin:0;height:1.5rem;line-height:1rem;background-color:#0b222c;background-color:var(--twui-color-primary-dark, #0b222c);border-color:#344955;border-color:var(--twui-color-primary, #344955);color:#e0e5e7;color:var(--twui-color-on-primary, #E0E5E7)}.twui-tabs-list>button:hover{background-color:#344955;background-color:var(--twui-color-primary, #344955);border-color:#0b222c;border-color:var(--twui-color-primary-dark, #0b222c)}.twui-tabs-list>button.is-active{background-color:#344955;background-color:var(--twui-color-primary, #344955);border-color:#f9aa33;border-color:var(--twui-color-accent, #f9AA33)}.twui-position{display:flex;flex-flow:row wrap;align-items:stretch}.twui-position>*{flex:auto 1 1}/*# sourceMappingURL=tweak-ui.min.css.map */
|
|
1
|
+
:root{--twui-gap: 0.0625rem;--twui-size: 1.5rem;--twui-label-width: 7rem;--twui-label-pad-x: 0.25rem;--twui-label-pad-y: 0.0rem;--twui-input-height: var(--twui-size);--twui-input-pad-x: 0.375rem;--twui-input-pad-y: 0.0rem;--twui-button-height: var(--twui-size);--twui-button-pad-x: 0.5rem;--twui-button-pad-y: 0.25rem;--twui-color-primary: #344955;--twui-color-primary-dark: #0b222c;--twui-color-primary-light: #5f7481;--twui-color-secondary: #4A6572;--twui-color-secondary-dark: #203b47;--twui-color-secondary-light: #7793a1;--twui-color-on-primary: #E0E5E7;--twui-color-on-secondary: #E0E5E7;--twui-color-accent: #f9AA33}.twui-dark{--twui-color-primary: #263238;--twui-color-primary-dark: #000a12;--twui-color-primary-light: #4f5b62;--twui-color-secondary: #37474f;--twui-color-secondary-dark: #102027;--twui-color-secondary-light: #62727b;--twui-color-on-primary: #fff;--twui-color-on-secondary: #fff;--twui-color-accent: #f9AA33}.twui-light{--twui-color-primary: #fafafa;--twui-color-primary-dark: #c7c7c7;--twui-color-primary-light: #ffffff;--twui-color-secondary: #cfd8dc;--twui-color-secondary-dark: #9ea7aa;--twui-color-secondary-light: #ffffff;--twui-color-on-primary: #000000;--twui-color-on-secondary: #000000;--twui-color-accent: #2196f3}.twui-root{text-shadow:1px 1px 1px #000;background-color:var(--twui-color-primary);color:var(--twui-color-on-primary);font-family:var(--twui-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--twui-font-size, 12px);padding:0;margin:0;width:var(--twui-width, 20rem);flex:auto 0 0;overflow:auto;overflow-x:hidden;box-sizing:border-box}.twui-root::-webkit-scrollbar{width:.5rem}.twui-root::-webkit-scrollbar-track{background-color:var(--twui-color-primary)}.twui-root::-webkit-scrollbar-thumb{border-width:1px;border-style:solid;transition:background-color .2s ease-in-out;background-color:var(--twui-color-primary);border-color:var(--twui-color-primary-dark)}.twui-root::-webkit-scrollbar-thumb:hover{background-color:var(--twui-color-secondary)}.twui-root label{user-select:none;font-weight:500}.twui-root select,.twui-root button,.twui-root a{cursor:pointer}.twui-root input:not([type=checkbox]),.twui-root button,.twui-root select{background-color:var(--twui-color-secondary);color:var(--twui-color-on-secondary);-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;outline:none;border:none;box-sizing:border-box;height:calc(var(--twui-size) - 2*var(--twui-gap));line-height:calc(var(--twui-size) - 2*var(--twui-gap));padding:var(--twui-input-pad-y) var(--twui-input-pad-x);margin:var(--twui-gap)}.twui-root button{line-height:calc(var(--twui-size) - 2*var(--twui-gap) - 2*var(--twui-button-pad-y));padding:var(--twui-button-pad-y) var(--twui-button-pad-x);margin:var(--twui-gap);font-weight:bold;text-align:center;white-space:nowrap}.twui-root button:active{transform:translateY(1px)}.twui-root button,.twui-root select,.twui-root input:not([type=checkbox]),.twui-root .twui-progress{border-bottom:1px solid;border-color:var(--twui-color-primary-dark);transition:border-color .2s ease-in-out,background-color .2s ease-in-out}.twui-root button:hover,.twui-root button.checked,.twui-root select:hover,.twui-root select.checked,.twui-root input:not([type=checkbox]):hover,.twui-root input:not([type=checkbox]).checked,.twui-root .twui-progress:hover,.twui-root .twui-progress.checked{background-color:var(--twui-color-secondary-light);border-color:var(--twui-color-secondary-dark)}.twui-root button:focus,.twui-root button.checked,.twui-root select:focus,.twui-root select.checked,.twui-root input:not([type=checkbox]):focus,.twui-root input:not([type=checkbox]).checked,.twui-root .twui-progress:focus,.twui-root .twui-progress.checked{outline:none;border-color:var(--twui-color-accent)}.twui-root button:disabled,.twui-root button .disabled,.twui-root select:disabled,.twui-root select .disabled,.twui-root input:not([type=checkbox]):disabled,.twui-root input:not([type=checkbox]) .disabled,.twui-root .twui-progress:disabled,.twui-root .twui-progress .disabled{opacity:.5;cursor:not-allowed}.twui-root .disabled{opacity:.5;cursor:not-allowed}.twui-root select:focus,.twui-root input:not([type=checkbox]):focus{color:var(--twui-color-accent)}.twui-root input[type=number]{padding-right:0}.twui-root input[type=checkbox]{margin:0;appearance:none;width:calc(var(--twui-size) - 2*var(--twui-gap));height:calc(var(--twui-size) - 2*var(--twui-gap));text-align:center;cursor:pointer}.twui-root input[type=checkbox]::before{content:"✔";opacity:.125;font-weight:bold}.twui-root input[type=checkbox]:checked::before{content:"✔";opacity:1}.twui-angle{display:flex;flex-direction:row;align-items:flex-start}.twui-angle .left-container{flex:1}.twui-angle .right-container{flex:none;display:grid;grid-template-columns:max-content max-content}.twui-angle .right-container .twui-checkbox{grid-column:span 2}.twui-angle .right-container .twui-checkbox input{margin-left:0}.twui-angle label{text-align:right;line-height:var(--twui-input-height);padding:0 var(--twui-label-pad-x)}.twui-angle input[type=number]{width:3.5rem}.twui-angle .pane{position:relative;width:100%;padding-top:100%}.twui-angle .pane::before{position:absolute;content:"";width:calc(100% - 2rem);height:calc(100% - 2rem);left:1rem;top:1rem;border:1px solid;border-radius:50%;border-color:var(--twui-color-primary-light);box-sizing:border-box;background-image:conic-gradient(var(--twui-color-primary-light) var(--angle-percent), transparent 0);transform:scaleX(-1) rotate(180deg)}.twui-angle .angle-knob{border:0px solid rgba(0,0,0,0);border-radius:100%;background-color:var(--twui-color-primary-light)}.twui-angle .angle-knob:hover{background-color:var(--twui-color-secondary-light)}.twui-angle .angle-pane.is-dragging .angle-knob{background-color:var(--twui-color-accent)}.twui-checkbox{min-height:calc(var(--twui-size) - 2*var(--twui-gap));line-height:calc(var(--twui-size) - 2*var(--twui-gap));display:flex;flex-direction:row;align-items:center;margin:0;padding:0;cursor:pointer;transition:background-color .2s ease-in-out}.twui-checkbox:hover{background-color:var(--twui-color-secondary)}.twui-checkbox input{margin-right:1ch;margin-left:1ch}.twui-color-picker{flex:auto 1 1;display:flex;flex-direction:row}.twui-color-picker .color-picker-panel{flex:1;position:relative;margin:var(--twui-gap)}.twui-color-picker .color-picker-inputs{flex:none;display:flex;flex-direction:column}.twui-color-picker .color-picker-inputs .input-r{border-color:red}.twui-color-picker .color-picker-inputs .input-g{border-color:lime}.twui-color-picker .color-picker-inputs .input-b{border-color:blue}.twui-color-picker .color-picker-inputs .input-a{border-image:linear-gradient(to right, #fff, transparent)}.twui-color-picker .color-picker-inputs .input-hex{border-color:#000}.twui-color-picker .color-picker-inputs input{display:block;width:4rem;flex:none}.twui-color-picker .color-picker-sv:focus,.twui-color-picker .color-picker-h:focus,.twui-color-picker .color-picker-a:focus{outline:none;border-color:var(--twui-color-accent)}.twui-color-picker .color-picker-sv{width:100%;padding-top:100%;position:relative;box-sizing:border-box;cursor:crosshair;z-index:1;border-bottom:1px solid;border-color:var(--twui-color-primary-dark)}.twui-color-picker .color-picker-sv-bg{position:absolute;top:0;left:0;right:0;bottom:0}.twui-color-picker .color-picker-sv-cursor{box-sizing:border-box;position:absolute;width:10px;height:10px;margin-top:-5px;margin-left:-5px;border:1px solid #fff;border-radius:5px;box-shadow:0px 0px 2px 1px rgba(0,0,0,.75)}.twui-color-picker .color-picker-h,.twui-color-picker .color-picker-a{position:relative;height:1rem;box-sizing:border-box;cursor:ew-resize;margin-top:calc(var(--twui-gap)*2);border-bottom:1px solid;border-color:var(--twui-color-primary-dark)}.twui-color-picker .color-picker-h-cursor,.twui-color-picker .color-picker-a-cursor{position:absolute;width:4px;height:calc(1rem - 2px);margin-left:-3px;border:1px solid #fff;border-radius:2px;box-shadow:0px 0px 2px 1px rgba(0,0,0,.75)}.twui-color-picker .color-picker-a{background-image:linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)),linear-gradient(to right, grey 50%, white 50%),linear-gradient(to bottom, grey 50%, white 50%);background-blend-mode:normal,difference,normal;background-size:1rem 1rem}.twui-color-picker .color-picker-a-bg{position:absolute;top:0;left:0;right:0;bottom:0}.twui-color-picker .color-picker-sv,.twui-color-picker .color-picker-h,.twui-color-picker .color-picker-a{border-color:var(--twui-color-primary-dark)}.twui-color{flex:auto 1 1;display:flex;flex-direction:column;align-items:stretch}.twui-color button{text-shadow:0 0 10px #000;color:#fff;font-weight:bold;text-transform:uppercase}.twui-container{display:flex;display:flex;flex-flow:column nowrap;align-items:stretch}.twui-container-horizontal{flex-direction:row}.twui-container-horizontal>*{flex:1}.twui-group{display:flex;flex-flow:column nowrap;align-items:stretch;border-color:var(--twui-color-primary-dark)}.twui-group-title{margin:0;width:auto;height:var(--twui-size);line-height:var(--twui-size);background-color:var(--twui-color-primary-dark);padding-left:calc(2*var(--twui-gap));font-weight:bold}.twui-group-collapsible .twui-group-title{padding-left:0;cursor:pointer}.twui-group-collapsible>.twui-group-title::before{content:"🗁";display:inline-block;width:var(--twui-size);height:var(--twui-size);text-align:center;transition:transform .1s ease-in-out}.twui-group-inset,.twui-group-collapsible>.twui-group-collapsible{border-left:.25rem solid;border-left-color:var(--twui-color-primary-light)}.twui-group-collapsed>.twui-group-title::before{content:"🗀"}.twui-group-control{display:flex;flex-flow:row nowrap;align-items:stretch;min-height:var(--twui-size);box-sizing:border-box}.twui-group-control>label:first-child{flex:none;box-sizing:border-box;width:calc(var(--twui-label-width) - 2*var(--twui-label-pad-x));min-width:calc(var(--twui-label-width) - 2*var(--twui-label-pad-x));min-height:calc(var(--twui-size) - 2*var(--twui-gap));line-height:calc(var(--twui-size) - 2*var(--twui-gap));padding:var(--twui-label-pad-y) var(--twui-label-pad-x);margin:var(--twui-gap);overflow:hidden}.twui-group-control>section{flex:1;display:flex;flex-flow:column nowrap;align-items:stretch}.twui-image{max-width:100%;display:block}.twui-image img{width:100%}.twui-image-aspect{position:relative}.twui-image-aspect::before{content:"";display:block;width:100%;padding-top:100%;padding-top:var(--twui-aspect)}.twui-image-aspect img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:fill;object-fit:var(--twui-fit)}.twui-number,.twui-slider{display:flex;flex-flow:row nowrap;align-items:stretch}.twui-number input{flex:1}.twui-slider .twui-progress{flex:1;display:flex;margin:var(--twui-gap);cursor:ew-resize;transition:background-color .2s ease-in-out;background-color:var(--twui-color-secondary)}.twui-slider .twui-progress:hover{background-color:var(--twui-color-secondary-dark)}.twui-slider .twui-progress.disabled{cursor:not-allowed}.twui-slider .twui-progress-bar{background-color:var(--twui-color-secondary-light)}.twui-slider input[type=number]{flex:none;width:3.5rem}.twui-point{background-color:var(--twui-color-secondary);border-color:var(--twui-color-primary-dark);background-image:linear-gradient(var(--twui-color-primary-light) 1px, transparent 1px),linear-gradient(90deg, var(--twui-color-primary-light) 1px, transparent 1px);background-size:10% 10%,10% 10%;transition:border-color .2s ease-in-out,background-color .2s ease-in-out;position:relative;width:100%;padding-top:100%;box-sizing:border-box;cursor:crosshair;z-index:1;overflow:visible}.twui-point .point-x-axis,.twui-point .point-y-axis{background-color:var(--twui-color-primary-dark)}.twui-point:focus{border-color:var(--twui-color-accent);outline:none}.twui-point:focus .point-x-axis,.twui-point:focus .point-y-axis{background-color:var(--twui-color-accent)}.twui-spherical{display:flex;flex-direction:row;align-items:flex-start}.twui-spherical .left-container{flex:1}.twui-spherical .right-container{flex:none;display:grid;grid-template-columns:max-content max-content}.twui-spherical .right-container .twui-checkbox{grid-column:span 2}.twui-spherical .right-container .twui-checkbox input{margin-left:0}.twui-spherical label{text-align:right;line-height:var(--twui-input-height);padding:0 var(--twui-label-pad-x)}.twui-spherical input[type=number]{width:3.5rem}.twui-spherical .pane{position:relative;width:100%;padding-top:100%}.twui-spherical .pane::before{position:absolute;content:"";width:calc(100% - 2rem);height:calc(100% - 2rem);left:1rem;top:1rem;border:1px solid;border-radius:50%;border-color:var(--twui-color-primary-light);box-sizing:border-box}.twui-spherical .pane::after{position:absolute;content:"";top:50%;left:50%;width:calc(50% - 1rem);height:1px;background-color:var(--twui-color-primary-light);transform-origin:left center;transform:rotate(var(--spherical-phi))}.twui-spherical .phi-knob{border:0px solid rgba(0,0,0,0);border-radius:100%;background-color:var(--twui-color-primary-light)}.twui-spherical .phi-knob:hover{background-color:var(--twui-color-secondary-light)}.twui-spherical .phi-pane.is-dragging .phi-knob{background-color:var(--twui-color-accent)}.twui-spherical .theta-knob{border:1px solid rgba(0,0,0,0);border-radius:100%;border-color:var(--twui-color-primary-light)}.twui-spherical .theta-knob:hover{border-color:var(--twui-color-secondary-light)}.twui-spherical .theta-pane.is-dragging .theta-knob{border-color:var(--twui-color-accent)}.twui-tabs{display:flex;flex-flow:column nowrap;align-items:stretch;border-color:var(--twui-color-primary-dark)}.twui-tabs-list{display:flex;flex-flow:row wrap;align-items:stretch}.twui-tabs-list>button{flex:auto 1 11;border:0;border-top:1px solid;margin:0;height:var(--twui-size);line-height:calc(var(--twui-size) - 2*var(--twui-button-pad-y));background-color:var(--twui-color-primary-dark);border-color:var(--twui-color-primary);color:var(--twui-color-on-primary)}.twui-tabs-list>button:hover{background-color:var(--twui-color-primary);border-color:var(--twui-color-primary-dark)}.twui-tabs-list>button.is-active{background-color:var(--twui-color-primary);border-color:var(--twui-color-accent)}.twui-position{display:flex;flex-flow:row wrap;align-items:stretch}.twui-position>*{flex:auto 1 1}/*# sourceMappingURL=tweak-ui.min.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../src/style/
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../src/style/_style.scss","../src/style/controls/_angle.scss","../src/style/controls/_checkbox.scss","../src/style/controls/_color-picker.scss","../src/style/controls/_color.scss","../src/style/controls/_container.scss","../src/style/controls/_group.scss","../src/style/controls/_image.scss","../src/style/controls/_number.scss","../src/style/controls/_point.scss","../src/style/controls/_spherical.scss","../src/style/controls/_tabs.scss","../src/style/controls/_position.scss"],"names":[],"mappings":"CAEA,MACE,sBACA,oBACA,yBACA,4BACA,2BACA,sCACA,6BACA,2BACA,uCACA,4BACA,6BAEA,8BACA,mCACA,oCACA,gCACA,qCACA,sCACA,iCACA,mCACA,6BAGF,WACE,8BACA,mCACA,oCACA,gCACA,qCACA,sCACA,8BACA,gCACA,6BAGF,YACE,8BACA,mCACA,oCACA,gCACA,qCACA,sCACA,iCACA,mCACA,6BAGF,WACE,6BACA,2CACA,mCAEA,mLACA,sCACA,UACA,SACA,+BACA,cACA,cACA,kBACA,sBAMA,8BACE,YAGF,oCACE,2CAGF,oCACE,iBACA,mBACA,4CACA,2CACA,4CAGF,0CACE,6CAOF,iBACE,iBACA,gBAGF,iDACE,eAGF,0EAGE,6CACA,qCAEA,wBACA,qBACA,gBACA,gBACA,aACA,YACA,sBAEA,kDACA,uDACA,wDACA,uBAGF,kBACE,oFACA,0DACA,uBAEA,iBACA,kBACA,mBAEF,yBACE,0BAGF,oGACE,wBACA,4CACA,yEAEA,gQAEE,mDACA,8CAGF,gQAEE,aACA,sCAGF,oRAEE,WACA,mBAIJ,qBACE,WACA,mBAIA,oEACE,+BAIJ,8BACE,gBAEF,gCACE,SACA,gBACA,iDACA,kDACA,kBACA,eAEF,wCACE,YACA,aACA,iBAEF,gDACE,YACA,UC1LJ,YACE,aACA,mBACA,uBAEA,4BACE,OAGF,6BACE,UACA,aACA,8CAEA,4CACE,mBACA,kDACE,cAKN,kBACE,iBACA,qCACA,kCAEF,+BACE,aAGF,kBACE,kBACA,WACA,iBACA,0BACE,kBACA,WACA,wBACA,yBACA,UACA,SACA,iBACA,kBACA,6CACA,sBACA,qGACA,oCAIJ,wBACE,+BACA,mBACA,iDAEA,8BACE,mDAGJ,gDACE,0CC7DJ,eACE,sDACA,uDACA,aACA,mBACA,mBAEA,SACA,UACA,eACA,4CAEA,qBACE,6CAGF,qBACE,iBACA,gBCjBJ,mBACE,cACA,aACA,mBAEA,uCACE,OACA,kBACA,uBAGF,wCACE,UACA,aACA,sBAEA,iDACE,iBAEF,iDACE,kBAEF,iDACE,kBAEF,iDACE,0DAEF,mDACE,kBAGF,8CACE,cACA,WACA,UAOF,4HACE,aACA,sCAIJ,oCACE,WACA,iBACA,kBACA,sBACA,iBACA,UACA,wBACA,4CAEF,uCACE,kBACA,MACA,OACA,QACA,SAEF,2CACE,sBACA,kBACA,WACA,YACA,gBACA,iBACA,sBACA,kBACA,2CAGF,sEAEE,kBACA,YACA,sBACA,iBACA,mCACA,wBACA,4CAGF,oFAEE,kBACA,UACA,wBACA,iBACA,sBACA,kBACA,2CAGF,mCACE,iBACkB,6JAIlB,+CACA,0BAGF,sCACE,kBACA,MACA,OACA,QACA,SAGF,0GAGE,4CC1HJ,YACE,cACA,aACA,sBACA,oBAEA,mBACE,0BACA,WACA,iBACA,yBCXJ,gBACE,aACA,aACA,wBACA,oBAGF,2BACE,mBACA,6BACE,OCRJ,YACE,aACA,wBACA,oBAEA,4CAGF,kBACE,SACA,WACA,wBACA,6BACA,gDACA,qCACA,iBAGF,0CACE,eACA,eAGF,kDACE,aACA,qBACA,uBACA,wBACA,kBACA,qCAGF,kEAEE,yBACA,kDAGF,gDACE,aAGF,oBACE,aACA,qBACA,oBACA,4BACA,sBAEA,sCACE,UACA,sBACA,gEACA,oEACA,sDACA,uDACA,wDACA,uBAEA,gBAGF,4BACE,OACA,aACA,wBACA,oBCpEJ,YACE,eACA,cACA,gBACE,WAIJ,mBACE,kBACA,2BACE,WACA,cACA,WACA,iBACA,+BAEF,uBACE,kBACA,MACA,OACA,WACA,YACA,gBACA,2BCtBJ,0BAEE,aACA,qBACA,oBAGF,mBACE,OAIA,4BACE,OACA,aACA,uBACA,iBACA,4CAEA,6CACA,kCACE,kDAIJ,qCACE,mBAGF,gCACE,mDAGF,gCACE,UACA,aClCJ,YACE,6CACA,4CACA,iBACE,mJAEF,gCACA,yEAEA,kBACA,WACA,iBACA,sBACA,iBACA,UAEA,iBAEA,oDAEE,gDAGF,kBAKE,sCACA,aALA,gEAEE,0CC3BN,gBACE,aACA,mBACA,uBAEA,gCACE,OAGF,iCACE,UACA,aACA,8CAEA,gDACE,mBACA,sDACE,cAKN,sBACE,iBACA,qCACA,kCAEF,mCACE,aAGF,sBACE,kBACA,WACA,iBACA,8BACE,kBACA,WACA,wBACA,yBACA,UACA,SACA,iBACA,kBACA,6CACA,sBAGF,6BACE,kBACA,WACA,QACA,SACA,uBACA,WACA,iDACA,6BACA,uCAIJ,0BACE,+BACA,mBACA,iDAEA,gCACE,mDAGJ,gDACE,0CAGF,4BACE,+BACA,mBACA,6CAEA,kCACE,+CAGJ,oDACE,sCCnFJ,WACE,aACA,wBACA,oBAEA,4CAGF,gBACE,aACA,mBACA,oBAGF,uBACE,eACA,SACA,qBACA,SAEA,wBACA,gEAEA,gDACA,uCACA,mCAEA,6BACE,2CACA,4CAGF,iCACE,2CACA,sCCrCJ,eACE,aACA,mBACA,oBAEA,iBACE","file":"tweak-ui.min.css"}
|