xeno/Portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: give the motion tile a reserved slot outside the bay

Browse Source
This commit is contained in:
LucaP
2026-10-11 01:18:04 +03:00
parent 40d863569f
commit 38f680f16a
2 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/DriveControls.vue
View File

@@ -260,7 +260,7 @@ onBeforeUnmount(() => {
<button
v-if="action && action.event !== 'pause'"
class="drive-control-button"
class="drive-control-button drive-controls__action"
type="button"
:aria-label="action.label"
:title="action.label"

12
src/styles/gantry.css
View File

@@ -509,6 +509,12 @@ html .drive-controls {
max-inline-size: none;
gap: 0;
}
/* Resume / Enable motion has a reserved slot outside the bay's flow: it
hangs to the left of the tiles, so they never shift when it appears. */
html .drive-controls__action {
position: absolute;
inset: 0 100% auto auto;
}
html .drive-controls__dock {
padding: 0;
gap: 0;
@@ -709,6 +715,12 @@ html .drive-controls__audio-status {
letter-spacing: 0;
}
html .site-navigation details[open] summary[data-exit]::after { content: '\2212' / ''; }
/* No room beside the window on a phone: the motion tile hangs below the
settings tile instead, still outside the bay's flow. */
html .drive-controls__action {
inset: calc(100% + (var(--gantry-h) - 44px) / 2 + 6px) 0 auto auto;
background-color: var(--gantry-steel-2);
}
html .site-navigation ul {
inset: var(--gantry-h) 0 auto;
background: linear-gradient(180deg, var(--gantry-steel-1), var(--gantry-steel-2));