diff --git a/src/components/collapse/style.scss b/src/components/collapse/style.scss
index e3792d43e..488485ff9 100644
--- a/src/components/collapse/style.scss
+++ b/src/components/collapse/style.scss
@@ -56,13 +56,8 @@ $collapse__extra: #{$collapse}__extra;
opacity: 0;
#{$actionBar}__label.codicon {
- color: var(--activityBar-inactiveForeground);
height: inherit;
line-height: inherit;
-
- &:hover {
- color: var(--activityBar-activeBorder);
- }
}
}
diff --git a/src/components/tree/style.scss b/src/components/tree/style.scss
index 056b544b1..2c1c12928 100644
--- a/src/components/tree/style.scss
+++ b/src/components/tree/style.scss
@@ -33,6 +33,7 @@ $switch: #{$rcTree}-switcher;
margin: 0;
padding: 0 0 0 18px;
}
+
span#{$switch} {
background-attachment: scroll;
background-color: transparent;
@@ -65,11 +66,6 @@ $switch: #{$rcTree}-switcher;
cursor: not-allowed;
}
}
-
- &-selected {
- background: var(--list-activeSelectionBackground);
- border-color: var(--list-focusOutline);
- }
}
&-node-content-wrapper {
diff --git a/src/extensions/theme-defaults/themes/dark_defaults.json b/src/extensions/theme-defaults/themes/dark_defaults.json
index 15c94f825..d653cf9d4 100644
--- a/src/extensions/theme-defaults/themes/dark_defaults.json
+++ b/src/extensions/theme-defaults/themes/dark_defaults.json
@@ -27,12 +27,18 @@
"inputValidation.errorBackground": "#5A1D1D",
"inputValidation.errorBorder": "#BE1100",
"icon.foreground": "#C5C5C5",
+ "problemsWarningIcon.foreground": "#CCA700",
+ "problemsErrorIcon.foreground": "#F48771",
+ "problemsInfoIcon.foreground": "#75BEFF",
"settings.textInputBackground": "#292929",
"settings.numberInputBackground": "#292929",
"menu.background": "#252526",
"menu.foreground": "#CCCCCC",
"menu.selectionBackground": "#094771",
"menu.separatorBackground": "#BBBBBB",
+ "minimapSlider.background": "#79797980",
+ "minimapSlider.hoverBackground": "#64646480",
+ "minimapSlider.activeBackground": "#bfbfbf66",
"statusBarItem.remoteForeground": "#FFF",
"statusBarItem.remoteBackground": "#16825D",
"sidebarSectionHeader.background": "#0000",
diff --git a/src/extensions/theme-defaults/themes/light_defaults.json b/src/extensions/theme-defaults/themes/light_defaults.json
index a351f99ce..e0812d6d0 100644
--- a/src/extensions/theme-defaults/themes/light_defaults.json
+++ b/src/extensions/theme-defaults/themes/light_defaults.json
@@ -27,6 +27,9 @@
"inputValidation.errorBackground": "#F2DEDE",
"inputValidation.errorBorder": "#BE1100",
"icon.foreground": "#424242",
+ "problemsWarningIcon.foreground": "#BF8803",
+ "problemsErrorIcon.foreground": "#E51400",
+ "problemsInfoIcon.foreground": "#75BEFF",
"searchEditor.textInputBorder": "#CECECE",
"diffEditor.insertedTextBackground": "#9bb95533",
"diffEditor.removedTextBackground": "#ff000033",
@@ -39,6 +42,9 @@
"tab.border": "#f3f3f3",
"menu.selectionBackground": "#0060C0",
"menu.separatorBackground": "#888888",
+ "minimapSlider.background": "#64646480",
+ "minimapSlider.hoverBackground": "#64646480",
+ "minimapSlider.activeBackground": "#00000099",
"tab.inactiveBackground": "rgb(236, 236, 236)",
"tab.inactiveForeground": "rgba(51, 51, 51, 0.7)",
"tab.activeBackground": "#fffffe",
diff --git a/src/style/theme/tree.scss b/src/style/theme/tree.scss
index 6ddfeadc1..87a93ff08 100644
--- a/src/style/theme/tree.scss
+++ b/src/style/theme/tree.scss
@@ -29,11 +29,16 @@
}
.rc-tree-treenode-selected {
- background: var(--button-background);
+ background: var(--list-activeSelectionBackground);
+ border-color: var(--list-focusOutline);
.rc-tree-node-content-wrapper {
color: var(--list-activeSelectionForeground);
}
+
+ .rc-tree-switcher {
+ color: var(--list-activeSelectionForeground);
+ }
}
input {
diff --git a/src/workbench/editor/style.scss b/src/workbench/editor/style.scss
index a12a6e3f8..45fac91bc 100644
--- a/src/workbench/editor/style.scss
+++ b/src/workbench/editor/style.scss
@@ -42,10 +42,6 @@
justify-content: center;
padding: 0 8px 0 4px;
- &:not(#{$editor}__group-actions-item--disabled):hover {
- color: var(--activityBar-activeBorder);
- }
-
&--disabled {
cursor: default;
opacity: 0.4;
diff --git a/src/workbench/problems/paneView/index.tsx b/src/workbench/problems/paneView/index.tsx
index 9707c1683..e4a610883 100644
--- a/src/workbench/problems/paneView/index.tsx
+++ b/src/workbench/problems/paneView/index.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
import { getBEMElement, prefixClaName } from 'mo/common/className';
import TreeView from 'mo/components/tree';
import { localize } from 'mo/i18n/localize';
-import { Scrollable } from 'mo/components';
+import { Icon, Scrollable } from 'mo/components';
+import { IProblems, MarkerSeverity } from 'mo/model';
const defaultClassName = prefixClaName('problems');
const treeClassName = getBEMElement(defaultClassName, 'treeview');
@@ -11,9 +12,9 @@ const treeNodeBadgeClassName = getBEMElement(treeNodeClassName, 'badge');
const treeLeafClassName = getBEMElement(treeClassName, 'treeLeaf');
const treeLeafSubInfoClassName = getBEMElement(treeLeafClassName, 'subInfo');
-function ProblemsPaneView(props: any) {
+function ProblemsPaneView(props: IProblems) {
const { data } = props;
- if (!data?.length)
+ if (!data?.length) {
return (
{localize(
@@ -22,6 +23,24 @@ function ProblemsPaneView(props: any) {
)}
);
+ }
+
+ const getIcon = (status: number) => {
+ switch (status) {
+ case MarkerSeverity.Error: {
+ return ;
+ }
+ case MarkerSeverity.Warning: {
+ return ;
+ }
+ case MarkerSeverity.Info: {
+ return ;
+ }
+ default: {
+ return '';
+ }
+ }
+ };
return (
@@ -39,7 +58,8 @@ function ProblemsPaneView(props: any) {
) : (
- {value.message}
+ {getIcon(value.status)}
+ {value.message}
{value.code}
diff --git a/src/workbench/problems/style.scss b/src/workbench/problems/style.scss
index dfc6843a3..9f5bc7e79 100644
--- a/src/workbench/problems/style.scss
+++ b/src/workbench/problems/style.scss
@@ -1,6 +1,6 @@
@import 'mo/style/common';
-$badge-size: 18px;
+$badge-size: 11px;
#{$problems} {
margin: 0 18px;
@@ -12,21 +12,46 @@ $badge-size: 18px;
&__badge {
background: var(--badge-background);
- border-radius: 50%;
+ border-radius: $badge-size;
+ box-sizing: border-box;
color: var(--badge-foreground);
display: inline-block;
- height: $badge-size;
+ font-size: $badge-size;
+ font-weight: 400;
line-height: $badge-size;
margin-left: 10px;
+ min-height: 18px;
+ min-width: 18px;
+ padding: 3px 6px;
text-align: center;
- width: $badge-size;
+ }
+ }
+
+ #{$rcTree}-treenode:not(#{$rcTree}-treenode-selected) {
+ .codicon-info {
+ color: var(--problemsInfoIcon-foreground);
+ }
+
+ .codicon-warning {
+ color: var(--problemsWarningIcon-foreground);
+ }
+
+ .codicon-error {
+ color: var(--problemsErrorIcon-foreground);
}
}
&__treeLeaf {
+ align-items: center;
+ display: flex;
+
+ .codicon {
+ margin-right: 6px;
+ }
+
&__subInfo {
- color: var(--activityBar-inactiveForeground);
- margin-left: 5px;
+ margin-left: 6px;
+ opacity: 0.7;
}
}
}
diff --git a/stories/extensions/problems/index.tsx b/stories/extensions/problems/index.tsx
index 5378fe6c3..95cfb0900 100644
--- a/stories/extensions/problems/index.tsx
+++ b/stories/extensions/problems/index.tsx
@@ -26,6 +26,34 @@ function init() {
startColumn: 1,
endLineNumber: 0,
endColumn: 1,
+ status: 8,
+ },
+ children: [],
+ },
+ {
+ id: 4,
+ name: '0-1',
+ value: {
+ code: 'endLineNumber',
+ message: '解析可能会存在问题',
+ startLineNumber: 0,
+ startColumn: 1,
+ endLineNumber: 0,
+ endColumn: 1,
+ status: 4,
+ },
+ children: [],
+ },
+ {
+ id: 5,
+ name: '0-1',
+ value: {
+ code: 'endLineNumber',
+ message: '住在山里，真不戳',
+ startLineNumber: 0,
+ startColumn: 1,
+ endLineNumber: 0,
+ endColumn: 1,
status: 2,
},
children: [],