fix(ui): stabilize sidebar and titlebar placement

Keep left RTL sidebars physically aligned with the default layout, swap titlebar actions with side-aware custom controls, and preserve usable titlebar space when the sidebar is visible.

Refs #17
This commit is contained in:
NimBold
2026-07-19 03:31:37 +03:30
parent 23878c2ef8
commit c427aa2f7a
3 changed files with 33 additions and 7 deletions
+21 -4
View File
@@ -1114,10 +1114,12 @@ html[data-list-density="relaxed"] {
.app-sidebar-shell--left .sidebar-nav-item {
direction: ltr;
text-align: left;
}
.app-sidebar-shell--right .sidebar-nav-item {
direction: rtl;
text-align: right;
}
html[dir="ltr"] .sidebar-nav-label {
@@ -1147,6 +1149,11 @@ html[data-list-density="relaxed"] {
transition: background-color 100ms ease;
}
.sidebar-nav-label {
flex: 1 1 auto;
min-width: 0;
}
.sidebar-nav-item[data-active="true"] {
background: hsl(var(--accent-color)) !important;
color: white !important;
@@ -1654,6 +1661,11 @@ html[data-list-density="relaxed"] {
right: 22px;
}
.window-controls--right {
left: auto;
right: 22px;
}
.window-control {
width: 14px;
height: 14px;
@@ -1699,14 +1711,15 @@ html[data-list-density="relaxed"] {
height: 52px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 18px;
direction: ltr;
border-bottom: 1px solid hsl(var(--border-color));
background: hsl(var(--statusbar-bg));
}
.app-workspace--custom-window-controls .main-titlebar {
padding-left: 160px;
padding-right: 160px;
.app-workspace--sidebar-right .main-titlebar {
flex-direction: row-reverse;
}
.app-workspace--sidebar-collapsed .main-titlebar {
@@ -1735,7 +1748,7 @@ html[data-list-density="relaxed"] {
}
.main-control-group {
margin-inline-start: auto;
margin: 0;
height: 28px;
display: inline-flex;
align-items: center;
@@ -2434,6 +2447,10 @@ html[dir="rtl"] .sidebar-inner .mr-3 {
-2px 0 10px hsl(0 0% 0% / 0.20);
}
.app-sidebar-shell--left .app-sidebar-panel {
direction: ltr;
}
.app-sidebar-shell--left .sidebar-toggle-button {
inset-inline-start: auto;
inset-inline-end: auto;