abdullahtarawneh.com/assets/scss/base/list.scss

.list {
    .container {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(240px,1fr));
        gap: 3em;
    }
    .list-item {
        color: inherit;
        text-decoration: none;
        transition: color 0.2s ease-in-out;
        &__image {
            width: 100%;
            height: auto;
        }
        &__title {
            font-size: 1.5em;
            font-weight: 700;
            margin: 1.5em 0 0.5em;
        }
        &__summary {
            margin-bottom: 0.5em;
            line-height: 1.4;
        }
        &__date {
            display: block;
            margin-bottom: 1em;
        }
        &__readmore {
            margin-bottom: 1em;
            display: block;
        }
    }
}