guichet/static/css/lesgv/blog-post-card.css
2023-07-21 15:40:14 +02:00

77 lines
No EOL
1.2 KiB
CSS

.card {
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: space-between;
min-width: 20rem;
}
.card-header img {
width: 100%;
height: 14rem;
object-fit: cover;
border-radius: 1rem;
}
.card-body {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
min-height: 250px;
height: --webkit-fill-available;
}
.card-body {
text-align: left;
}
.article h3 {
text-align: center;
}
.author {
float:right;
}
.tag {
background: var(--color-text);
border-radius: 0.25em;
margin: 0;
color: var(--color-background);
padding: 2px 10px;
text-transform: uppercase;
cursor: pointer;
}
.tag-teal {
background-color: #47bcd4;
}
.tag-purple {
background-color: #5e76bf;
}
.tag-pink {
background-color: #cd5b9f;
}
.author img {
border-radius: 50%;
width: 4rem;
height: 4rem;
/* margin-right: 2rem; */
}
.user-info p {
margin: 0;
}
.user-info p small {
color: var(--color-secondary);
}
div.author {
text-align: right;
}
div.tags {
width: 100%;
text-align: center;
}
@media (max-width: 1000px) {
.card {
min-width: 14rem;
}
}