assets/css/objects/_button.scss


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

@include namespace('button') {
    @include store((
        --dims: (
            --pad-x: 1.4em,
            --pad-y: .5em
        ),
        --colors: (
            --bg: prop(--colors --fg-lo, $global: true),
            --fg: prop(--colors --bg, $global: true),
        )
    ));

    @include object(namespace()) {
        display:          inline-block;
        padding:          prop(--dims --pad-y) prop(--dims --pad-x);
        border-radius:    10em;
        background-color: prop(--colors --bg);
        color:            prop(--colors --fg);
        font-size:        1 / 16 * 14em;
        font-weight:      500;
        text-decoration:  none;
    }
}