Refactoring sidebar panel padding to fix overflow problems with plugin (#1266)

Slight refactor to sidebar panel padding to prevent the outline getting
cut off textareas in plugin sidebar panel

Author: loiswells97

CHANGELOG.md

@@ -13,6 +13,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 ### Fixed
 
 - Styling design system components used in the web component (#1263)
+- Sidebar panel overflow for plugins (#1266)
 
 ## [0.33.0] - 2025-10-15
 

src/assets/stylesheets/Sidebar.scss

@@ -100,9 +100,7 @@
 .sidebar__panel {
   display: flex;
   flex-direction: column;
-  padding: $space-1;
-  padding-block-end: 0;
-  position: relative;
+  padding-block-start: $space-1;
   border-radius: 0 8px 8px 0;
   inline-size: inherit;
   background: var(--sidebar-panel-background);
@@ -122,12 +120,13 @@
   flex-direction: column;
   gap: $space-1;
   padding-block-end: $space-1;
+  padding-inline: $space-1;
   border-block-end: 1px solid var(--sidebar-border);
 }
 
 .sidebar__panel-content {
   flex: 1;
-  padding: $space-1 0;
+  padding: $space-1;
   overflow-y: auto;
   scrollbar-width: thin;
 }
@@ -139,6 +138,7 @@
   inline-size: -moz-available;
   inline-size: -webkit-stretch;
   inline-size: stretch;
+  padding-inline: $space-1;
   background-color: white;
   border-end-end-radius: 8px;
 }