fix: 修复右侧边栏由于滚动条引起的布局抖动问题

Author: FreecellRaid

src/assets/styles/style.css

@@ -193,6 +193,8 @@ body,
 
 /* 通用面板顶栏按钮 */
 .panel-header-action-button {
+    width: 24px;
+    height: 24px;
     background: none;
     border: none;
     border-radius: 4px;
@@ -254,7 +256,7 @@ body,
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 0 20px;
+    padding: 0 10px 0 20px;
     border-bottom: 1px solid var(--border-color);
     background-color: var(--bg-topbar);
     z-index: 2;

src/components/layout/SidebarRight.vue

@@ -248,11 +248,11 @@ function updateField(
 }
 
 .inspector-content {
-    /*为了给滚动条留空间，保证对齐*/
     margin-left: 10px;
     flex: 1;
     min-height: 0;
     overflow-y: auto;
+    scrollbar-gutter: stable;
     padding: 12px 0px;
 }
 
@@ -261,6 +261,7 @@ function updateField(
     border: 1px solid var(--border-color);
     margin-bottom: 16px;
     background-color: var(--bg-workspace);
+    box-sizing: border-box;
 }
 
 .card-header {
@@ -274,7 +275,7 @@ function updateField(
 .property-grid {
     padding: 10px;
     display: grid;
-    grid-template-columns: 115px 115px;
+    grid-template-columns: repeat(2, 1fr);
     gap: 8px;
 }