Skip to content

Update UI for Dashboard page shopping lists  #44

@Velocities

Description

@Velocities

Currently, each shopping list can be viewed on the Dashboard page and is shown with its title and immediately followed by a trash can icon for deleting the item. The UI design of this is very basic at the moment and should be enhanced by implementing the following changes for the display of the shopping lists shown on the Dashboard page:

  • Right align trash can icons
  • Add darken hover effect to border and text color whenever any part of the list item , except for the trash can, is hovered over - This would need some integration with the next UI task
    - Make entire list item clickable (not just the text) - This one is a bit more functional as the user shouldn't have to click solely on the text to actually navigate to that list
  • Add pencil icon with "View/Edit List" text to be seen when that icon is hovered over, and this icon and its text should be the only way to go to the edit/view page for a list - The "View/Edit List" text should be transitioned to via the CSS transition property
  • Add date of last update date and time for a list - This would obviously be the creation date and time for a list that's just been created, but the field for that will obviously be the same as the update field which is always stored for any item, regardless if it's been modified since creation or not. Some backend changes will be necessary to accomplish this. The date and time shown should be the date and time for the user's time zone, so the JavaScript code for this should be dynamic.

Edit: Back End label added to this issue due to necessary changes to Laravel shopping list retrieval (and related grocery item modifications) that the Dashboard page interacts with.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions