-
Notifications
You must be signed in to change notification settings - Fork 248
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
(feat) Order basket UI tweaks #2054
Conversation
Size Change: +4.58 kB (+0.03%) Total Size: 14.8 MB ℹ️ View Unchanged
|
e540f84
to
93f0827
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @denniskigen, great work!
I have added some thoughts.
packages/esm-patient-labs-app/src/lab-orders/add-lab-order/test-type-search.component.tsx
Show resolved
Hide resolved
@@ -34,6 +34,7 @@ | |||
order: 1; | |||
margin-right: layout.$spacing-03; | |||
margin-left: 0 !important; | |||
fill: currentColor !important; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I've got to sort this out. The broad issue is that we're using CSS to try to propagate the color, but Carbon tends to use more "specific" selectors to color things. And while it would be possible to use !important
in the styleguide itself, it would make it impossible to override in parent CSS when appropriate...
This PR applies the following UI tweaks to the order basket: - Adjusts the fill color property of svg icons in buttons to match the `currentColor` value of the parent element. - Tweaks the search results pages of the order basket to display a "Return to order basket" button per the [designs](https://zpl.io/MdQEOXK). - Adds some top margin to the test type name in the lab order form. - Tweaks the skeleton loader of the lab order search page to match the medication order search page. - Tweaks to the medication order form including amending the field sizes for both tablet and desktop views.
de66329
to
f1617c3
Compare
packages/esm-patient-labs-app/src/lab-orders/add-lab-order/add-lab-order.workspace.tsx
Show resolved
Hide resolved
This PR applies the following UI tweaks to the order basket: - Adjusts the fill color property of svg icons in buttons to match the `currentColor` value of the parent element. - Tweaks the search results pages of the order basket to display a "Return to order basket" button per the [designs](https://zpl.io/MdQEOXK). - Adds some top margin to the test type name in the lab order form. - Tweaks the skeleton loader of the lab order search page to match the medication order search page. - Tweaks to the medication order form including amending the field sizes for both tablet and desktop views. Co-authored-by: Usama Idriss Kakumba <[email protected]>
Requirements
Summary
This PR applies the following UI tweaks to the order basket:
currentColor
value of the parent element.Screenshots
Order basket UI (https://zpl.io/MdQEOXK)
order-basket-ui-tweaks.mp4
Order forms (tablet and desktop style tweaks) (https://zpl.io/blO3eB1)
order-forms.mp4
Related Issue
Other