Changed Home Heading height w/ heading subtext & button margin#159
Merged
trumanjchan merged 2 commits intodevelopfrom Apr 26, 2021
Merged
Changed Home Heading height w/ heading subtext & button margin#159trumanjchan merged 2 commits intodevelopfrom
trumanjchan merged 2 commits intodevelopfrom
Conversation
The Home Heading's img, text, subtext, and subscribe button were too squished together. I had to change the height of the Home Heading component and add css to that, and fix the css margins between the subtext and subscribe button. By doing this we fill most of the empty space in our Heading component; especially when at lower resolutions.
Had to subtract the vh by the height of the navbar's height. Will not do vh for lower resolutions because lower resolutions are for phones and other devices. Apparently vh might not work on them and create visual bugs (because you can zoom-in and scroll out of the page using a phone, changing the view height).
adriandarian
pushed a commit
that referenced
this pull request
Oct 18, 2021
Changed Home Heading height w/ heading subtext & button margin
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Proposed changes
The Home Heading's img, text, subtext, and subscribe button were too squished together. I had to change the height of the Home Heading component and add css to that, and fix the css margins between the subtext and subscribe button. By doing this we fill most of the empty space in our Heading component; especially when at lower resolutions.
Types of changes
What types of changes does your code introduce to HackMerced Hub?
Put an
xin the boxes that applyChecklist
Put an
xin the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code.Responsiveness
Check off the different browsers and devices you have tested on. Note: testing includes Horizontal and Vertical alignments
Browsers
Devices
Phones
Tablets
Desktops
Screenshots
I have to scroll down twice to exit the Home Heading component:
iPhone SE 2nd gen: I shouldn't be seeing the About Us text. The component height should be the full view height of my phone.
Current website on desktop:
After changes on desktop:
Current website on desktop:
After changes on desktop: (tower css was changed in a previously merged PR)
Further comments
When I boot up the hackmerced website on my desktop, the Heading component height seems to be too tall (should be the full view height of the user's browser). And when I boot up the website on my phone, iPhone SE 2020, I can see the About Us text right underneath the Heading component. So I wanted to fix the component's height while addressing the margin problem.