main_bs5.scss

@import 'scss/variables';
@import 'node_modules/bootstrap/scss/bootstrap';

// flush footer to bottom
html {
    height: 100%;
}

body {
    min-height: 100%;
    position: relative;
    padding-bottom: 40px;
}

footer {
    // scss-lint:disable ImportantRule
    position: absolute  !important;
    right: 0;
    bottom: 0;
    left: 0;
}


a {
    text-decoration: none;

    &:hover {
        text-decoration: underline;
    }
}

nav a:hover {
    text-decoration: none;
}


// additional spacing for sticky object
.sticky-top {
    top: $spacer * 3;
}


// show anchor on hover
h1,
h2,
h3 {
    small {
        display: none;
    }

    &:hover small {
        display: inline;
    }
}


// underline headline
.page-header {
    padding-bottom: 10px;
    margin: 44px 0 22px;
    border-bottom: $border-width solid $border-color;

    &:first-child {
        margin-top: 0;
    }
}

// wrap table headers
@include media-breakpoint-down(md) {
    .table-bordered td:first-child {
        background: $table-striped-bg;
        border-width: 1px;
    }

    .table-bordered td {
        display: block;
    }
}

// remove double spacing in tables
td > :last-child {
    margin: 0;
}


// code boxes
pre {
    background-color: $pre-background;
    color: $pre-color;
    border: 1px solid darken($pre-background, 15%);
    border-radius: $border-radius;
    padding: 0.5rem;
}

.highlight.pre-commit,
.highlight.console {
    pre {
        background-color: $console-background;
        color: $console-color;
        border: 1px solid darken($console-background, 15%);
    }

    // pygments
    // scss-lint:disable SelectorFormat
    .-Color-BGRed { background-color: #c00; }
    .-Color-BGGreen { background-color: #4e9a06; }
    .-Color-Black-BGYellow { background-color: #c4a000; color: #2e3436; }
    .-Color-Black-BGCyan { background-color: #06989a; color: #2e3436; }
    .-Color-Faint { color: #ccc; }
    .c1 { color: #06989a; }
    .s { color: #8ae234; }
    .s1 { color: #8ae234; }
    .s2 { color: #8ae234; }
}

code {
    // scss-lint:disable ImportantRule
    color: $code-color !important;
    background-color: $code-background;
    padding: $kbd-padding-y $kbd-padding-x;
    border-radius: $border-radius;
}

// copyable
.copyable img {
    cursor: pointer;
}


// https://github.com/richleland/pygments-css/blob/master/vs.css
.highlight {
    .hll { background-color: #ffc; }
    .c { color: #008000; } /* Comment */
    .err { border: 1px solid #ff0; } /* Error */
    .k { color: #00f; } /* Keyword */
    .cm { color: #008000; } /* Comment.Multiline */
    .cp { color: #00f; } /* Comment.Preproc */
    .c1 { color: #008000; } /* Comment.Single */
    .cs { color: #008000; } /* Comment.Special */
    .ge { font-style: italic; } /* Generic.Emph */
    .gh { font-weight: bold; } /* Generic.Heading */
    .gp { font-weight: bold; } /* Generic.Prompt */
    .gs { font-weight: bold; } /* Generic.Strong */
    .gu { font-weight: bold; } /* Generic.Subheading */
    .kc { color: #00f; } /* Keyword.Constant */
    .kd { color: #00f; } /* Keyword.Declaration */
    .kn { color: #00f; } /* Keyword.Namespace */
    .kp { color: #00f; } /* Keyword.Pseudo */
    .kr { color: #00f; } /* Keyword.Reserved */
    .kt { color: #2b91af; } /* Keyword.Type */
    .s { color: #a31515; } /* Literal.String */
    .nc { color: #2b91af; } /* Name.Class */
    .ow { color: #00f; } /* Operator.Word */
    .sb { color: #a31515; } /* Literal.String.Backtick */
    .sc { color: #a31515; } /* Literal.String.Char */
    .sd { color: #a31515; } /* Literal.String.Doc */
    .s2 { color: #a31515; } /* Literal.String.Double */
    .se { color: #a31515; } /* Literal.String.Escape */
    .sh { color: #a31515; } /* Literal.String.Heredoc */
    .si { color: #a31515; } /* Literal.String.Interpol */
    .sx { color: #a31515; } /* Literal.String.Other */
    .sr { color: #a31515; } /* Literal.String.Regex */
    .s1 { color: #a31515; } /* Literal.String.Single */
    .ss { color: #a31515; } /* Literal.String.Symbol */
    // git diff highlights
    .gi { color: #070; }
    .gd { color: #911; }
}