Template: Four-buttons/styles.css
m (Samwilson moved page Template:Governance-nav/styles.css to Template:Four-buttons/styles.css without leaving a redirect) |
No edit summary |
||
Line 1: | Line 1: | ||
.tpl- | .tpl-four-buttons { | ||
display: flex; | display: flex; | ||
justify-content: space-between; | justify-content: space-between; | ||
Line 5: | Line 5: | ||
} | } | ||
.tpl- | .tpl-four-buttons a { | ||
width: 22%; | width: 22%; | ||
background-color: #eee; | background-color: #eee; | ||
Line 17: | Line 17: | ||
@media ( max-width: 600px ) { | @media ( max-width: 600px ) { | ||
.tpl- | .tpl-four-buttons a { | ||
width: 43%; | width: 43%; | ||
} | } | ||
} | } | ||
.tpl- | .tpl-four-buttons a:hover { | ||
text-decoration: none; | text-decoration: none; | ||
border-color: green; | border-color: green; | ||
} | } | ||
.tpl- | .tpl-four-buttons-desc:after { | ||
display: block; | display: block; | ||
font-size: 4em; | font-size: 4em; | ||
Line 34: | Line 34: | ||
} | } | ||
.tpl- | .tpl-four-buttons a:hover .tpl-four-buttons-desc:after { | ||
color: green; | color: green; | ||
} | } | ||
.tpl- | .tpl-four-buttons-title { | ||
font-size: 110%; | font-size: 110%; | ||
font-weight: bolder; | font-weight: bolder; | ||
display: block; | display: block; | ||
} | } |
Latest revision as of 08:10, 14 October 2021
.tpl-four-buttons {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.tpl-four-buttons a {
width: 22%;
background-color: #eee;
text-align: center;
color: inherit;
border-radius: 3px;
padding: 0.5em;
border: 1px solid #eee;
margin-bottom: 1em;
}
@media ( max-width: 600px ) {
.tpl-four-buttons a {
width: 43%;
}
}
.tpl-four-buttons a:hover {
text-decoration: none;
border-color: green;
}
.tpl-four-buttons-desc:after {
display: block;
font-size: 4em;
content: "→";
line-height: 0.7em;
}
.tpl-four-buttons a:hover .tpl-four-buttons-desc:after {
color: green;
}
.tpl-four-buttons-title {
font-size: 110%;
font-weight: bolder;
display: block;
}