Skip to content

Refine dark mode UX, menu layout, axis editor and plot download workflows#21

Open
afffe18 wants to merge 1 commit intocodex/2026-04-28_14-53-41-hide-create_all_data_frames-optionfrom
codex/2026-04-28_17-08-46-fix-dark-mode-inconsistencies
Open

Refine dark mode UX, menu layout, axis editor and plot download workflows#21
afffe18 wants to merge 1 commit intocodex/2026-04-28_14-53-41-hide-create_all_data_frames-optionfrom
codex/2026-04-28_17-08-46-fix-dark-mode-inconsistencies

Conversation

@afffe18
Copy link
Copy Markdown
Collaborator

@afffe18 afffe18 commented Apr 28, 2026

Motivation

  • Improve the UI/UX around dark/light mode and the JSON editor so the editor is readable in both themes.
  • Restructure the top menubar to group actions (menu, import/export/reset, config/json, preview/create) for easier access.
  • Make axis editing more ergonomic by moving name/label/mode to the left and putting axis columns on the right with an expand/collapse control.
  • Provide clearer plotting workflows by adding per-plot download buttons while keeping download-all behavior and surface database import status.

Description

  • Reworked the header/menu layout and grouped controls to match the requested structure; replaced some text labels with Preview one Plot / Create all Plots (changes in src/App.tsx).
  • Added an axis editor redesign so the left column contains name, label, mode and the right column shows axis columns with an expand/collapse button via an updated MultiSelectInput and per-axis expanded state (changes in src/App.tsx).
  • Added a per-dataframe database import status indicator that updates after successful imports and stores minimal per-dataframe status (changes in src/App.tsx).
  • Improved JSON editor overlay and caret styling so syntax overlay and caret use appropriate colors in dark and light themes (resolvedDarkMode logic and adjusted pre/textarea classes in src/App.tsx).
  • Added single-plot download buttons above each generated plot and preserved the existing “download all” and combined-HTML downloads (changes in src/components/PlotPage.tsx).
  • Expanded README with a concrete Docker run guide showing a two-container (frontend + backend) workflow, network, and verification steps (README.md).

Testing

  • Ran npm run lint and addressed lint warnings; npm run lint passed.
  • Built the production bundle with npm run build; build completed successfully.
  • No automated unit/test suites were modified; existing CI/test targets remain unchanged.

Codex Task

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant