ul.decent-comments-list {
list-style: none;
padding: 0;
margin: 0;
}
.decent-comments-list .comment-entry {
margin: 0 0 16px 0;
} .decent-comments-list .comment-entry .comment-content {
display: grid;
grid-template-columns: min-content 1fr;
grid-template-rows: auto;
justify-content: stretch;
gap: 0;
padding-bottom: 16px;
}
.decent-comments-list .comment-entry .comment-content > div {
padding: 4px;
}
.decent-comments-list .comment-entry .comment-content .comment-avatar {
grid-column: 1 / 1;
grid-row: 1 / span 1;
align-content: center;
}
.decent-comments-list .comment-entry .comment-content .comment-author {
grid-column: 2 / 2;
grid-row: 1 / span 1;
align-content: center;
}
.decent-comments-list .comment-entry .comment-content .comment-date {
grid-column: 2 / 2;
grid-row: 2 / span 1;
align-content: center;
}
.decent-comments-list .comment-entry .comment-content .comment-link {
grid-column: 2 / 2;
grid-row: 3 / span 1;
align-content: center;
}
.decent-comments-list .comment-entry .comment-content .comment-excerpt {
grid-column: 2 / 2;
grid-row: 4 / span 1;
align-content: start;
border-radius: 0 12px 12px 12px;
padding: 8px;
background-color: hsl( 0, 0%, 95%);
}
.decent-comments-list .comment-entry .comment-content .comment-avatar img {
vertical-align: middle;
} .decent-comments-list.flex .comment-entry .comment-content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: stretch;
column-gap: 8px;
justify-content: flex-start;
}
.decent-comments-list.flex .comment-entry .comment-content > div {
align-content: center;
}
.decent-comments-list.flex .comment-entry .comment-content .comment-excerpt {
flex-basis: 100%;
}
.decent-comments-list.flex .comment-entry .comment-content .comment-avatar img {
vertical-align: middle;
}