Mobile version very close. Ping logo off, as is coming soon text.
This commit is contained in:
parent
edd15d465f
commit
32bf863905
|
@ -135,14 +135,32 @@ body {
|
||||||
/* height: auto; */
|
/* height: auto; */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
text-align: center;
|
||||||
|
width: 100vw;
|
||||||
|
}
|
||||||
|
.socialButtonsSection {
|
||||||
|
/* margin-top: auto; */
|
||||||
|
margin-bottom: 1.45rem;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.socialButtonsSection a {
|
.socialButtonsSection a {
|
||||||
color: var(--site-blue);
|
color: var(--site-blue);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.socialButtonsSection .fa-stack {
|
||||||
|
color: rgba(0, 0, 0, 0.03);
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
.copyright {
|
.copyright {
|
||||||
color: var(--site-gray);
|
color: var(--site-gray);
|
||||||
font-size: 12px;
|
font-size: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
margin-bottom: 1.05rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Feel free to remove these styles or customise in your own stylesheet 👍 */
|
/* Feel free to remove these styles or customise in your own stylesheet 👍 */
|
||||||
|
|
|
@ -33,12 +33,22 @@
|
||||||
<img src="./images/illustration-dashboard.png" alt="Illustration of the dashboard" class="mockupImage">
|
<img src="./images/illustration-dashboard.png" alt="Illustration of the dashboard" class="mockupImage">
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<div class="socialButtonsSection">
|
|
||||||
<a href="https://facebook.com/tarasis"><i class="fab fa-facebook-f"></i></a>
|
|
||||||
<a href="https://twitter.com/tarasis"><i class="fab fa-twitter"></i></a>
|
|
||||||
<a href="https://www.instagram.com/tarasis/"><i class="fab fa-instagram"></i></a>
|
|
||||||
</div>
|
</div>
|
||||||
<footer>
|
<footer>
|
||||||
|
<div class="socialButtonsSection">
|
||||||
|
<span class="fa-stack fa-2x">
|
||||||
|
<i class="far fa-circle fa-stack-2x"></i>
|
||||||
|
<a href="https://facebook.com/tarasis"><i class="fab fa-facebook-f fa-stack-1x"></i></a>
|
||||||
|
</span>
|
||||||
|
<span class="fa-stack fa-2x">
|
||||||
|
<i class="far fa-circle fa-stack-2x"></i>
|
||||||
|
<a href="https://twitter.com/tarasis"><i class="fab fa-twitter fa-stack-1x"></i></a>
|
||||||
|
</span>
|
||||||
|
<span class="fa-stack fa-2x">
|
||||||
|
<i class="far fa-circle fa-stack-2x"></i>
|
||||||
|
<a href="https://www.instagram.com/tarasis/"><i class="fab fa-instagram fa-stack-1x"></i></a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
<p class="copyright">
|
<p class="copyright">
|
||||||
© Copyright Ping. All rights reserved.
|
© Copyright Ping. All rights reserved.
|
||||||
</p>
|
</p>
|
||||||
|
@ -47,6 +57,5 @@
|
||||||
Coded by <a href="mailto:work@tarasis.net">Robert McGovern</a>.
|
Coded by <a href="mailto:work@tarasis.net">Robert McGovern</a>.
|
||||||
</p>
|
</p>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -28,3 +28,9 @@ Continue to play with positioning rather than focusing on main styling
|
||||||
Nudge screenshot nudge screenshot nudge screenshot *sigh*
|
Nudge screenshot nudge screenshot nudge screenshot *sigh*
|
||||||
I'm not OCD I swear ...
|
I'm not OCD I swear ...
|
||||||
|
|
||||||
|
Realised better to social icons into footer and move the footer out of the flex container, and clamp it to the bottom.
|
||||||
|
|
||||||
|
So mobile is virtually there. The Ping! logo is slightly off, as is the "We are launching soon!"
|
||||||
|
So close *sigh*
|
||||||
|
|
||||||
|
|
||||||
|
|
Reference in New Issue