Tweaks padding and units in CSS

This commit is contained in:
Dan Leech 2017-05-03 08:23:48 +01:00
parent cf59ce38e0
commit 162c89b61d

View File

@ -195,7 +195,7 @@
background-color: #EEE; background-color: #EEE;
padding: 1.5rem; padding: 1.5rem;
} }
@media (min-width: 720px) { @media (min-width: 45rem) {
.footer { .footer {
padding: 3rem; padding: 3rem;
} }
@ -213,9 +213,14 @@
font-size: 1.5rem; font-size: 1.5rem;
line-height: 2rem; line-height: 2rem;
margin: 0; margin: 0;
padding: 4.5rem 1.5rem 1.5rem; padding: 3rem 1.5rem 1.5rem;
text-align: center; text-align: center;
} }
@media (min-width: 45rem) {
.hero {
padding: 4.5rem 3rem 1.5rem;
}
}
.grid { .grid {
display: flex; display: flex;
@ -224,7 +229,7 @@
margin: 1.5rem; margin: 1.5rem;
padding: 0; padding: 0;
} }
@media (min-width: 720px) { @media (min-width: 45rem) {
.grid { .grid {
margin: 3rem; margin: 3rem;
} }
@ -310,7 +315,7 @@
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
@media (min-width: 720px) { @media (min-width: 45rem) {
.navbar__nav { .navbar__nav {
padding: 0 1.5rem; padding: 0 1.5rem;
} }
@ -348,7 +353,7 @@
</ul> </ul>
</header> </header>
<main role="main"> <main role="main">
<p class="hero">{{ site.data.simple-icons.icons | size }} free <abbr title="Scalable Vector Graphic">SVG</abbr> icons for popular brands</p> <p class="hero">{{ site.data.simple-icons.icons | size }} free <abbr title="Scalable Vector Graphic">SVG</abbr> icons for popular&nbsp;brands</p>
<ul class="grid"> <ul class="grid">
<li class="grid-item grid-item--ad"> <li class="grid-item grid-item--ad">
<script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1696&amp;serve=CVYD42T&amp;placement=simpleiconsorg" id="_carbonads_js"></script> <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1696&amp;serve=CVYD42T&amp;placement=simpleiconsorg" id="_carbonads_js"></script>