27,289
edits
Weezerpedia:Main Page links/styles.css: Difference between revisions
no edit summary
(Donny created the page Weezerpedia:Main Page links/styles.css using a non-default content model "Sanitized CSS") |
No edit summary |
||
| Line 1: | Line 1: | ||
.link-container { | |||
display: flex; | |||
flex-wrap: wrap; | |||
} | |||
.link-container > div:nth-child(even) { | |||
margin-right: 0; | |||
} | |||
.link-container > div { | |||
box-sizing: border-box; | |||
flex: 1 1 calc(100% - 1rem); | |||
display: flex; | |||
align-items: center; | |||
position: relative; | |||
margin-right: 5px; | |||
padding: 1rem; | |||
background-color: rgba(0, 0, 0, .01); | |||
border: 1px solid rgba(0, 0, 0, .2); | |||
border-radius: .25rem; | |||
flex-direction: column; | |||
} | |||
.link-container > div > .image { | |||
width: 50px; | |||
padding: 0; | |||
flex: 0 0 auto; | |||
} | |||
.link-container > div > div { | |||
flex-grow: 1; | |||
} | |||
.link-container > div > .link, | |||
.link-container > div > .link > a { | |||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
} | |||
.link-container > div > .link:hover { | |||
background-color: rgba(0, 0, 0, .1); | |||
border-radius: .25rem; | |||
} | |||
.link-container > div > .link > a { | |||
font-size: 0; | |||
line-height: 0; | |||
color: transparent; | |||
} | |||
@media (min-width: 576px) { | |||
.link-container > div { | |||
flex-direction: row; | |||
} | |||
} | |||
@media screen and (max-width: 768px) { | |||
.link-container > div { | |||
margin-right: 0; /* No margin between stacked boxes */ | |||
} | |||
} | |||
.link-container > div > .image { | |||
padding-right: 1rem; | |||
} | |||
@media (min-width: 768px) { | |||
.link-container > div { | |||
flex-basis: calc(50% - 1rem); | |||
} | |||
} | |||