Padding has been added between the Dark Mode Switch component and the Divider in the side-drawer
Previously, the last checkbox on the Checkbox page became invisible in Dark Mode, as the color of the unCheckedIcon was black. It has been converted to grey to be visible in both Dark and Light Modes.
Major Change: The obnoxiously bright orange color of the SubHeader has been converted into the same color as the logo in the side-drawer. The reason I did this is to ensure that the entirety of the app has only a small palette of colors (for uniformity. Orange was not used anywhere else in the app except the Subheader, and hence looked odd) and I have already changed the color of many other elements in other PRs to this color. The size of the SubHeader has also been slightly increased. The new-look has been checked in both Light and Dark modes to ensure that visibility is not affected at all.
The off-the-place looking subheaders in the Inputs page have been replaced with the standard SubHeader. This is to ensure uniformity.
A few name typos on the Lists page have been fixed.
Minor modifications on the Overlay page to look similar to the image in the documentation.
Improvement: Previously, the ItemSeparatorComponent in the Settings Example had only one color, and hence in Dark Mode, the white color (used to make LightMode look similar to iOS settings) caused problems by looking out of place. To fix it, I have added conditional rendering which changes this component's color to black in Dark mode and white in Light Mode. Now, the page replicates the iOS look perfectly in both modes.
Sufficient padding has been given on the Text page to de-clutter the components from the top.
Color of the Find out More component in Tiles is changed from dark blue as it looked a bit weird in Dark Mode.
Open to suggestions, and willing to implement them immediately 🙌🏻
A breakdown of everything this PR achieves:
Dark Mode Switch
component and the Divider in the side-drawerCheckbox
page became invisible in Dark Mode, as the color of theunCheckedIcon
was black. It has been converted to grey to be visible in both Dark and Light Modes.Inputs
page have been replaced with the standard SubHeader. This is to ensure uniformity.Lists
page have been fixed.Overlay
page to look similar to the image in the documentation.ItemSeparatorComponent
in theSettings Example
had only one color, and hence in Dark Mode, the white color (used to make LightMode look similar to iOS settings) caused problems by looking out of place. To fix it, I have added conditional rendering which changes this component's color to black in Dark mode and white in Light Mode. Now, the page replicates the iOS look perfectly in both modes.Text
page to de-clutter the components from the top.Find out More
component inTiles
is changed from dark blue as it looked a bit weird in Dark Mode.Open to suggestions, and willing to implement them immediately 🙌🏻