abdullahtarawneh.com/assets/scss/components/h-card.scss
2021-12-24 00:20:07 -06:00

34 lines
No EOL
675 B
SCSS

.h-card {
font-family: monospace;
overflow: hidden;
display: flex;
flex-flow: column;
width: 100%;
max-width: 18rem;
margin: 2em auto;
border-radius: 1em;
@include box-shadow;
.banner {
background-image: url('/images/sunset.jpg');
background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
aspect-ratio: 2;
position: relative;
}
img {
border-radius: 100em;
width: 25%;
aspect-ratio: 1;
background: rgba(0,0,0,0.5);
}
dl {
dt, dd {width: max-content;}
padding: 1rem;
dt {font-weight: 700; margin-bottom: 0.25em}
dd {margin-bottom: 0.5em; max-width: 100%;}
}
}