Fix mobile UI issues: form text visibility, slide panel overlap, notes display
All checks were successful
Deploy / deploy (push) Successful in 2m38s
All checks were successful
Deploy / deploy (push) Successful in 2m38s
- Add CSS for all form fields (input, textarea, select) in dark mode with -webkit-text-fill-color for iOS Safari compatibility - Add padding-bottom to event detail panel so delete button is visible above bottom nav on mobile - Display notes field in ProductCollected and ProductSold event details 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -29,15 +29,24 @@ def TabStyles(): # noqa: N802
|
||||
|
||||
|
||||
def SelectStyles(): # noqa: N802
|
||||
"""CSS styles to fix select/option visibility in dark mode."""
|
||||
"""CSS styles to fix form field visibility in dark mode."""
|
||||
return Style("""
|
||||
/* Ensure select dropdowns and options are visible in dark mode */
|
||||
select, select option {
|
||||
background-color: #1c1c1c;
|
||||
color: #e5e5e5;
|
||||
/* Ensure all form fields are visible in dark mode */
|
||||
input, textarea, select,
|
||||
.uk-input, .uk-textarea, .uk-select {
|
||||
background-color: #1c1c1c !important;
|
||||
color: #e5e5e5 !important;
|
||||
-webkit-text-fill-color: #e5e5e5 !important;
|
||||
}
|
||||
/* UIkit select dropdown styling */
|
||||
.uk-select, .uk-select option {
|
||||
/* Placeholder text styling */
|
||||
input::placeholder, textarea::placeholder,
|
||||
.uk-input::placeholder, .uk-textarea::placeholder {
|
||||
color: #737373 !important;
|
||||
-webkit-text-fill-color: #737373 !important;
|
||||
opacity: 1;
|
||||
}
|
||||
/* Select dropdown options */
|
||||
select option, .uk-select option {
|
||||
background-color: #1c1c1c;
|
||||
color: #e5e5e5;
|
||||
}
|
||||
|
||||
@@ -77,7 +77,7 @@ def event_detail_panel(
|
||||
# Delete button (admin only, not for tombstoned events)
|
||||
delete_section(event.id) if user_role == UserRole.ADMIN and not is_tombstoned else None,
|
||||
id="event-panel-content",
|
||||
cls="bg-[#141413] h-full overflow-y-auto",
|
||||
cls="bg-[#141413] h-full overflow-y-auto pb-20 md:pb-0",
|
||||
)
|
||||
|
||||
|
||||
@@ -200,6 +200,8 @@ def render_payload_items(
|
||||
items.append(payload_item("Product", payload["product_code"]))
|
||||
if "quantity" in payload:
|
||||
items.append(payload_item("Quantity", str(payload["quantity"])))
|
||||
if payload.get("notes"):
|
||||
items.append(payload_item("Notes", payload["notes"]))
|
||||
|
||||
elif event_type == "AnimalOutcome":
|
||||
if "outcome" in payload:
|
||||
@@ -244,6 +246,8 @@ def render_payload_items(
|
||||
if "price_cents" in payload:
|
||||
price = payload["price_cents"] / 100
|
||||
items.append(payload_item("Price", f"${price:.2f}"))
|
||||
if payload.get("notes"):
|
||||
items.append(payload_item("Notes", payload["notes"]))
|
||||
|
||||
elif event_type == "HatchRecorded":
|
||||
if "clutch_size" in payload:
|
||||
|
||||
Reference in New Issue
Block a user