From 7bca92bc0b5eeb32112f7c6f67e6a24c58ffd87f Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Wed, 13 May 2026 10:09:34 +0000
Subject: [PATCH] Stretch base currency dropdown to fill form width

Add grow class to base currency fgrp; add CSS rules so .cdd and its
trigger button fill 100% width when inside a grow container.

https://claude.ai/code/session_014uUwDBtG5y5FuWcy5zqVD1
---
 index.html | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 51a3da9..65d505f 100644
--- a/index.html
+++ b/index.html
@@ -67,6 +67,8 @@ textarea { resize: vertical; min-height: 48px; width: 100%; }
 
 /* Custom currency dropdown */
 .cdd { position: relative; display: inline-block; }
+.fgrp.grow .cdd { display: block; width: 100%; }
+.fgrp.grow .cdd-trigger { width: 100%; }
 .cdd-trigger { padding: 7px 10px; border: 1px solid var(--border); border-radius: 4px; background: #fff; cursor: pointer; font-size: 14px; font-family: inherit; text-align: left; min-width: 70px; }
 .cdd-trigger:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px rgba(26,58,92,.1); }
 .cdd-panel { display: none; position: absolute; top: calc(100% + 2px); left: 0; background: #fff; border: 1px solid var(--border); border-radius: 6px; box-shadow: 0 6px 20px rgba(0,0,0,.14); z-index: 100; min-width: 220px; max-height: 260px; overflow-y: auto; }
@@ -263,7 +265,7 @@ function render() {
     el('div', {className:'fgrp grow'}, [el('label', null, 'Staff'), staffInput]),
     el('div', {className:'fgrp'}, [el('label', null, 'Period from'), fromInput]),
     el('div', {className:'fgrp'}, [el('label', null, 'to'), toInput]),
-    el('div', {className:'fgrp'}, [el('label', null, 'Base currency'), baseCurDD]),
+    el('div', {className:'fgrp grow'}, [el('label', null, 'Base currency'), baseCurDD]),
   ]));
 
   wrap.appendChild(el('hr', {className:'divider'}));