@weavy/uikit-react 16.0.0 → 16.0.2

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 CHANGED
@@ -1,5 +1,18 @@
1
1
  # Changelog for Weavy
2
2
 
3
+ ## v16.0.2
4
+
5
+ <time>2023-03-20</time>
6
+
7
+ * Fixed issues with styling in uikit-js.
8
+ * Fixed issues with fonts in uikit-js.
9
+
10
+ ## v16.0.1
11
+
12
+ <time>2023-03-13</time>
13
+
14
+ * Fixed issues with styling in uikit-js.
15
+
3
16
  ## v16.0.0
4
17
 
5
18
  <time>2023-03-06</time>
@@ -152,7 +152,7 @@
152
152
  --wy-gray: var(--wy-gray-light);
153
153
  }
154
154
 
155
- :where(.wy-dark) {
155
+ :where(.wy-dark:not(.wy-light)) {
156
156
  color-scheme: dark;
157
157
  --wy-primary: var(--wy-primary-80);
158
158
  --wy-on-primary: var(--wy-primary-20);
@@ -420,6 +420,8 @@
420
420
  position: absolute;
421
421
  width: 100%;
422
422
  height: 100%;
423
+ top: 0;
424
+ left: 0;
423
425
  border-radius: inherit;
424
426
  background-color: var(--wy-presence-active);
425
427
  background-clip: content-box;
@@ -443,7 +445,7 @@
443
445
  color: var(--wy-component-color);
444
446
  background: var(--wy-component-background-color, transparent);
445
447
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
446
- font-family: var(--wy-btn-font-family);
448
+ font-family: var(--wy-btn-font-family), inherit;
447
449
  font-size: var(--wy-btn-font-size);
448
450
  font-weight: var(--wy-btn-font-weight);
449
451
  line-height: var(--wy-btn-line-height);
@@ -1158,7 +1160,7 @@
1158
1160
  width: 100%;
1159
1161
  padding: 0.75rem 1rem;
1160
1162
  clear: both;
1161
- font-family: inherit;
1163
+ font-family: var(--wy-font-family), inherit;
1162
1164
  font-size: inherit;
1163
1165
  font-weight: 400;
1164
1166
  line-height: 1;
@@ -1473,7 +1475,7 @@ img.wy-emoji, svg.wy-emoji {
1473
1475
  display: block;
1474
1476
  width: 100%;
1475
1477
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1476
- font-family: var(--wy-font-family);
1478
+ font-family: var(--wy-font-family), inherit;
1477
1479
  font-size: var(--wy-input-font-size);
1478
1480
  font-weight: var(--wy-input-font-weight);
1479
1481
  line-height: var(--wy-input-line-height);
@@ -2147,7 +2149,7 @@ tr.wy-pager td .wy-spinner {
2147
2149
  justify-content: center;
2148
2150
  transition: opacity 0.1s step-end;
2149
2151
  transition-delay: 0.2s;
2150
- font-family: inherit;
2152
+ font-family: var(--wy-font-family), inherit;
2151
2153
  line-height: var(--wy-line-height);
2152
2154
  font-weight: var(--wy-font-weight);
2153
2155
  background-color: var(--wy-surface-1);
@@ -3763,7 +3765,7 @@ tr.wy-pager td .wy-spinner {
3763
3765
 
3764
3766
  .wy-message-editor .ͼ1.cm-editor .cm-content,
3765
3767
  .wy-message-editor-textcontent {
3766
- font-family: var(--wy-font-family);
3768
+ font-family: var(--wy-font-family),  inherit;
3767
3769
  font-size: var(--wy-font-size-base);
3768
3770
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
3769
3771
  }
@@ -151,7 +151,7 @@
151
151
  --wy-gray: var(--wy-gray-light);
152
152
  }
153
153
 
154
- :where(.wy-dark) {
154
+ :where(.wy-dark:not(.wy-light)) {
155
155
  color-scheme: dark;
156
156
  --wy-primary: var(--wy-primary-80);
157
157
  --wy-on-primary: var(--wy-primary-20);
@@ -574,7 +574,7 @@
574
574
  color: var(--wy-component-color);
575
575
  background: var(--wy-component-background-color, transparent);
576
576
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
577
- font-family: var(--wy-btn-font-family);
577
+ font-family: var(--wy-btn-font-family), inherit;
578
578
  font-size: var(--wy-btn-font-size);
579
579
  font-weight: var(--wy-btn-font-weight);
580
580
  line-height: var(--wy-btn-line-height);
@@ -822,7 +822,7 @@
822
822
  width: 100%;
823
823
  padding: 0.75rem 1rem;
824
824
  clear: both;
825
- font-family: inherit;
825
+ font-family: var(--wy-font-family), inherit;
826
826
  font-size: inherit;
827
827
  font-weight: 400;
828
828
  line-height: 1;
@@ -1168,7 +1168,7 @@
1168
1168
  display: block;
1169
1169
  width: 100%;
1170
1170
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1171
- font-family: var(--wy-font-family);
1171
+ font-family: var(--wy-font-family), inherit;
1172
1172
  font-size: var(--wy-input-font-size);
1173
1173
  font-weight: var(--wy-input-font-weight);
1174
1174
  line-height: var(--wy-input-line-height);
@@ -152,7 +152,7 @@
152
152
  --wy-gray: var(--wy-gray-light);
153
153
  }
154
154
 
155
- :where(.wy-dark) {
155
+ :where(.wy-dark:not(.wy-light)) {
156
156
  color-scheme: dark;
157
157
  --wy-primary: var(--wy-primary-80);
158
158
  --wy-on-primary: var(--wy-primary-20);
@@ -595,6 +595,8 @@
595
595
  position: absolute;
596
596
  width: 100%;
597
597
  height: 100%;
598
+ top: 0;
599
+ left: 0;
598
600
  border-radius: inherit;
599
601
  background-color: var(--wy-presence-active);
600
602
  background-clip: content-box;
@@ -660,7 +662,7 @@
660
662
  color: var(--wy-component-color);
661
663
  background: var(--wy-component-background-color, transparent);
662
664
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
663
- font-family: var(--wy-btn-font-family);
665
+ font-family: var(--wy-btn-font-family), inherit;
664
666
  font-size: var(--wy-btn-font-size);
665
667
  font-weight: var(--wy-btn-font-weight);
666
668
  line-height: var(--wy-btn-line-height);
@@ -1436,7 +1438,7 @@
1436
1438
  width: 100%;
1437
1439
  padding: 0.75rem 1rem;
1438
1440
  clear: both;
1439
- font-family: inherit;
1441
+ font-family: var(--wy-font-family), inherit;
1440
1442
  font-size: inherit;
1441
1443
  font-weight: 400;
1442
1444
  line-height: 1;
@@ -1751,7 +1753,7 @@ img.wy-emoji, svg.wy-emoji {
1751
1753
  display: block;
1752
1754
  width: 100%;
1753
1755
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1754
- font-family: var(--wy-font-family);
1756
+ font-family: var(--wy-font-family), inherit;
1755
1757
  font-size: var(--wy-input-font-size);
1756
1758
  font-weight: var(--wy-input-font-weight);
1757
1759
  line-height: var(--wy-input-line-height);
@@ -2425,7 +2427,7 @@ tr.wy-pager td .wy-spinner {
2425
2427
  justify-content: center;
2426
2428
  transition: opacity 0.1s step-end;
2427
2429
  transition-delay: 0.2s;
2428
- font-family: inherit;
2430
+ font-family: var(--wy-font-family), inherit;
2429
2431
  line-height: var(--wy-line-height);
2430
2432
  font-weight: var(--wy-font-weight);
2431
2433
  background-color: var(--wy-surface-1);
@@ -4121,7 +4123,7 @@ tr.wy-pager td .wy-spinner {
4121
4123
 
4122
4124
  .wy-message-editor .ͼ1.cm-editor .cm-content,
4123
4125
  .wy-message-editor-textcontent {
4124
- font-family: var(--wy-font-family);
4126
+ font-family: var(--wy-font-family),  inherit;
4125
4127
  font-size: var(--wy-font-size-base);
4126
4128
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
4127
4129
  }
@@ -152,7 +152,7 @@
152
152
  --wy-gray: var(--wy-gray-light);
153
153
  }
154
154
 
155
- :where(.wy-dark) {
155
+ :where(.wy-dark:not(.wy-light)) {
156
156
  color-scheme: dark;
157
157
  --wy-primary: var(--wy-primary-80);
158
158
  --wy-on-primary: var(--wy-primary-20);
@@ -655,6 +655,8 @@
655
655
  position: absolute;
656
656
  width: 100%;
657
657
  height: 100%;
658
+ top: 0;
659
+ left: 0;
658
660
  border-radius: inherit;
659
661
  background-color: var(--wy-presence-active);
660
662
  background-clip: content-box;
@@ -678,7 +680,7 @@
678
680
  color: var(--wy-component-color);
679
681
  background: var(--wy-component-background-color, transparent);
680
682
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
681
- font-family: var(--wy-btn-font-family);
683
+ font-family: var(--wy-btn-font-family), inherit;
682
684
  font-size: var(--wy-btn-font-size);
683
685
  font-weight: var(--wy-btn-font-weight);
684
686
  line-height: var(--wy-btn-line-height);
@@ -926,7 +928,7 @@
926
928
  width: 100%;
927
929
  padding: 0.75rem 1rem;
928
930
  clear: both;
929
- font-family: inherit;
931
+ font-family: var(--wy-font-family), inherit;
930
932
  font-size: inherit;
931
933
  font-weight: 400;
932
934
  line-height: 1;
@@ -1196,7 +1198,7 @@
1196
1198
 
1197
1199
  .wy-comment-editor .ͼ1.cm-editor .cm-content,
1198
1200
  .wy-comment-editor-textcontent {
1199
- font-family: var(--wy-font-family);
1201
+ font-family: var(--wy-font-family), inherit;
1200
1202
  font-size: var(--wy-font-size-base);
1201
1203
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1202
1204
  }
@@ -1940,7 +1942,7 @@ img.wy-emoji, svg.wy-emoji {
1940
1942
  display: block;
1941
1943
  width: 100%;
1942
1944
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1943
- font-family: var(--wy-font-family);
1945
+ font-family: var(--wy-font-family), inherit;
1944
1946
  font-size: var(--wy-input-font-size);
1945
1947
  font-weight: var(--wy-input-font-weight);
1946
1948
  line-height: var(--wy-input-line-height);
@@ -2560,7 +2562,7 @@ tr.wy-pager td .wy-spinner {
2560
2562
 
2561
2563
  .wy-post-editor .ͼ1.cm-editor .cm-content,
2562
2564
  .wy-post-editor-textcontent {
2563
- font-family: var(--wy-font-family);
2565
+ font-family: var(--wy-font-family), inherit;
2564
2566
  font-size: var(--wy-font-size-base);
2565
2567
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
2566
2568
  }
@@ -152,7 +152,7 @@
152
152
  --wy-gray: var(--wy-gray-light);
153
153
  }
154
154
 
155
- :where(.wy-dark) {
155
+ :where(.wy-dark:not(.wy-light)) {
156
156
  color-scheme: dark;
157
157
  --wy-primary: var(--wy-primary-80);
158
158
  --wy-on-primary: var(--wy-primary-20);
@@ -420,6 +420,8 @@
420
420
  position: absolute;
421
421
  width: 100%;
422
422
  height: 100%;
423
+ top: 0;
424
+ left: 0;
423
425
  border-radius: inherit;
424
426
  background-color: var(--wy-presence-active);
425
427
  background-clip: content-box;
@@ -443,7 +445,7 @@
443
445
  color: var(--wy-component-color);
444
446
  background: var(--wy-component-background-color, transparent);
445
447
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
446
- font-family: var(--wy-btn-font-family);
448
+ font-family: var(--wy-btn-font-family), inherit;
447
449
  font-size: var(--wy-btn-font-size);
448
450
  font-weight: var(--wy-btn-font-weight);
449
451
  line-height: var(--wy-btn-line-height);
@@ -1158,7 +1160,7 @@
1158
1160
  width: 100%;
1159
1161
  padding: 0.75rem 1rem;
1160
1162
  clear: both;
1161
- font-family: inherit;
1163
+ font-family: var(--wy-font-family), inherit;
1162
1164
  font-size: inherit;
1163
1165
  font-weight: 400;
1164
1166
  line-height: 1;
@@ -1473,7 +1475,7 @@ img.wy-emoji, svg.wy-emoji {
1473
1475
  display: block;
1474
1476
  width: 100%;
1475
1477
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
1476
- font-family: var(--wy-font-family);
1478
+ font-family: var(--wy-font-family), inherit;
1477
1479
  font-size: var(--wy-input-font-size);
1478
1480
  font-weight: var(--wy-input-font-weight);
1479
1481
  line-height: var(--wy-input-line-height);
@@ -2147,7 +2149,7 @@ tr.wy-pager td .wy-spinner {
2147
2149
  justify-content: center;
2148
2150
  transition: opacity 0.1s step-end;
2149
2151
  transition-delay: 0.2s;
2150
- font-family: inherit;
2152
+ font-family: var(--wy-font-family), inherit;
2151
2153
  line-height: var(--wy-line-height);
2152
2154
  font-weight: var(--wy-font-weight);
2153
2155
  background-color: var(--wy-surface-1);
@@ -3763,7 +3765,7 @@ tr.wy-pager td .wy-spinner {
3763
3765
 
3764
3766
  .wy-message-editor .ͼ1.cm-editor .cm-content,
3765
3767
  .wy-message-editor-textcontent {
3766
- font-family: var(--wy-font-family);
3768
+ font-family: var(--wy-font-family),  inherit;
3767
3769
  font-size: var(--wy-font-size-base);
3768
3770
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
3769
3771
  }
@@ -4556,7 +4558,7 @@ tr.wy-pager td .wy-spinner {
4556
4558
 
4557
4559
  .wy-comment-editor .ͼ1.cm-editor .cm-content,
4558
4560
  .wy-comment-editor-textcontent {
4559
- font-family: var(--wy-font-family);
4561
+ font-family: var(--wy-font-family), inherit;
4560
4562
  font-size: var(--wy-font-size-base);
4561
4563
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
4562
4564
  }
@@ -4995,7 +4997,7 @@ tr.wy-pager td .wy-spinner {
4995
4997
 
4996
4998
  .wy-post-editor .ͼ1.cm-editor .cm-content,
4997
4999
  .wy-post-editor-textcontent {
4998
- font-family: var(--wy-font-family);
5000
+ font-family: var(--wy-font-family), inherit;
4999
5001
  font-size: var(--wy-font-size-base);
5000
5002
  padding: var(--wy-input-padding-y) var(--wy-input-padding-x);
5001
5003
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@weavy/uikit-react",
3
- "version": "16.0.0",
3
+ "version": "16.0.2",
4
4
  "author": "Weavy",
5
5
  "description": "React UI-kit for Weavy",
6
6
  "homepage": "https://github.com/weavy/weavy-uikit-react",
@@ -38,7 +38,6 @@
38
38
  flex: 0 0 vars.$appbar-height;
39
39
  grid-template-columns: minmax(2.5rem, max-content) minmax(0, max-content) minmax(2.5rem, max-content);
40
40
  column-gap: .5rem;
41
- //font-family: vars.$font-family-base;
42
41
  line-height: vars.$line-height-base;
43
42
 
44
43
  background-color: var(--wy-component-background-color);
@@ -113,7 +112,6 @@
113
112
  padding: .25rem;
114
113
  flex: 1 0 vars.$appbar-height;
115
114
  column-gap: .25rem;
116
- //font-family: vars.$font-family-base;
117
115
  line-height: vars.$line-height-base;
118
116
 
119
117
  background-color: var(--wy-component-background-color);
@@ -41,6 +41,8 @@
41
41
  position: absolute;
42
42
  width: 100%;
43
43
  height: 100%;
44
+ top: 0;
45
+ left: 0;
44
46
  border-radius: inherit;
45
47
  background-color: var(--wy-presence-active);
46
48
  background-clip: content-box;
@@ -5,7 +5,7 @@
5
5
  :where(:root, :host > *) {
6
6
  --wy-btn-padding-x: 1.5rem;
7
7
  --wy-btn-padding-y: .5rem;
8
- --wy-btn-font-family: var(--wy-font-family);
8
+ --wy-btn-font-family: #{vars.$font-family-base};
9
9
  --wy-btn-font-size: #{vars.$font-size-base};
10
10
  --wy-btn-font-weight: #{vars.$font-weight-normal};
11
11
  --wy-btn-line-height: #{vars.$line-height-base};
@@ -23,7 +23,7 @@
23
23
  background: var(--wy-component-background-color, transparent);
24
24
 
25
25
  padding: var(--wy-btn-padding-y) var(--wy-btn-padding-x);
26
- font-family: var(--wy-btn-font-family);
26
+ font-family: var(--wy-btn-font-family), inherit;
27
27
  font-size: var(--wy-btn-font-size);
28
28
  font-weight: var(--wy-btn-font-weight);
29
29
  line-height: var(--wy-btn-line-height);
@@ -102,7 +102,7 @@
102
102
 
103
103
  %comment-editor-textcontent,
104
104
  .wy-comment-editor-textcontent {
105
- font-family: vars.$font-family-base;
105
+ font-family: #{vars.$font-family-base}, inherit;
106
106
  font-size: vars.$font-size-base;
107
107
  padding: vars.$input-padding-y vars.$input-padding-x;
108
108
  }
@@ -91,7 +91,7 @@ $dropdown-item-padding-x: 1rem;
91
91
  width: 100%; // For `<button>`s
92
92
  padding: $dropdown-item-padding-y $dropdown-item-padding-x;
93
93
  clear: both;
94
- font-family: inherit;
94
+ font-family: var(--wy-font-family), inherit;
95
95
  font-size: inherit;
96
96
  font-weight: vars.$font-weight-normal;
97
97
  line-height: 1;
@@ -10,7 +10,7 @@
10
10
  display: block;
11
11
  width: 100%;
12
12
  padding: vars.$input-padding-y vars.$input-padding-x;
13
- font-family: var(--wy-font-family);
13
+ font-family: #{vars.$font-family-base}, inherit;
14
14
  font-size: vars.$input-font-size;
15
15
  font-weight: vars.$input-font-weight;
16
16
  line-height: vars.$input-line-height;
@@ -109,7 +109,7 @@
109
109
 
110
110
  %message-editor-textcontent,
111
111
  .wy-message-editor-textcontent {
112
- font-family: vars.$font-family-base;
112
+ font-family: #{vars.$font-family-base}, inherit;
113
113
  font-size: vars.$font-size-base;
114
114
  padding: vars.$input-padding-y vars.$input-padding-x;
115
115
  }
@@ -79,7 +79,7 @@
79
79
  justify-content: center;
80
80
  transition: opacity .1s step-end;
81
81
  transition-delay: .2s;
82
- font-family: inherit;
82
+ font-family: #{vars.$font-family-base}, inherit;
83
83
  line-height: vars.$line-height-base;
84
84
  font-weight: vars.$font-weight-base;
85
85
 
@@ -100,7 +100,7 @@
100
100
 
101
101
  %post-editor-textcontent,
102
102
  .wy-post-editor-textcontent {
103
- font-family: vars.$font-family-base;
103
+ font-family: #{vars.$font-family-base}, inherit;
104
104
  font-size: vars.$font-size-base;
105
105
  padding: vars.$input-padding-y vars.$input-padding-x;
106
106
  }
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  .wy-tab-label {
66
- font-family: var(--wy-btn-font-family);
66
+ font-family: var(--wy-btn-font-family), inherit;
67
67
  line-height: var(--wy-btn-line-height);
68
68
 
69
69
  font-size: vars.$font-size-xs;
@@ -191,7 +191,7 @@ $shadow: $black;
191
191
  --wy-gray: var(--wy-gray-light);
192
192
  }
193
193
 
194
- :where(.wy-dark) {
194
+ :where(.wy-dark:not(.wy-light)) {
195
195
  // dark mode
196
196
  color-scheme: dark;
197
197