Skip to content
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.

Sign up for GitHub

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

Jump to bottom

docs: align footer-tablet view #15918

Closed
wants to merge 2 commits into from
Closed

docs: align footer-tablet view #15918

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f35d147
docs: align footer-tablet view
DeepshikaS May 24, 2022
240362a
Update docs-footer.scss
DeepshikaS May 25, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions docs/src/assets/scss/_docs-footer.scss
View file
Open in desktop
Expand Up @@ -7,6 +7,7 @@

@media all and (max-width: 800px) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try setting your view width to exactly 800px. It'll give a combination of the tablet and desktop views:

Screen Shot 2022-06-01 at 1 05 08 AM

That's because there's a min-width: 800px media query that makes .docs-content a grid.

Currently, the footer is centered at widths <= 800px, and the page is a grid at >= 800px, so there's a bit of overlap. If we make this a max-width of 799px, that overlap goes away:

Suggested change
@media all and (max-width: 800px) {
@media all and (max-width: 799px) {

padding: 1.5rem 0 4rem;
align-items:center ;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
align-items:center ;
align-items: center;

}
}

Expand Down