Fix slot picker stretched and double scroll in Assign Spool modal

Narrowed CSS selector to only target max-w-2xl modals (Assign Spool)
  not max-w-sm ones (slot action picker). Removed inner max-h-96 on
  the spool grid to eliminate nested scrollbars.
This commit is contained in:
maziggy
2026-03-26 11:46:05 +01:00
parent e7c81e3f08
commit fa705102b4
4 changed files with 15 additions and 10 deletions
+12 -7
View File
@@ -394,31 +394,36 @@ body {
/* ============================================
SPOOLBUDDY KIOSK MODAL CONSTRAINTS
Cap modals to viewport on the small SpoolBuddy
touchscreen. Uses height (not max-height) so
flex children distribute space correctly.
Cap large modals (max-w-2xl) to viewport on the
small SpoolBuddy touchscreen. Excludes smaller
modals like the slot action picker (max-w-sm).
============================================ */
[data-spoolbuddy-kiosk] .fixed .relative.w-full {
[data-spoolbuddy-kiosk] .fixed .relative.max-w-2xl {
height: 90vh;
max-height: 90vh;
display: flex;
flex-direction: column;
}
[data-spoolbuddy-kiosk] .fixed .relative.w-full > div:first-child {
[data-spoolbuddy-kiosk] .fixed .relative.max-w-2xl > div:first-child {
flex-shrink: 0;
}
[data-spoolbuddy-kiosk] .fixed .relative.w-full > div:last-child {
[data-spoolbuddy-kiosk] .fixed .relative.max-w-2xl > div:last-child {
flex-shrink: 0;
}
[data-spoolbuddy-kiosk] .fixed .relative.w-full > div:nth-child(2) {
[data-spoolbuddy-kiosk] .fixed .relative.max-w-2xl > div:nth-child(2) {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
/* Remove inner spool grid max-height to avoid nested scrollbars */
[data-spoolbuddy-kiosk] .fixed .relative.max-w-2xl .max-h-96 {
max-height: none;
}
/* Calendar selected-day list scrollbar theming */
.calendar-scroll {
scrollbar-width: thin;
File diff suppressed because one or more lines are too long
+2 -2
View File
@@ -23,8 +23,8 @@
<!-- Splash screens for iOS -->
<link rel="apple-touch-startup-image" href="/img/android-chrome-512x512.png" />
<script type="module" crossorigin src="/assets/index-t28DJYDZ.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-eNQIpF4A.css">
<script type="module" crossorigin src="/assets/index-BMRHUkc1.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BXZVW--A.css">
</head>
<body>
<div id="root"></div>