Feat: Add responsive workspace shell

This commit is contained in:
MangoPig
2026-06-17 10:52:14 +01:00
parent 5d86a5124b
commit 85bf971547
24 changed files with 1153 additions and 255 deletions

View File

@@ -1,6 +1,5 @@
.rail {
--rail-workspace-size: var(--control-size-lg);
--rail-action-size: var(--control-size-md);
position: relative;
z-index: 3;
flex: 1;
@@ -9,21 +8,19 @@
flex-direction: column;
align-items: center;
gap: var(--space-3);
padding: var(--space-3) var(--space-2) calc(var(--space-3) + var(--rail-dock-clearance, 8rem));
padding: var(--space-3) var(--space-2) calc(var(--space-3) + var(--rail-dock-clearance, var(--shell-dock-clearance)));
overflow: visible;
}
.railCollapsed {
--rail-workspace-size: calc(var(--control-size-md) + 0.1rem);
--rail-action-size: calc(var(--control-size-md) + 0.1rem);
justify-content: flex-start;
gap: 0;
padding-top: var(--space-4);
padding-inline: var(--space-1);
}
.topCluster,
.bottomCluster {
.topCluster {
width: 100%;
display: flex;
flex-direction: column;
@@ -31,11 +28,6 @@
gap: var(--space-2);
}
.bottomCluster {
margin-top: auto;
margin-bottom: var(--rail-bottom-offset, 0rem);
}
.topCluster {
gap: var(--space-3);
}
@@ -44,8 +36,7 @@
gap: var(--space-3);
}
.railCollapsed .topCluster,
.railCollapsed .bottomCluster {
.railCollapsed .topCluster {
align-items: center;
}
@@ -191,20 +182,3 @@
border-radius: var(--radius-md);
box-shadow: none;
}
.addButton {
width: var(--rail-action-size);
height: var(--rail-action-size);
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px dashed var(--color-border-strong);
border-radius: var(--radius-pill);
background: transparent;
color: var(--color-text-muted);
&:hover {
background: var(--color-surface-hover);
color: var(--color-text);
}
}