diff --git a/lib/bds/desktop/shell_live/index.html.heex b/lib/bds/desktop/shell_live/index.html.heex
index c8f8e73..721b822 100644
--- a/lib/bds/desktop/shell_live/index.html.heex
+++ b/lib/bds/desktop/shell_live/index.html.heex
@@ -339,6 +339,16 @@
<% end %>
+
<%= render_panel_body(assigns) %>
diff --git a/priv/ui/app.css b/priv/ui/app.css
index 1460b31..a5d05a0 100644
--- a/priv/ui/app.css
+++ b/priv/ui/app.css
@@ -766,6 +766,9 @@ button {
height: 35px;
display: flex;
align-items: center;
+ justify-content: space-between;
+ padding: 0 8px;
+ background-color: var(--vscode-sideBar-background);
border-bottom: 1px solid var(--vscode-panel-border);
}
@@ -787,6 +790,26 @@ button {
color: var(--vscode-tab-activeForeground);
}
+.panel-close {
+ background: transparent;
+ border: none;
+ color: var(--vscode-descriptionForeground);
+ font-size: 18px;
+ width: 24px;
+ height: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ border-radius: 4px;
+ padding: 0;
+}
+
+.panel-close:hover {
+ background-color: var(--vscode-list-hoverBackground);
+ color: var(--vscode-editor-foreground);
+}
+
.panel-content {
flex: 1;
overflow: auto;
diff --git a/test/bds/desktop/shell_live_test.exs b/test/bds/desktop/shell_live_test.exs
index ffa4dbf..fc1f670 100644
--- a/test/bds/desktop/shell_live_test.exs
+++ b/test/bds/desktop/shell_live_test.exs
@@ -54,6 +54,14 @@ defmodule BDS.Desktop.ShellLiveTest do
assert html =~ ~s(data-region="panel")
refute html =~ ~s(class="panel-shell is-hidden")
+ assert html =~ ~s(data-testid="panel-close")
+
+ html =
+ view
+ |> element("[data-testid='panel-close']")
+ |> render_click()
+
+ assert html =~ ~s(class="panel-shell is-hidden")
html =
view