cms icon indicating copy to clipboard operation
cms copied to clipboard

[6.x] Improve date UI bits

Open jackmcdade opened this issue 4 months ago • 1 comments

[!NOTE] Polishes DatePicker/DateRangePicker UI (standardized trigger/clear buttons and input spacing) and adds a new text size token plus numeric alignment in the index field.

  • UI Components
    • packages/ui/src/DatePicker/DatePicker.vue:
      • Standardize trigger and clear actions to Button (ghost/subtle) components; remove inline Icon usage.
      • Tweak container and input segment styling (alignment, spacing, colors); minor class cleanups.
    • packages/ui/src/DateRangePicker/DateRangePicker.vue:
      • Use Button for trigger and clear (subtle) actions; adjust trigger spacing.
      • Refine field layout: add items-center, text-md, tighter tracking, and reduce date segment padding (px-0.25).
  • Styles
    • packages/ui/src/ui.css: Add --text-md size and --font-sans variables; minor theme additions.
  • Control Panel
    • resources/js/components/fieldtypes/DateIndexFieldtype.vue: Add tabular-nums class for aligned numeric dates.

Written by Cursor Bugbot for commit 58156f0e100f10d18baa9494539b6e9be94b8570. This will update automatically on new commits. Configure here.

jackmcdade avatar Nov 17 '25 20:11 jackmcdade

Ah sorry I merged #13088 not realizing this was open, and now there's a conflict.

jasonvarga avatar Nov 18 '25 16:11 jasonvarga