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.
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
Home page mobile friendly #718
Home page mobile friendly #718
Conversation
@@ -59,6 +59,15 @@ | |||
} | |||
} | |||
|
|||
@media only screen and (max-width: 600px) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done for stopping the overflowed horizontal scroll
@@ -26,6 +26,13 @@ | |||
font-size: 27px; | |||
} | |||
} | |||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To fit the the code section in the page
@@ -166,11 +167,27 @@ p { | |||
|
|||
.hero-title { | |||
font-size: 4em; | |||
margin-bottom: 2vh; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
center the button on the main description
} | ||
|
||
.hero-logo { | ||
max-height: 60px; | ||
} | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To align the logo on the mobile page
|
||
.footer-actions { | ||
max-width: 50vw; | ||
.footer-column ul.link-list li.link-list { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To align the footer in place
@@ -44,12 +44,52 @@ | |||
color: rgb(108, 122, 137); | |||
} | |||
|
|||
@media screen and (max-width: 600px) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To provide the new look to the tabs section
@@ -592,11 +592,11 @@ <h1 class="gallery-title">Features</h1> | |||
<div> | |||
<a href="fury-pybullet.html"><img src="https://furiousatoms.com/_static/images/fullerene_1.png" alt="fullrene Modellin" align="middle"></a> | |||
</div> | |||
<div class="row p-t-5"> | |||
<div class="col-sm"> | |||
<div class="row"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Appropriate Spacing in the molecular tab
<li class="link-list"><a class="footer-link" href="https://discord.gg/6btFPPj"><i class="fa fa-angle-double-right"></i>Support</a></li> | ||
<li class="link-list"><a class="footer-link" href="installation.html"><i class="fa fa-angle-double-right"></i>Download</a></li> | ||
<li class="link-list"><a class="footer-link" href="auto_tutorials/index.html"><i class="fa fa-angle-double-right"></i>Tutorials</a></li> | ||
<li class="link-list"><a class="footer-link" href="community.html#contributors"><i class="fa fa-angle-double-right"></i> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Giving space between the double arrow and text in the footer makes the layout consistent all over
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good @Mk996, Thank you. merging
What kind of change does this PR introduce?
It is a bugfix PR. It fixes all the issues related to the home page's mobile-friendliness.
What is the new behavior (if this is a feature change)?
Does this PR introduce a breaking change? (What changes might users need to make in their application due to this PR?)
No
List of fixes:
Main logo and description alignment issues.
Hamburger menu alignment fixed.
Horizontal scrolling due to overflowing elements fixed.
Install text and command showing properly.
Tab sections got a new mobile-friendly layout.
Footer properly aligned and readable.