Defina o CodeMirror como uma entrada de bootstrap do Twitter

Estou usando o Rails 3.2 para fazer isso. Eu tenho a versão LESS do rails-twitter-bootstrapgem instalada e criei uma folha de estilo less personalizada em meu app/assets/stylesheetsdiretório. Isso é então incluído no bootstrap_and_overrides.css.lessarquivo. Certifique-se de desativar a inclusão de toda a árvore em seu application.cssmanifesto para que este arquivo não seja incluído duas vezes (com erros associados).

Dê ao textareaque você está substituindo por CodeMirror o codemirrornome da classe.

Dentro: bootstrap_and_overrides.css.less

@import "codemirror_bootstrap.css.less";

Dentro: codemirror_bootstrap.css.less

textarea.codemirror {
  height: 310px;
}

.CodeMirror {
  padding: 4px 6px;
  font-size: @baseFontSize;
  .border-radius(@inputBorderRadius);
  vertical-align: middle;
  background-color: @inputBackground;
  border: 1px solid @inputBorder;
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
  .transition(~"border linear .2s, box-shadow linear .2s");

  // Focus state
  &.CodeMirror-focused {
    border-color: rgba(82,168,236,.8);
    outline: 0;
    outline: thin dotted 9; /* IE6-9 */
    .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)");

    .error & {
      border-color: darken(@errorText, 10%);
      @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@errorText, 20%);
      .box-shadow(@shadow);
    }
  }

  .error & {
    border-color: @errorText;
  }
}

Todos esses estilos são retirados das folhas de estilo do Twitter Bootstrap less. Versões futuras do Bootstrap podem mudar esses estilos, mas por enquanto eles funcionam.