mirror of
https://github.com/kremalicious/blog.git
synced 2024-11-13 16:45:14 +01:00
Matthias Kretschmann
384b364a63
- switch to rem based typography - switch to rem based spacing - responsive typography through root font size change
69 lines
1.3 KiB
Stylus
69 lines
1.3 KiB
Stylus
//
|
|
// kremalicious3
|
|
// --------------
|
|
// Code
|
|
//
|
|
|
|
code,
|
|
kbd,
|
|
pre,
|
|
samp
|
|
font-family: $font-family-monospace
|
|
font-size: $font-size-mini
|
|
hyphens: none
|
|
|
|
code,
|
|
kbd
|
|
padding: 2px 4px
|
|
|
|
code
|
|
color: darken($code-color, 40%)
|
|
background-color: alpha($code-bg, 10%)
|
|
border-radius: $border-radius-base
|
|
white-space: nowrap
|
|
word-wrap: normal
|
|
|
|
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: ($spacer/2) 12px
|
|
margin: 0 0 $spacer
|
|
line-height: $line-height
|
|
color: $code-color
|
|
background-color: $code-bg
|
|
border-radius: $border-radius-base
|
|
|
|
// make 'em scrollable
|
|
overflow: scroll
|
|
-webkit-overflow-scrolling: touch
|
|
max-height: 300px
|
|
|
|
@media $breakpoint2
|
|
max-height: 500px
|
|
|
|
// Account for some code outputs that place code tags in pre tags
|
|
code
|
|
padding: 0
|
|
font-size: inherit
|
|
color: inherit
|
|
white-space: pre
|
|
background-color: transparent
|
|
border-radius: 0
|
|
|
|
code.bash
|
|
padding-left: 1.5em
|
|
display: block
|
|
|
|
&:before
|
|
content: "$"
|
|
color: $text-color-dimmed
|
|
display: inline-block
|
|
margin-left: -1.5em
|
|
margin-right: .8em
|