BradNut/awesome-uses
1
0
Fork 0
mirror of https://github.com/BradNut/awesome-uses synced 2025-09-08 17:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

mqs

Browse source
This commit is contained in:
Wes Bos 2020-01-08 13:32:10 -05:00
parent 754c90bff6
commit a474f7aae5
3 changed files with 34 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/Person.js
View file

@ -109,6 +109,9 @@ const PersonInner = styled.div`
grid-template-rows: auto auto;
grid-template-columns: auto 1fr;
grid-gap: 0 1rem;
@media all and (max-width: 400px) {
grid-template-columns: 1fr;
}
img {
grid-row: 1 / -1;
background: var(--lightblue);
@ -151,6 +154,14 @@ const PersonDeets = styled.div`
.phone {
padding: 0;
}
@media all and (max-width: 400px) {
display: grid;
grid-template-columns: 1fr 1fr;
> *:nth-child(2) ~ * {
/* lol */
border-block-start: 1px solid var(--vape);
}
}
`;
const TwitterHandle = styled.span`

28
src/components/layout.js
View file

@ -27,16 +27,28 @@ const Layout = ({ children }) => {
return (
<>
<GlobalStyle />
<Header siteTitle={data.site.siteMetadata.title} />
<Main>
<Header siteTitle={data.site.siteMetadata.title} />
{children}
<footer>
© {new Date().getFullYear() - Math.floor(Math.random() * 777)} Made by{' '}
<a href="https://wesbos.com">Wes Bos</a> with{' '}
<a href="https://www.gatsbyjs.org">Gatsby</a>. Source on{' '}
<a href="https://github.com/wesbos/awesome-uses/">GitHub</a>. Icons
from <a href="icons8.com">icons8.com</a>. Domain provided by{' '}
<a href="https://get.tech/">.Tech</a>
<center ya-i-used-a-center-tag="sue me">
<p>
Made by <a href="https://wesbos.com">Wes Bos</a> with{' '}
<a href="https://www.gatsbyjs.org">Gatsby</a> ©{' '}
{new Date().getFullYear() - Math.floor(Math.random() * 777)}
</p>
<p>
Source on{' '}
<a href="https://github.com/wesbos/awesome-uses/">GitHub</a>. Add
yourself!
</p>
<p>
Icons from <a href="icons8.com">icons8.com</a>
</p>
<p>
Domain provided by <a href="https://get.tech/">.Tech</a>
</p>
</center>
</footer>
</Main>
</>
@ -68,7 +80,7 @@ const GlobalStyle = createGlobalStyle`
body {
font-size: 2rem;
overflow-y: scroll;
overflow-x: hidden;
/* overflow-x: hidden; */
}
h1,h2,h3,h4,h5,h6 {
font-weight: 500;

3
src/pages/index.js
View file

@ -54,4 +54,7 @@ const People = styled.div`
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
grid-gap: 5rem;
@media all and (max-width: 400px) {
grid-template-columns: 1fr;
}
`;