diff --git a/frontend/src/assets/style.css b/frontend/src/assets/style.css index 32f2ec8..e5c0c93 100644 --- a/frontend/src/assets/style.css +++ b/frontend/src/assets/style.css @@ -200,6 +200,11 @@ a:focus-visible { justify-content: flex-start; } +.button-row button { + flex: 1; + min-width: 0; +} + .surface { background: var(--color-surface); border: 1px solid var(--color-border); @@ -678,15 +683,8 @@ th { } } -/* Mobile portrait (touch) or very narrow screens: stack buttons */ +/* Mobile portrait (touch) or very narrow screens */ @media (max-width: 500px) and (orientation: portrait) and (pointer: coarse), (max-width: 350px) { - button { - width: 100%; - } - - .button-row { - flex-direction: column; - } } .dialog-backdrop { diff --git a/frontend/src/components/DeviceLinkView.vue b/frontend/src/components/DeviceLinkView.vue index 124760d..9b5e212 100644 --- a/frontend/src/components/DeviceLinkView.vue +++ b/frontend/src/components/DeviceLinkView.vue @@ -55,13 +55,8 @@ onMounted(async () => { justify-content: flex-start; } -@media (max-width: 720px) { - .button-row { - flex-direction: column; - } - - .button-row button { - width: 100%; - } +.button-row button { + flex: 1; + min-width: 0; } diff --git a/frontend/src/components/HostProfileView.vue b/frontend/src/components/HostProfileView.vue index 886176e..d2e98f8 100644 --- a/frontend/src/components/HostProfileView.vue +++ b/frontend/src/components/HostProfileView.vue @@ -130,11 +130,7 @@ const handleButtonRowKeydown = (event) => { .host-view { padding: 3rem 1.5rem 4rem; } .host-actions { display: flex; flex-direction: column; gap: 0.75rem; } .host-actions .button-row { gap: 0.75rem; flex-wrap: wrap; } -.host-actions .button-row button { flex: 0 0 auto; } +.host-actions .button-row button { flex: 1 1 0; } .note { margin: 0; color: var(--color-text-muted); } .empty-state { margin: 0; color: var(--color-text-muted); } -@media (max-width: 600px) { - .host-actions .button-row { flex-direction: column; } - .host-actions .button-row button { width: 100%; } -} diff --git a/frontend/src/components/SessionList.vue b/frontend/src/components/SessionList.vue index c1bc91b..d120a27 100644 --- a/frontend/src/components/SessionList.vue +++ b/frontend/src/components/SessionList.vue @@ -1,7 +1,7 @@