//
// kremalicious3
// --------------
// Code
//

code,
kbd,
pre,
samp
    font-family: $font-family-monospace
    font-size: $font-size-small
    hyphens: none

code,
kbd
    padding: 2px 4px

code,
samp
    color: darken($code-color, 40%)
    background-color: alpha($code-bg, 5%)
    border-radius: $border-radius-base

kbd
    color: $kbd-color
    background-color: $kbd-bg
    border-radius: $border-radius-small
    border: 1px solid $kbd-bg
    box-shadow: inset 0 1px 0 rgba(#fff, .4)

pre
    display: block
    padding: 0
    margin-bottom: $spacer
    line-height: $line-height
    color: $code-color
    background-color: $code-bg

    // make 'em scrollable
    overflow: scroll
    -webkit-overflow-scrolling: touch
    max-height: 300px

    @media $screen-sm
        max-height: 500px

    @media $screen-md
        border-radius: $border-radius-base

    // Account for some code outputs that place code tags in pre tags
    code
        white-space: pre
        overflow: auto
        display: block
        padding: ($spacer/2) $spacer
        font-size: inherit
        color: inherit
        background-color: transparent
        border-radius: 0

        overflow-wrap: normal
        word-wrap: normal
        word-break: normal

code.language-shell
    padding-left: 1.5em
    display: block

    &:before
        @extend .text-dimmed
        content: "$"
        display: inline-block
        margin-left: -.5em
        margin-right: .8em