@pageboard/html 0.10.12 → 0.10.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/elements/form.js +0 -1
  2. package/lib/nouislider.js +31 -31
  3. package/package.json +2 -2
  4. package/ui/card.css +49 -49
  5. package/ui/form.css +3 -12
  6. package/ui/form.js +56 -38
  7. package/ui/input-file.css +6 -6
  8. package/ui/input-file.js +19 -15
  9. package/ui/input-range.js +8 -6
  10. package/ui/item.css +30 -30
  11. package/ui/layout.css +1 -1
  12. package/ui/loading.css +7 -7
  13. package/ui/menu.css +1 -1
  14. package/ui/menu.js +9 -7
  15. package/ui/query-tags.js +4 -3
  16. package/ui/rating.css +7 -7
  17. package/ui/site.css +25 -35
  18. package/ui/tab.css +1 -4
  19. package/ui/transition.css +8 -8
package/ui/site.css CHANGED
@@ -22,10 +22,10 @@ body {
22
22
  overflow-x: hidden;
23
23
  min-width: 320px;
24
24
  background: #FFFFFF;
25
- font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
25
+ font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
26
26
  font-size: 14px;
27
27
  line-height: 1.4285em;
28
- color: rgba(0, 0, 0, 0.87);
28
+ color: rgb(0 0 0 / 87%);
29
29
  }
30
30
  .hidden,[hidden] {
31
31
  display:none !important;
@@ -41,9 +41,9 @@ h2,
41
41
  h3,
42
42
  h4,
43
43
  h5 {
44
- font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
45
- line-height: 1.28571429em;
46
- margin: calc(2rem - 0.14285714em) 0 1rem;
44
+ font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
45
+ line-height: 1.2857em;
46
+ margin: calc(2rem - 0.1428em) 0 1rem;
47
47
  font-weight: bold;
48
48
  padding: 0;
49
49
  }
@@ -52,13 +52,13 @@ h1 {
52
52
  font-size: 2rem;
53
53
  }
54
54
  h2 {
55
- font-size: 1.71428571rem;
55
+ font-size: 1.7143rem;
56
56
  }
57
57
  h3 {
58
- font-size: 1.28571429rem;
58
+ font-size: 1.2857rem;
59
59
  }
60
60
  h4 {
61
- font-size: 1.07142857rem;
61
+ font-size: 1.0714rem;
62
62
  }
63
63
  h5 {
64
64
  font-size: 1rem;
@@ -172,7 +172,6 @@ i.icon {
172
172
  height:1em;
173
173
  font-size:1em;
174
174
  text-align:center;
175
- speak:none;
176
175
  }
177
176
  i.icon::before {
178
177
  display:block;
@@ -192,7 +191,7 @@ i.icon::before {
192
191
  cursor: pointer;
193
192
  }
194
193
  .caret-icon::before {
195
- content: '\f0da';
194
+ content: "\f0da";
196
195
  transform: rotate(0deg);
197
196
  font-family: Accordion;
198
197
  font-style:normal;
@@ -211,25 +210,25 @@ i.icon::before {
211
210
 
212
211
  i.icon.prev::before {
213
212
  background-image: url('data:image/svg+xml;utf8,<svg width="100%" height="100%" viewBox="0 0 2048 2048" xmlns="http://www.w3.org/2000/svg"><path d="M1331 672q0 13-10 23l-393 393 393 393q10 10 10 23t-10 23l-50 50q-10 10-23 10t-23-10l-466-466q-10-10-10-23t10-23l466-466q10-10 23-10t23 10l50 50q10 10 10 23z"/></svg>');
214
- content:'';
213
+ content:"";
215
214
  }
216
215
  i.icon.next::before {
217
216
  background-image: url('data:image/svg+xml;utf8,<svg width="100%" height="100%" viewBox="0 0 2048 2048" xmlns="http://www.w3.org/2000/svg"><path d="M1299 1088q0 13-10 23l-466 466q-10 10-23 10t-23-10l-50-50q-10-10-10-23t10-23l393-393-393-393q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l466 466q10 10 10 23z"/></svg>');
218
- content:'';
217
+ content:"";
219
218
  }
220
219
  i.icon.up::before {
221
220
  background-image: url('data:image/svg+xml;utf8,<svg width="100%" height="100%" viewBox="0 0 2048 2048" xmlns="http://www.w3.org/2000/svg"><path d="M1523 1312q0 13-10 23l-50 50q-10 10-23 10t-23-10l-393-393-393 393q-10 10-23 10t-23-10l-50-50q-10-10-10-23t10-23l466-466q10-10 23-10t23 10l466 466q10 10 10 23z"/></svg>');
222
- content:'';
221
+ content:"";
223
222
  }
224
223
 
225
224
  .ui.breadcrumb .divider::before {
226
- content: '>';
225
+ content: ">";
227
226
  }
228
227
 
229
228
  i.icon.delete::before,
230
229
  i.icon.close::before {
231
230
  font-size:2em;
232
- content:'×';
231
+ content:"×";
233
232
  width:auto;
234
233
  height:auto;
235
234
  }
@@ -246,54 +245,45 @@ i.icon.close::before {
246
245
 
247
246
 
248
247
  /* Site */
249
- ::-webkit-selection {
250
- background-color: #CCE2FF;
251
- color: rgba(0, 0, 0, 0.87);
252
- }
253
- ::-moz-selection {
254
- background-color: #CCE2FF;
255
- color: rgba(0, 0, 0, 0.87);
256
- }
257
248
  ::selection {
258
249
  background-color: #CCE2FF;
259
- color: rgba(0, 0, 0, 0.87);
250
+ color: rgb(0 0 0 / 87%);
260
251
  }
261
252
 
262
253
  /* Force Simple Scrollbars */
263
254
  body ::-webkit-scrollbar {
264
- -webkit-appearance: none;
255
+ appearance: none;
265
256
  width: 10px;
266
257
  }
267
258
  body ::-webkit-scrollbar-track {
268
- background: rgba(0, 0, 0, 0.1);
259
+ background: rgb(0 0 0 / 10%);
269
260
  border-radius: 0px;
270
261
  }
271
262
  body ::-webkit-scrollbar-thumb {
272
263
  cursor: pointer;
273
264
  border-radius: 5px;
274
- background: rgba(0, 0, 0, 0.25);
275
- -webkit-transition: color 0.2s ease;
265
+ background: rgb(0 0 0 / 25%);
276
266
  transition: color 0.2s ease;
277
267
  }
278
268
  body ::-webkit-scrollbar-thumb:window-inactive {
279
- background: rgba(0, 0, 0, 0.15);
269
+ background: rgb(0 0 0 / 15%);
280
270
  }
281
271
  body ::-webkit-scrollbar-thumb:hover {
282
- background: rgba(128, 135, 139, 0.8);
272
+ background: rgb(128 135 139 / 80%);
283
273
  }
284
274
 
285
275
  /* Inverted UI */
286
276
  body .ui.inverted::-webkit-scrollbar-track {
287
- background: rgba(255, 255, 255, 0.1);
277
+ background: rgb(255 255 255 / 10%);
288
278
  }
289
279
  body .ui.inverted::-webkit-scrollbar-thumb {
290
- background: rgba(255, 255, 255, 0.25);
280
+ background: rgb(255 255 255 / 25%);
291
281
  }
292
282
  body .ui.inverted::-webkit-scrollbar-thumb:window-inactive {
293
- background: rgba(255, 255, 255, 0.15);
283
+ background: rgb(255 255 255 / 15%);
294
284
  }
295
285
  body .ui.inverted::-webkit-scrollbar-thumb:hover {
296
- background: rgba(255, 255, 255, 0.35);
286
+ background: rgb(255 255 255 / 35%);
297
287
  }
298
288
 
299
289
  /* Fixes */
@@ -315,7 +305,7 @@ body .ui.inverted::-webkit-scrollbar-thumb:hover {
315
305
  width: auto;
316
306
  height: auto;
317
307
  top: 100% !important;
318
- opacity: 1;
308
+ opacity: 100%;
319
309
  }
320
310
 
321
311
  [contenteditable] .field[block-focused] .dropdown > .menu {
package/ui/tab.css CHANGED
@@ -9,10 +9,7 @@ element-tabs {
9
9
  }
10
10
  element-tabs > .ui.tabular.menu + div[block-content="tabs"] > .segment {
11
11
  border-top: none;
12
- margin-left: 0;
13
- margin-top: 0;
14
- margin-right: 0;
15
- margin-bottom:1rem;
12
+ margin:0 0 1rem;
16
13
  width: 100%;
17
14
  }
18
15
 
package/ui/transition.css CHANGED
@@ -1,16 +1,16 @@
1
1
  /* async progress bar and error signal */
2
2
 
3
3
  body::after {
4
- content: '';
4
+ content: "";
5
5
  position:fixed;
6
6
  display:block;
7
7
  left:0;
8
8
  top:1px;
9
9
  width:0%;
10
10
  height:0;
11
- opacity:0.7;
11
+ opacity:70%;
12
12
  background: #4486cc;
13
- box-shadow: 0 0 5px rgba(99, 162, 235, 0.7);
13
+ box-shadow: 0 0 5px rgb(99 162 235 / 70%);
14
14
  z-index:1000;
15
15
  }
16
16
  html[data-stage] > body::after {
@@ -75,7 +75,7 @@ html.transition > body + body[data-transition-open] {
75
75
  }
76
76
 
77
77
  html.transition > body + body[data-transition-open] > *:not([block-type="main"]) {
78
- opacity:0;
78
+ opacity:0%;
79
79
  }
80
80
 
81
81
  html.transition > body + body[data-transition-open="tr-right"] {
@@ -99,7 +99,7 @@ html.transition > body + body[data-transition-open="tr-bottom"] {
99
99
  }
100
100
 
101
101
  html.transition > body + body[data-transition-open="fade"] {
102
- opacity:0;
102
+ opacity:0%;
103
103
  transition: opacity 1.5s ease-in;
104
104
  }
105
105
 
@@ -107,7 +107,7 @@ html.transition.transitioning > body + body[data-transition-open|="tr"] {
107
107
  transform: translate3d(0, 0, 0);
108
108
  }
109
109
  html.transition.transitioning > body + body[data-transition-open="fade"] {
110
- opacity:1;
110
+ opacity:100%;
111
111
  }
112
112
 
113
113
  /* closing transitions */
@@ -118,7 +118,7 @@ html.transition > body[data-transition-close|="tr"]:first-of-type {
118
118
 
119
119
  html.transition > body[data-transition-close="fade"]:first-of-type {
120
120
  z-index:1;
121
- opacity:1;
121
+ opacity:100%;
122
122
  transition: opacity 1.5s ease-in;
123
123
  }
124
124
 
@@ -139,6 +139,6 @@ html.transition.transitioning > body[data-transition-close="tr-bottom"]:first-of
139
139
  }
140
140
 
141
141
  html.transition.transitioning > body[data-transition-close="fade"]:first-of-type {
142
- opacity:0;
142
+ opacity:0%;
143
143
  }
144
144