customizer-variables.html 102.90 KiB
<!-- NOTE: DO NOT EDIT THE FOLLOWING SECTION DIRECTLY! It is autogenerated via the `build-customizer-html` Grunt task using the customizer-variables.jade template.-->
<h2 id="colors">Colors</h2>
<p>Gray and brand colors for use across Bootstrap.</p>
<div class="row">
  <div class="bs-customizer-input">
    <label for="input-@gray-base">@gray-base</label>
    <input id="input-@gray-base" type="text" value="		  #000" data-var="@gray-base" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@gray-darker">@gray-darker</label>
    <input id="input-@gray-darker" type="text" value="lighten(@gray-base, 13.5%)" data-var="@gray-darker" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@gray-dark">@gray-dark</label>
    <input id="input-@gray-dark" type="text" value="lighten(@gray-base, 20%)" data-var="@gray-dark" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@gray">@gray</label>
    <input id="input-@gray" type="text" value="lighten(@gray-base, 33.5%)" data-var="@gray" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@gray-light">@gray-light</label>
    <input id="input-@gray-light" type="text" value="lighten(@gray-base, 46.7%)" data-var="@gray-light" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@gray-lighter">@gray-lighter</label>
    <input id="input-@gray-lighter" type="text" value="lighten(@gray-base, 93.5%)" data-var="@gray-lighter" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@brand-primary">@brand-primary</label>
    <input id="input-@brand-primary" type="text" value="#428bca" data-var="@brand-primary" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@brand-success">@brand-success</label>
    <input id="input-@brand-success" type="text" value="#5cb85c" data-var="@brand-success" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@brand-info">@brand-info</label>
    <input id="input-@brand-info" type="text" value="#5bc0de" data-var="@brand-info" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@brand-warning">@brand-warning</label>
    <input id="input-@brand-warning" type="text" value="#f0ad4e" data-var="@brand-warning" class="form-control"/>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@brand-danger">@brand-danger</label>
    <input id="input-@brand-danger" type="text" value="#d9534f" data-var="@brand-danger" class="form-control"/>
  </div>
</div>
<h2 id="scaffolding">Scaffolding</h2>
<p>Settings for some of the most global styles.</p>
<div class="row">
  <div class="bs-customizer-input">
    <label for="input-@body-bg">@body-bg</label>
    <input id="input-@body-bg" type="text" value="#fff" data-var="@body-bg" class="form-control"/>
    <p class="help-block">Background color for <code>&lt;body&gt;</code>.</p>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@text-color">@text-color</label>
    <input id="input-@text-color" type="text" value="@gray-dark" data-var="@text-color" class="form-control"/>
    <p class="help-block">Global text color on <code>&lt;body&gt;</code>.</p>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@link-color">@link-color</label>
    <input id="input-@link-color" type="text" value="@brand-primary" data-var="@link-color" class="form-control"/>
    <p class="help-block">Global textual link color.</p>
  </div>
  <div class="bs-customizer-input">
    <label for="input-@link-hover-color">@link-hover-color</label>