@use 'constants' as consts;

@mixin markdown {
    h1 {
        font-size: 140%;
        text-align: left;
    }

    h2 {
        font-size: 130%;
    }

    h3 {
        font-size: 120%;
    }

    h4 {
        font-size: 110%;
    }

    h5 {
        font-size: 100%;
    }

    h6 {
        font-size: 100%;
    }
}

// Common style for popup box like modal dialog and toast.
@mixin popup {
    border: 0.1em solid consts.$color-3;
    border-radius: 0.5em;
    background-color: consts.$color-2;

    color: consts.$text-color;
    text-align: center;
    padding: calc(2 * consts.$margin) calc(2 * consts.$margin);
    box-shadow: -1px 1px 10px rgba(0, 0, 0, 0.3);
}