d33pspace / Renewal-Design-Html

0 stars 0 forks source link

Take Page #27

Closed d33pspace closed 3 years ago

d33pspace commented 3 years ago

@AnKar112 @academws I'm creating a new issue here especially to discuss the Take page... https://d33pspace.github.io/RenewalMgtApp-Html/app/take_page.html

*Note that the function of the Take page is similar to the Give page - these are probably the two most complex pages. So you might want to finish the Give page first.

Here's what needs to happen:

(1) The initial state of the page is there is no Laundry list (see Figma model). (2) In the Most Commonly Used list, when the [+] icon is tapped, the item is added to the Laundry List. (If there is no Laundry List, the Laundry list appears.) (3) In the Full Clothing List, when the a [+] icon is tapped, the item is added to the Laundry List. (If there is no Laundry List, the Laundry List appears.) (a) Some items in the Full Clothing List can be expanded. Items that can be expanded have a grey down arrow. When the item is expanded and the sub-items appear, the grey down arrow changes to a black up arrow. (b) Some items in the Full Clothing List cannot be expanded. Items that cannot be expanded have a [+] icon instead of a grey arrow. (4) All items added to the Laundry List use the style used in the Most Commonly Used list. In other words, Item name (if any) in black all caps, with Sub-item name in grey below. (5) In the Laundry List, when the [-] icon is clicked/tapped, the item is removed from the list. (6) Remove the Search row. (7) This page needs an FAB always present.

edwazhao commented 3 years ago

Hi @d33pspace , I also have two questions about Take Page.

  1. When the tag is edit mode, I would like to make # non-editable, we can move it out of the input element. image

  2. There is a number after the item in laundry list, does it mean we take 2 T-Shirts from the guest? I would like to propose not attach quality to each row, because I am not sure how we can mark one of the t-shirts to trash? It would be easier to add two rows of T-Shirt, each row represent only one item. image

AnKar112 commented 3 years ago

Check it please, must be the same as on give page

AnKar112 commented 3 years ago

When the tag is edit mode, I would like to make # non-editable, we can move it out of the input element. - done too

d33pspace commented 3 years ago

@AnKar112 @academws Great work on all issues today thanks so much! 😍

Here, a few small things: (1) The Laundry list has a light grey background shading. (2) In the Laundry list, please remove the count number. If two of the same item are added to the Laundry list, there are two rows. I'm sorry you did this correctly according to the mock-up but I am making this change. (3) Similar to Give page, there are two types of items that can be added to the Laundry list from the Full Clothing list... ---(a) Sub-items of expanded items. ---(b) Items that do not expand with sub-items.

@edwazhao Can you comment about # non-editable? Is this how you want it? I'm not sure what you're going for here.

edwazhao commented 3 years ago

Thanks, looks good from my side.

When the tag is edit mode, I would like to make # non-editable, we can move it out of the input element. - done too

d33pspace commented 3 years ago

@AnKar112 @academws Adding to my list above... (4) When the user clicks on the pencil icon to edit the laundry tag, please move the cursor to the end of the number. (5) Please also see #42 which applies to both the Take page and Give page.

AnKar112 commented 3 years ago

(4) - done