blakeridgway/turf-tasker
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Enhance UI/UX across multiple views with consistent styling and improved layout #3

Merged
ciphervance merged 6 commits from feat/calendar-view into main 2025-06-21 21:31:00 +00:00
Conversation 1 Commits 6 Files changed 16 +609 -60
ciphervance commented 2025-06-21 21:30:44 +00:00 (Migrated from gitlab.com)
Copy link

This commit introduces significant user interface and experience improvements across the Lawn Care Log, Calendar, and Lawn Tips sections, focusing on consistent button styling, improved layout, and clearer navigation.

Key Changes:

  • Lawn Care Event Models:

    • Added NotApplicable to MowingPattern enum with [Display(Name = "N/A")] for better logging flexibility.

  • Lawn Care Log (Views/LawnCareEvents/Index.cshtml):

    • Centered Page Title & Actions: Wrapped <h1> and primary action buttons (Create New Event, View Calendar) in a div with text-center for better alignment.
    • Improved Search Bar Layout: Encapsulated the search input and buttons in an input-group within a flex container (d-flex justify-content-end) with fixed width and auto margins, ensuring it's centered as a block but right-aligned internally.
    • Convert Table Actions to Buttons: Replaced "Edit | Details | Delete" links in the main log table with btn-sm btn-outline-primary/info/danger styled buttons, wrapped in d-flex flex-wrap gap-2 for consistent spacing and responsive behavior.
    • Renamed "Back to Full List" to "Reset Filter" for clarity and changed its style to btn-primary.

  • Lawn Care Calendar (Views/LawnCareEvents/Calendar.cshtml):

    • Centralized Title & Button: Implemented a flexbox container (d-flex justify-content-between align-items-center) for the calendar's page title and the "Create New Event" button, ensuring they are on the same line and properly spaced.
    • Restored JavaScript Integrity: Re-structured the top-level HTML to ensure the calendar's internal JavaScript (#prevMonth, #nextMonth, #currentMonthYear) remains unaffected by the page title/button layout changes.

  • Lawn Care Tips (Views/LawnCareTip/Index.cshtml):

    • Consolidated Actions: Converted "Edit | Details | Delete" links in the tips table into Bootstrap buttons (btn-sm btn-outline-primary/info/danger).
    • Improved Action Column Layout: Applied new .col-actions CSS to the action column (<th> and <td>) to give it a fixed width and use white-space: nowrap to prevent action buttons from wrapping.
    • Content Column Wrapping: Added .col-content CSS to the content column to limit its max-width and allow word-wrap.
    • Changed "Create New" to "Create New Tip" with btn-primary styling for consistency.
    • Removed Details Link from Tips: (Implied by diff) The Details link for LawnCareTip was removed from the table view, aligning with a common pattern where simple tip content might be fully displayed or only Edit/Delete actions are prioritized in the index.

  • Global Styling (wwwroot/css/site.css):

    • Added col-content and col-actions CSS classes to manage table column widths and wrapping behavior for cleaner table layouts.

These changes significantly improve the aesthetic consistency and usability of the application's main views.

This commit introduces significant user interface and experience improvements across the Lawn Care Log, Calendar, and Lawn Tips sections, focusing on consistent button styling, improved layout, and clearer navigation. **Key Changes:** * **Lawn Care Event Models:** * Added `NotApplicable` to `MowingPattern` enum with `[Display(Name = "N/A")]` for better logging flexibility. * **Lawn Care Log (`Views/LawnCareEvents/Index.cshtml`):** * **Centered Page Title & Actions:** Wrapped `<h1>` and primary action buttons (`Create New Event`, `View Calendar`) in a `div` with `text-center` for better alignment. * **Improved Search Bar Layout:** Encapsulated the search input and buttons in an `input-group` within a flex container (`d-flex justify-content-end`) with fixed width and auto margins, ensuring it's centered as a block but right-aligned internally. * **Convert Table Actions to Buttons:** Replaced "Edit | Details | Delete" links in the main log table with `btn-sm btn-outline-primary/info/danger` styled buttons, wrapped in `d-flex flex-wrap gap-2` for consistent spacing and responsive behavior. * Renamed "Back to Full List" to "Reset Filter" for clarity and changed its style to `btn-primary`. * **Lawn Care Calendar (`Views/LawnCareEvents/Calendar.cshtml`):** * **Centralized Title & Button:** Implemented a flexbox container (`d-flex justify-content-between align-items-center`) for the calendar's page title and the "Create New Event" button, ensuring they are on the same line and properly spaced. * **Restored JavaScript Integrity:** Re-structured the top-level HTML to ensure the calendar's internal JavaScript (`#prevMonth`, `#nextMonth`, `#currentMonthYear`) remains unaffected by the page title/button layout changes. * **Lawn Care Tips (`Views/LawnCareTip/Index.cshtml`):** * **Consolidated Actions:** Converted "Edit | Details | Delete" links in the tips table into Bootstrap buttons (`btn-sm btn-outline-primary/info/danger`). * **Improved Action Column Layout:** Applied new `.col-actions` CSS to the action column (`<th>` and `<td>`) to give it a fixed width and use `white-space: nowrap` to prevent action buttons from wrapping. * **Content Column Wrapping:** Added `.col-content` CSS to the content column to limit its max-width and allow `word-wrap`. * Changed "Create New" to "Create New Tip" with `btn-primary` styling for consistency. * **Removed Details Link from Tips:** (Implied by diff) The Details link for `LawnCareTip` was removed from the table view, aligning with a common pattern where simple tip content might be fully displayed or only Edit/Delete actions are prioritized in the index. * **Global Styling (`wwwroot/css/site.css`):** * Added `col-content` and `col-actions` CSS classes to manage table column widths and wrapping behavior for cleaner table layouts. These changes significantly improve the aesthetic consistency and usability of the application's main views.
ciphervance commented 2025-06-21 21:31:00 +00:00 (Migrated from gitlab.com)
Copy link

mentioned in commit 60567d7969

mentioned in commit 60567d7969b15ccd3fec744995be606f4739ee53
ciphervance (Migrated from gitlab.com) merged commit 60567d7969 into main 2025-06-21 21:31:01 +00:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: blakeridgway/turf-tasker#3
No description provided.
Delete branch "feat/calendar-view"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?