Five Fifths Voter is a web application tool designed to enable and empower Black people and others to exercise their right to vote by ensuring their voice is heard
Apache License 2.0
67
stars
37
forks
source link
Add responsiveness to Section.vue for layout issues #378
Fix padding and layout issues on large screens by adding a lg: tailwind classes
Description
The initial layout looked something like this
The initial tailwind classes had responsiveness for medium screens but not for large screens, I added a few classes to make them responsive for large screens to by adjusting the padding of the slogan part in the homepage.
I added a lg:pt-0 class to the slogan div and lg:pt-1 class to the inner slogan text to prevent overlapping of text.
The final layout looks like this on large screens
Type of change
[x] Bug fix (non-breaking change which fixes an issue)
[ ] New feature (non-breaking change which adds functionality)
[ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
Checklist:
[x] I have performed a self-review of my own code
[ ] I have commented my code, particularly in hard-to-understand areas
Contributes to #376
What did you do?
Fix padding and layout issues on large screens by adding a
lg:tailwind classesDescription
The initial layout looked something like this
The initial tailwind classes had responsiveness for medium screens but not for large screens, I added a few classes to make them responsive for large screens to by adjusting the padding of the slogan part in the homepage.
I added a
lg:pt-0class to the slogan div andlg:pt-1class to the inner slogan text to prevent overlapping of text.The final layout looks like this on large screens
Type of change
Checklist: