assets/css/components/_gallery.scss


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

@include namespace('gallery') {
    @include store((
        --dims: (
            --col-width: 17em
        )
    ));

    @include component(namespace()) {
        margin-top: $line-height * 1rem;

        @include element('items') {
            display:               grid;
            grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
            gap:                   20px;
        }

        @include element('item') {
            display: block;
        }

        @include element('img') {
            display: block;
        }
    }
}