Skip to content

Instantly share code, notes, and snippets.

@vladstudio
Last active October 4, 2024 10:54
Show Gist options
  • Save vladstudio/26e129a7c21139f69ef655d73a945af8 to your computer and use it in GitHub Desktop.
Save vladstudio/26e129a7c21139f69ef655d73a945af8 to your computer and use it in GitHub Desktop.
VSCode: move status bar on top
#!/bin/bash
# - download this file
# - make it executable:
# chmod +x vscode-statusbar-on-top.sh
# - find workbench.desktop.main.css inside your VSCode instance;
# - copy its path here:
css_path="/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/workbench.desktop.main.css"
# run this file after every VSCode update.
# (do not edit below)
hack=".monaco-workbench
> .monaco-grid-view
> .monaco-grid-branch-node
> .monaco-split-view2
> .monaco-scrollable-element
> .split-view-container {
display: flex !important;
flex-direction: column !important;
}
.monaco-workbench
> .monaco-grid-view
> .monaco-grid-branch-node
> .monaco-split-view2
> .monaco-scrollable-element
> .split-view-container
> .split-view-view.visible {
top: auto !important;
position: relative !important;
}
.monaco-workbench
> .monaco-grid-view
> .monaco-grid-branch-node
> .monaco-split-view2
> .monaco-scrollable-element
> .split-view-container
> .split-view-view.visible:last-child {
top: auto !important;
position: relative !important;
order: -1 !important;
}
.monaco-workbench .part.statusbar {
border-bottom: 1px solid var(--vscode-sideBar-border);
}"
description="/* Move status bar to top */"
if [[ ! -f "$css_path" ]]; then
echo "File does not exist at $css_path. Aborting."
exit 1
fi
if ! grep -qF "$description" "$css_path"; then
{
echo ""
echo "$description"
echo ""
echo "$hack"
} >> "$css_path"
echo "Your VSCode statusbar it now on top! Restart VSCode to apply changes."
else
echo "Looks like this hack has been applied already. Aborting."
exit 1
fi
@vladstudio
Copy link
Author

Before:

vscode-statusbar-on-top-before

After:

vscode-statusbar-on-top-after

@vladstudio
Copy link
Author

theme used in screenshots: https://tiniri.vlad.studio/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment