@sap-ux/ui-components 1.0.15 → 1.0.16

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.
@@ -64,13 +64,13 @@
64
64
  }
65
65
  }
66
66
  &--error {
67
- @include apply-combobox-error-border(var(--vscuie-inputValidation-errorBorder));
67
+ @include apply-combobox-error-border(var(--vscode-inputValidation-errorBorder));
68
68
  }
69
69
  &--warning {
70
- @include apply-combobox-error-border(var(--vscuie-inputValidation-warningBorder));
70
+ @include apply-combobox-error-border(var(--vscode-inputValidation-warningBorder));
71
71
  }
72
72
  &--info {
73
- @include apply-combobox-error-border(var(--vscuie-inputValidation-infoBorder));
73
+ @include apply-combobox-error-border(var(--vscode-inputValidation-infoBorder));
74
74
  }
75
75
  }
76
76
 
@@ -19,7 +19,7 @@ function getUIcontextualMenuStyles() {
19
19
  return {
20
20
  root: {
21
21
  minWidth: 190,
22
- background: 'var(--vscuie-input-background)',
22
+ background: 'var(--vscode-input-background)',
23
23
  border: 0
24
24
  }
25
25
  };
@@ -44,7 +44,7 @@ function getUIContextualMenuItemStyles() {
44
44
  marginRight: 6
45
45
  },
46
46
  label: {
47
- fontFamily: 'var(--vscuie-font-family)',
47
+ fontFamily: 'var(--vscode-font-family)',
48
48
  lineHeight: 18,
49
49
  height: 18
50
50
  },
@@ -1,9 +1,9 @@
1
1
  @import '../../styles/_variables.scss';
2
2
  @import '../../styles/_mixins.scss';
3
3
 
4
- $menu-background: var(--vscode-menu-background, var(--vscuie-input-background));
4
+ $menu-background: var(--vscode-menu-background, var(--vscode-input-background));
5
5
  $menu-color: var(--vscode-editorSuggestWidget-foreground);
6
- $menu-border-color: var(--vscuie-focusBorder);
6
+ $menu-border-color: var(--vscode-focusBorder);
7
7
 
8
8
  $menu-item-height: 22px;
9
9
  $menu-item-horizontal-padding: 8px;
@@ -61,13 +61,13 @@
61
61
  }
62
62
  }
63
63
  &--error {
64
- @include apply-dropdown-error-border(var(--vscuie-inputValidation-errorBorder));
64
+ @include apply-dropdown-error-border(var(--vscode-inputValidation-errorBorder));
65
65
  }
66
66
  &--warning {
67
- @include apply-dropdown-error-border(var(--vscuie-inputValidation-warningBorder));
67
+ @include apply-dropdown-error-border(var(--vscode-inputValidation-warningBorder));
68
68
  }
69
69
  &--info {
70
- @include apply-dropdown-error-border(var(--vscuie-inputValidation-infoBorder));
70
+ @include apply-dropdown-error-border(var(--vscode-inputValidation-infoBorder));
71
71
  }
72
72
  }
73
73
 
@@ -76,12 +76,12 @@ $readonly-labels-opacity: 0.4;
76
76
  background: var(--vscode-editor-background);
77
77
  }
78
78
  &.odd {
79
- background: var(--vscuie-sideBar-background);
79
+ background: var(--vscode-sideBar-background);
80
80
  }
81
81
  // Reverse background for zebra pattern
82
82
  &.reverse-background {
83
83
  &.even {
84
- background: var(--vscuie-sideBar-background);
84
+ background: var(--vscode-sideBar-background);
85
85
  }
86
86
  &.odd {
87
87
  background: var(--vscode-editor-background);
@@ -1,3 +1,3 @@
1
1
  .ts-icon {
2
- fill: var(--vscuie-foreground);
2
+ fill: var(--vscode-foreground);
3
3
  }
@@ -73,7 +73,7 @@ class UIList extends react_1.default.Component {
73
73
  fontWeight: 'normal',
74
74
  paddingLeft: 0,
75
75
  height: 20,
76
- color: 'var(--vscuie-settings-textInputForeground)'
76
+ color: 'var(--vscode-settings-textInputForeground)'
77
77
  }
78
78
  }
79
79
  });
@@ -8,7 +8,7 @@
8
8
  &__header {
9
9
  > div {
10
10
  flex: 0 1 auto;
11
- background: var(--vscuie-sideBarSectionHeader-background);
11
+ background: var(--vscode-sideBarSectionHeader-background);
12
12
  min-height: 40px;
13
13
  display: flex;
14
14
  align-items: center;
@@ -16,7 +16,7 @@
16
16
  white-space: nowrap;
17
17
  overflow: hidden;
18
18
  text-overflow: ellipsis;
19
- color: var(--vscuie-sideBarTitle-foreground);
19
+ color: var(--vscode-sideBarTitle-foreground);
20
20
  }
21
21
 
22
22
  &__title {
@@ -57,7 +57,7 @@
57
57
 
58
58
  &--extended {
59
59
  .section__header {
60
- background-color: var(--vscuie-sideBar-background);
60
+ background-color: var(--vscode-sideBar-background);
61
61
  }
62
62
  }
63
63
 
@@ -13,10 +13,10 @@
13
13
 
14
14
  $splitter-contrast-border: 1px solid var(--vscode-contrastBorder);
15
15
  $splitter-hover-contrast-border: 1px dashed var(--vscode-contrastActiveBorder);
16
- $splitter-focus-border: 1px solid var(--vscuie-focusBorder);
16
+ $splitter-focus-border: 1px solid var(--vscode-focusBorder);
17
17
 
18
18
  .splitter {
19
- background-color: var(--vscuie-splitter-background);
19
+ background-color: var(--vscode-splitter-background);
20
20
  position: absolute;
21
21
  outline: none;
22
22
 
@@ -10,8 +10,8 @@
10
10
  }
11
11
 
12
12
  &__content {
13
- border-bottom: 1px solid var(--vscode-contrastBorder, var(--vscuie-editorIndentGuide-background));
14
- background-color: var(--vscuie-editor-background);
13
+ border-bottom: 1px solid var(--vscode-contrastBorder, var(--vscode-editorIndentGuide-background));
14
+ background-color: var(--vscode-editor-background);
15
15
  display: flex;
16
16
  flex-wrap: wrap;
17
17
  min-width: 400px;
@@ -21,7 +21,7 @@
21
21
  display: inline-block;
22
22
  height: 20px;
23
23
  margin: 3px 10px 3px;
24
- border-right: 1px solid var(--vscode-contrastBorder, var(--vscuie-editorIndentGuide-background));
24
+ border-right: 1px solid var(--vscode-contrastBorder, var(--vscode-editorIndentGuide-background));
25
25
  }
26
26
 
27
27
  &__column {
@@ -34,7 +34,7 @@
34
34
  border: 1px solid $dropdown-input-focus-border-color;
35
35
  }
36
36
  &-close {
37
- border: 1px solid var(--vscuie-editorWidget-border);
37
+ border: 1px solid var(--vscode-editorWidget-border);
38
38
  }
39
39
  }
40
40
  }
@@ -3,70 +3,70 @@
3
3
 
4
4
  // H1
5
5
  .ui-large-header {
6
- font-family: var(--vscuie-font-family);
6
+ font-family: var(--vscode-font-family);
7
7
  font-weight: bold;
8
8
  font-size: 24px;
9
9
  font-style: normal;
10
10
  line-height: 29px;
11
- color: var(--vscuie-settings-headerForeground);
11
+ color: var(--vscode-settings-headerForeground);
12
12
  }
13
13
 
14
14
  // H2
15
15
  .ui-medium-header {
16
- font-family: var(--vscuie-font-family);
16
+ font-family: var(--vscode-font-family);
17
17
  font-weight: bold;
18
18
  font-size: 14px;
19
19
  font-style: normal;
20
20
  line-height: 16px;
21
- color: var(--vscuie-settings-headerForeground);
21
+ color: var(--vscode-settings-headerForeground);
22
22
  }
23
23
 
24
24
  // H3
25
25
  .ui-small-header {
26
- font-family: var(--vscuie-font-family);
26
+ font-family: var(--vscode-font-family);
27
27
  font-weight: bold;
28
28
  font-size: 13px;
29
29
  font-style: normal;
30
30
  line-height: 15px;
31
- color: var(--vscuie-settings-textInputForeground);
31
+ color: var(--vscode-settings-textInputForeground);
32
32
  }
33
33
 
34
34
  // T1
35
35
  .ui-medium-text {
36
- font-family: var(--vscuie-font-family);
36
+ font-family: var(--vscode-font-family);
37
37
  font-weight: normal;
38
38
  font-size: 13px;
39
39
  font-style: normal;
40
40
  line-height: 18px;
41
- color: var(--vscuie-settings-textInputForeground);
41
+ color: var(--vscode-settings-textInputForeground);
42
42
  }
43
43
 
44
44
  // T2
45
45
  .ui-medium-italic-text {
46
- font-family: var(--vscuie-font-family);
46
+ font-family: var(--vscode-font-family);
47
47
  font-weight: normal;
48
48
  font-size: 13px;
49
49
  font-style: italic;
50
50
  line-height: 18px;
51
- color: var(--vscuie-settings-textInputForeground);
51
+ color: var(--vscode-settings-textInputForeground);
52
52
  }
53
53
 
54
54
  // T3
55
55
  .ui-small-text {
56
- font-family: var(--vscuie-font-family);
56
+ font-family: var(--vscode-font-family);
57
57
  font-weight: normal;
58
58
  font-size: 11px;
59
59
  font-style: normal;
60
60
  line-height: 15px;
61
- color: var(--vscuie-settings-textInputForeground);
61
+ color: var(--vscode-settings-textInputForeground);
62
62
  }
63
63
 
64
64
  // T4
65
65
  .ui-small-italic-text {
66
- font-family: var(--vscuie-font-family);
66
+ font-family: var(--vscode-font-family);
67
67
  font-weight: normal;
68
68
  font-size: 11px;
69
69
  font-style: italic;
70
70
  line-height: 15px;
71
- color: var(--vscuie-settings-textInputForeground);
71
+ color: var(--vscode-settings-textInputForeground);
72
72
  }
@@ -1,8 +1,8 @@
1
1
  // Typography
2
2
 
3
- $font-family-base: var(--vscuie-font-family);
4
- $font-size-base: var(--vscuie-font-size);
5
- $font-weight-base: var(--vscuie-font-weight);
3
+ $font-family-base: var(--vscode-font-family);
4
+ $font-size-base: var(--vscode-font-size);
5
+ $font-weight-base: var(--vscode-font-weight);
6
6
 
7
7
  $base-element-height: 26px;
8
8
  $button-font-size: $font-size-base;
@@ -10,10 +10,10 @@ $button-font-size: $font-size-base;
10
10
  // Dropdowns
11
11
  // colors
12
12
  $dropdown-input-height: $base-element-height;
13
- $dropdown-input-color: var(--vscuie-foreground);
14
- $dropdown-input-background: var(--vscuie-input-background);
15
- $dropdown-input-border-color: var(--vscuie-editorWidget-border);
16
- $dropdown-input-focus-border-color: var(--vscuie-focusBorder);
13
+ $dropdown-input-color: var(--vscode-foreground);
14
+ $dropdown-input-background: var(--vscode-input-background);
15
+ $dropdown-input-border-color: var(--vscode-editorWidget-border);
16
+ $dropdown-input-focus-border-color: var(--vscode-focusBorder);
17
17
  // misc
18
18
  $dropdown-input-border-radius: 0;
19
19
  $dropdown-input-expand-icon-size: 16px;
@@ -1,5 +1,3 @@
1
- @import 'color';
2
- @import 'theia_materialcolors';
3
1
  @import 'variables';
4
2
  @import 'typography';
5
3
  @import 'mixins';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sap-ux/ui-components",
3
- "version": "1.0.15",
3
+ "version": "1.0.16",
4
4
  "license": "Apache-2.0",
5
5
  "description": "SAP UI Components Library",
6
6
  "repository": {
@@ -345,7 +345,7 @@
345
345
  }
346
346
  body {
347
347
  color: var(--vscode-foreground) !important;
348
- font-family: var(--vscuie-font-family);
348
+ font-family: var(--vscode-font-family);
349
349
  background: var(--vscode-editor-background);
350
350
  }</style><script data-custom="SAP">window.addEventListener('message', (event) => {
351
351
  if (event.data.type === 'ts-refresh') {
@@ -377,4 +377,4 @@
377
377
 
378
378
 
379
379
 
380
- window['STORIES'] = [{"titlePrefix":"","directory":"./stories","files":"*.story.tsx","importPathMatcher":"^\\.[\\\\/](?:stories\\/(?!\\.)(?=.)[^/]*?\\.story\\.tsx)$"}];</script><script src="runtime~main.3e35adfa.iframe.bundle.js"></script><script src="93.546e1b61.iframe.bundle.js"></script><script src="main.d69c2f94.iframe.bundle.js"></script></body></html>
380
+ window['STORIES'] = [{"titlePrefix":"","directory":"./stories","files":"*.story.tsx","importPathMatcher":"^\\.[\\\\/](?:stories\\/(?!\\.)(?=.)[^/]*?\\.story\\.tsx)$"}];</script><script src="runtime~main.3e35adfa.iframe.bundle.js"></script><script src="93.546e1b61.iframe.bundle.js"></script><script src="main.560b7f8d.iframe.bundle.js"></script></body></html>
@@ -53,7 +53,7 @@
53
53
  border: 1px solid var(--vscode-editorWidget-border);
54
54
  }
55
55
  .search-field input:active {
56
- border: 1px solid var(--vscuie-focusBorder);
56
+ border: 1px solid var(--vscode-focusBorder);
57
57
  }
58
58
  .textColor {
59
59
  color: var(--vscode-foreground);