feature: improving the `reimagine your daily commute` section
adi-uchiha opened this issue · 6 comments
I want to redesign the bottom section (the four cards).
for screen width >900px 3 cards are in a row and the 4th card is in a new row below it. The 4th card is looking out of place. It should be 2 cards in each row
Hi @adi-uchiha
I want to redesign the bottom section (
we have a figma design board that we follow. We are not planning to redesign anything.
Currently this section you pointed out is incomplete. You can add the rest of the UI components by referencing the figma designs. Try to replicate the exact UI components if you can. Make sure to follow style-system, font-typeface system, and other contributing guidelines
Do tell if you are interested in adding those UI components
I will add svg image which will not get blurred
if you are a UI/UX designer, you can convert those 4 PNGs to SVGs using illustrator or whatever tool you use to create vector graphics 👍
Also the images of the card are blurred. The font family is also don't match the website theme
we follow the figma designs only!
I want to make them responsive
I think that those 4 cards are fairly responsive. where did you see the issue in responsiveness. At what screen size did you see a flaw in responsiveness?
if you are a UI/UX designer, you can convert those 4 PNGs to SVGs using illustrator or whatever tool you use to create vector graphics 👍
On it...
They are responsive but for screen width >900px 3 cards are in a row and the 4th card is in a new row below it. The 4th card is looking out of place (maybe just my personal preference, no issue in it) I will stick to what you said I think that those 4 cards are fairly responsive.
Tell me if I should fix that minute detail
For now I will be working on converting the PNG images to SVG that will solve the blurring issue on (specially on mobile screen view) I will create a PR soon on this..
They are responsive but for screen width >900px 3 cards are in a row and the 4th card is in a new row below it.
You can work on it.
I can think of a simple fix. make 2 groups of cards. (1 grp has 2 cards)
the parent wrapping those 2 group will be a flexbox with flexwrap:wrap
by this you wont be using CSS grids or some wierd media queries.
If you can do that without using Grids (maybe you can follow the way I told you), please go ahead and work creating another pr linking to this same issue
On it...
They are responsive but for screen width >900px 3 cards are in a row and the 4th card is in a new row below it. The 4th card is looking out of place (maybe just my personal preference, no issue in it) I will stick to what you said I think that those 4 cards are fairly responsive.
Tell me if I should fix that minute detailFor now I will be working on converting the PNG images to SVG that will solve the blurring issue on (specially on mobile screen view) I will create a PR soon on this..
@adi-uchiha Please respond if you are going to start working on this. If you are not planning to work on this, we can close this issue