svthalia/concrexit

View on GitHub
website/thaliawebsite/static/css/_typography.scss

Summary

Maintainability
Test Coverage
body {
    font-family: $primary-font;
    font-size: 14px;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--title-color);
    font-family: $header-font;
    font-weight: $regular;
    letter-spacing: $letter-spacing;
    margin-top: 0;
    text-transform: uppercase;
}

h1 {
    font-size: 26px;
}

h2 {
    font-size: 24px;
}

h3 {
    font-size: 22px;
}

h4 {
    font-size: 20px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

a {
    color: var(--primary);
    @include transition(.2s);
    &:hover, &:active, &:focus {
        color: var(--primary-hover);
        text-decoration: none;
    }
    letter-spacing: $letter-spacing;
    outline: 0 !important;
    text-decoration: none;
}

p {
    font-family: $primary-font;
    font-weight: $regular;
    font-size: 14px;
    line-height: 25px;
    color: var(--text-color);
    letter-spacing: $letter-spacing;
    margin-bottom: 10px;
}

.bg-default {
    color: var(--text-color);
    background: var(--primary);
    padding: 3px 4px;
}

.bg-primary {
    color: var(--primary-contrast);
    background: var(--primary);
    padding: 3px 4px;
}

.bg-success {
    color: var(--success-contrast);
    background: var(--success);
    padding: 3px 4px;
}

.bg-info {
    color: var(--info-contrast);
    background: var(--info);
    padding: 3px 4px;
}

.bg-warning {
    color: var(--warning-contrast);
    background: var(--warning);
    padding: 3px 4px;
}

.bg-danger {
    color: var(--danger-contrast);
    background: var(--danger);
    padding: 3px 4px;
}