jyapayne/houserules
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style(ui): floor editor modal height at 85vh so empty state isn't flat

Browse source 
Both ModifierProfileEditor and LayoutEditor already capped at max-h-[95vh]
but had no min-height, so they collapsed to just their content when empty
(no modifiers yet, no profiles saved). That looks like a flat toolbar
strip floating over the board rather than a proper editor dialog.

Add min-h-[85vh] to both so the dialog commits to a reasonable stage
regardless of content, and the user immediately understands it's a
full editor modal.
This commit is contained in:
Joey Yakimowich-Payne 2026-04-19 16:52:08 -06:00
commit ce6b2c1816
No known key found for this signature in database
2 changed files with 2 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/chess/src/ui/LayoutEditor.tsx
View file

@ -269,7 +269,7 @@ export function LayoutEditor({
if (e.key === 'Escape') onClose();
}}
>
<div className="bg-white rounded-2xl shadow-2xl w-full max-w-6xl max-h-[95vh] overflow-hidden flex flex-col">
<div className="bg-white rounded-2xl shadow-2xl w-full max-w-6xl min-h-[85vh] max-h-[95vh] overflow-hidden flex flex-col">
{/* Header */}
<header className="flex items-center justify-between px-6 py-4 border-b border-neutral-200">
<div className="flex items-center gap-3">

2
packages/chess/src/ui/ModifierProfileEditor.tsx
View file

@ -197,7 +197,7 @@ export function ModifierProfileEditor({ isOpen, onClose }: Props) {
data-testid="modifier-editor-modal"
className="fixed inset-0 z-50 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4"
>
<div className="bg-white rounded-2xl shadow-2xl w-full max-w-6xl max-h-[95vh] overflow-hidden flex flex-col">
<div className="bg-white rounded-2xl shadow-2xl w-full max-w-6xl min-h-[85vh] max-h-[95vh] overflow-hidden flex flex-col">
{/* Header */}
<header className="flex items-center justify-between px-6 py-4 border-b border-neutral-200">
<div className="flex items-center gap-3 min-w-0 flex-wrap">