-
Notifications
You must be signed in to change notification settings - Fork 2
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
[ISSUE 14] - Add Material UI throughout app #75
base: main
Are you sure you want to change the base?
Conversation
…ponent instead of label tag; change color of elements
- update imports; - add MUI components; - add Tooltips.
- add MUI components, such as Paper and Typography; - add minor custom styling to MUI Paper; - update input placeholder and label.
Visit the preview URL for this PR (updated for commit d6e08d8): https://tcl-75-smart-shopping-list--pr75-nk-add-mui-throughou-uby9t9bt.web.app (expires Fri, 25 Oct 2024 12:18:52 GMT) 🔥 via Firebase Hosting GitHub Action 🌎 Sign: 1f1fd53c369e1fa31e15c310aa075b4e8f4f8dde |
…-shopping-list into nk-add-mui-throughout-app
…Items component if clicked
…ary color in two variants: darkPaperStyle and lightPaperStyle
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.
@kweeuhree this one also looks good to me. Tested locally and everything works.
The preview link didn't work again, but I'm not sure why.
Description
This code adds Material UI components throughout the app. Some of the previous custom styling is removed for simplicity. However, some of custom styling is still added, such as border color, font size and color changes.
The following Material components have been added:
Additionally this code proposes some changes to some of input labels and placeholders. Changes aim to make such prompts more friendly and descriptive.
Tests are updated to reflect changes made in labels and placeholders.
Related Issue
Closes #14
Type of Changes
enhancement
Updates
Before
Home:
List:
ManageList:
After
Home:
List:
Empty list:
List with items:
List with items with AddItems visible:
ManageList:
Testing Steps / QA Criteria