remove filter box

src/webviews/webview-side/data-explorer/reactSlickGridFilterBox.tsx

@@ -6,16 +6,6 @@ import { IIconProps, SearchBox } from '@fluentui/react';
 
 import './reactSlickGridFilterBox.css';
 
-const filterIcon: IIconProps = {
-    iconName: 'Filter',
-    styles: {
-        root: {
-            fontSize: 'var(--vscode-font-size)',
-            width: 'var(--vscode-font-size)',
-            color: 'var(--vscode-settings-textInputForeground)'
-        }
-    }
-};
 
 const styles = {
     iconContainer: {
@@ -42,23 +32,16 @@ interface IFilterProps {
 export class ReactSlickGridFilterBox extends React.Component<IFilterProps> {
     public override render() {
         return (
-            <SearchBox
-                iconProps={filterIcon}
+            <input
                 onChange={this.updateInputValue}
-                onClear={this.clearInputValue}
                 tabIndex={0}
-                ariaLabel={this.props.column.name}
+                aria-label={this.props.column.name}
                 className="filter-box"
-                styles={styles}
                 value={this.props.filter}
             />
         );
     }
 
-    private clearInputValue = () => {
-        this.props.onChange('', this.props.column);
-    };
-
     private updateInputValue = (
         _event?: React.ChangeEvent<HTMLInputElement> | undefined,
         newValue?: string | undefined

src/webviews/webview-side/interactive-common/common.css

@@ -10,8 +10,8 @@ html {
 }
 
 #main-panel {
-    background: var(--vscode-editor-background);
-    color: var(--vscode-editor-foreground);
+    background: rgb(49, 49, 93);
+    color: gray;
     display: grid;
     grid-template-rows: auto auto auto 1fr auto;
     grid-template-columns: 1fr;