Right now, we have cards with a white background and accessible links in their headers in the main content region, but we have a mixture of divs and details in the right column. Aside from the visual mismatch this creates, @Dmytrii also pointed out that we cannot achieve a consistent edit button appearance for the order details section as is. Consistency would be preferred here over strict adherence to George’s mockups.
I believe these should all be made cards similar to the billing / shipping information elements in the main content region. This would mean white backgrounds and no collapsible “fieldset” style behavior like we have today. Additionally, do we have any options for styling the header of these cards differently? Like using a yellow to match the draft state for warning messages for the draft order actions list?
Finally, would be nice if we could align this right column with the main content region. There’s a margin-block-start on this region dropping it down 2 rem, not sure what the implications are of removing that.
Issue fork commerce-3559778
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #3
majmunbog commentedComment #5
majmunbog commentedI’ve enhanced our
commerce-admin-cardSDC with optional collapsible behavior using custom JS, so we can use that instead of details. I also added footer and header slots for more flexible styling and atitle_tagprop so we could adjust the semantic importance of the card.All that is applied to the current sidebar cards.
Comment #8
jsacksick commented