abdullahtarawneh.com/content/support/style.scss

89 lines
1.6 KiB
SCSS
Raw Normal View History

main.support {
line-height: 1.728;
.container {
max-width: 80ch;
@media (min-width: 60rem) {
padding-inline: 0
}
}
.donation-links {
padding-inline-start: 0;
list-style: none;
display: flex;
flex-flow: row wrap;
margin-block: 3rem;
justify-content: space-around;
gap: 1rem;
li {
display: contents;
}
a {
flex-basis: 13rem;
display: grid;
text-decoration: none;
place-items: center;
text-align: center;
gap: 1rem;
svg {
width: 100%;
height: 4rem;
}
span {
font-weight: bold;
}
background: var(--color-accent);
padding: 2rem;
color: white;
border-radius: 1rem;
box-shadow: 0px 4px 4px hsl(150, 80%, 30%);
&:hover {
background-color: var(--color-highlight-weak);
box-shadow: 0px 2px 2px hsl(210, 80%, 50%)
}
}
}
.quote {
margin: 0;
margin-inline-start: 1rem;
padding: 1rem;
padding-inline-start: 2.5rem;
position: relative;
border-radius: 2rem;
border-start-start-radius: 0;
background: var(--color-highlight);
color: var(--color-button-text);
&:before {
content: '';
position: absolute;
border-style: solid;
border-width: 0rem 1rem 1rem 0;
border-color: transparent var(--color-highlight) transparent transparent;
left: -1rem;
top: 0;
}
blockquote {
margin: 0;
margin-block-start: 0.5rem;
p {
margin: 0;
}
&:before {
content: '';
position: absolute;
top: -0.75rem;
left: 0.5rem;
font-size: 3rem;
font-family: serif;
}
}
figcaption {
cite {
&:before {
content: '';
}
}
}
}
}