zui/src/less/components/code.less

一个基于 Bootstrap 深度定制开源前端实践方案，帮助你快速构建现代跨屏应用。

/// ========================================================================
/// Bootstrap: code.less
/// https://github.com/twbs/bootstrap/blob/master/less/code.less
///
/// ZUI: The file has been changed in ZUI. It will not keep update with the
/// Bootsrap version in the future.
/// http://openzui.com
/// ========================================================================
/// Bootrap: Copyright 2011-2016 Twitter, Inc. Licensed under MIT
/// ========================================================================


// Inline and block code styles

.code,
code,
kbd,
pre,
samp { font-family: @font-family-monospace; }


// Inline code

kbd,
code {
  padding: 2px 4px;
  font-size: 90%;
  color: @code-color;
  background-color: @code-bg;
  border-radius: @border-radius-base;
}


// Keyboard text

kbd {
  padding: 1px 4px;
  background-color: @kbd-bg;
  border: 1px solid darken(@kbd-bg, 10%);
  border-bottom-width: 2px;
  color: @kbd-color;
  font-weight: bold;
}


// Blocks of code

pre {
  display: block;
  padding: ((@line-height-computed - 1) / 2);
  margin: 0 0 (@line-height-computed / 2);
  font-size: (@font-size-base - 1); // 14px to 13px
  line-height: @pre-line-height;
  word-break: break-all;
  word-wrap: break-word;
  color: @pre-color;
  background-color: @pre-bg;
  border: 1px solid @pre-border-color;
  border-radius: @border-radius-base;

  // Account for some code outputs that place code tags in pre tags

  code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border: 0;
    margin: 0;
  }
}


// Enable scrollable blocks of code

.pre-scrollable {
  max-height: @pre-scrollable-max-height;
  overflow-y: scroll;
}


// prettify.css

.com { color: #93a1a1; }
.lit { color: #195f91; }
.pun, .opn, .clo { color: #93a1a1; }
.fun { color: #dc322f; }
.str, .atv { color: #D14; }
.kwd, .prettyprint .tag { color: #1e347b; }
.typ, .atn, .dec, .var { color: teal; }
.pln { color: #48484c; }

.prettyprint {
  &.linenums {
    box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
  }

  ol.linenums {
    padding-left: 35px;
    color: #bebec5;
    line-height: 20px;
    text-shadow: 0 1px 0 #fff;
    margin-bottom: 0;
  }
}