diff --git a/querybook/webapp/components/QueryEditor/QueryEditor.scss b/querybook/webapp/components/QueryEditor/QueryEditor.scss index c1e5bf669..16dae078b 100644 --- a/querybook/webapp/components/QueryEditor/QueryEditor.scss +++ b/querybook/webapp/components/QueryEditor/QueryEditor.scss @@ -43,6 +43,7 @@ .cm-gutters { background-color: var(--bg-query-editor-gutter); + border-right: none; } .cm-content { @@ -142,7 +143,8 @@ z-index: inherit; &.cm-panels-bottom { - border-top-width: 1px; + border-top: none; + box-shadow: var(--box-shadow); } .cm-panel { diff --git a/querybook/webapp/components/QueryEditor/QueryEditor.tsx b/querybook/webapp/components/QueryEditor/QueryEditor.tsx index 2d45bbb33..df4c9a2a4 100644 --- a/querybook/webapp/components/QueryEditor/QueryEditor.tsx +++ b/querybook/webapp/components/QueryEditor/QueryEditor.tsx @@ -354,8 +354,8 @@ export const QueryEditor: React.FC< [onSelection] ); - const extensions = useMemo(() => { - return [ + const extensions = useMemo( + () => [ sql({ upperCaseKeywords: true, }), @@ -369,18 +369,19 @@ export const QueryEditor: React.FC< optionsExtension, searchExtension, selectionExtension, - ]; - }, [ - keyMapExtention, - statusBarExtension, - eventsExtension, - lintExtension, - autoCompleteExtension, - hoverTooltipExtension, - optionsExtension, - searchExtension, - selectionExtension, - ]); + ], + [ + keyMapExtention, + statusBarExtension, + eventsExtension, + lintExtension, + autoCompleteExtension, + hoverTooltipExtension, + optionsExtension, + searchExtension, + selectionExtension, + ] + ); const basicSetup = useMemo( () => ({