gerrit.onap Code Review - vnfsdk/refrepo.git/blob

   1 ---
   2 layout: docs
   3 title: Contents
   4 description: Discover what's included in Bootstrap, including our precompiled and source code flavors. Remember, Bootstrap's JavaScript plugins require jQuery.
   5 group: getting-started
   6 toc: true
   7 ---
   8
   9 ## Precompiled Bootstrap
  10
  11 Once downloaded, unzip the compressed folder and you'll see something like this:
  12
  13 <!-- NOTE: This info is intentionally duplicated in the README. Copy any changes made here over to the README too. -->
  14
  15 {% highlight plaintext %}
  16 bootstrap/
  17 ├── css/
  18 │   ├── bootstrap.css
  19 │   ├── bootstrap.css.map
  20 │   ├── bootstrap.min.css
  21 │   ├── bootstrap.min.css.map
  22 │   ├── bootstrap-grid.css
  23 │   ├── bootstrap-grid.css.map
  24 │   ├── bootstrap-grid.min.css
  25 │   ├── bootstrap-grid.min.css.map
  26 │   ├── bootstrap-reboot.css
  27 │   ├── bootstrap-reboot.css.map
  28 │   ├── bootstrap-reboot.min.css
  29 │   └── bootstrap-reboot.min.css.map
  30 └── js/
  31     ├── bootstrap.bundle.js
  32     ├── bootstrap.bundle.min.js
  33     ├── bootstrap.js
  34     └── bootstrap.min.js
  35 {% endhighlight %}
  36
  37 This is the most basic form of Bootstrap: precompiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (`bootstrap.*`), as well as compiled and minified CSS and JS (`bootstrap.min.*`). CSS [source maps](https://developers.google.com/web/tools/chrome-devtools/javascript/source-maps) (`bootstrap.*.map`) are available for use with certain browsers' developer tools. Bundled JS files (`bootstrap.bundle.js` and minified `bootstrap.bundle.min.js`) include [Popper](https://popper.js.org/), but not [jQuery](https://jquery.com/).
  38
  39 ## CSS files
  40
  41 Bootstrap includes a handful of options for including some or all of our compiled CSS.
  42
  43 <table class="table table-bordered">
  44   <thead>
  45     <tr>
  46       <th scope="col">CSS files</th>
  47       <th scope="col">Layout</th>
  48       <th scope="col">Content</th>
  49       <th scope="col">Components</th>
  50       <th scope="col">Utilities</th>
  51     </tr>
  52   </thead>
  53   <tbody>
  54     <tr>
  55       <th scope="row">
  56         <div><code class="font-weight-normal text-nowrap">bootstrap.css</code></div>
  57         <div><code class="font-weight-normal text-nowrap">bootstrap.min.css</code></div>
  58       </th>
  59       <td class="text-success">Included</td>
  60       <td class="text-success">Included</td>
  61       <td class="text-success">Included</td>
  62       <td class="text-success">Included</td>
  63     </tr>
  64     <tr>
  65       <th scope="row">
  66         <div><code class="font-weight-normal text-nowrap">bootstrap-grid.css</code></div>
  67         <div><code class="font-weight-normal text-nowrap">bootstrap-grid.min.css</code></div>
  68       </th>
  69       <td><a class="text-warning" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/layout/grid/">Only grid system</a></td>
  70       <td class="bg-light text-muted">Not included</td>
  71       <td class="bg-light text-muted">Not included</td>
  72       <td><a class="text-warning" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/flex/">Only flex utilities</a></td>
  73     </tr>
  74     <tr>
  75       <th scope="row">
  76         <div><code class="font-weight-normal text-nowrap">bootstrap-reboot.css</code></div>
  77         <div><code class="font-weight-normal text-nowrap">bootstrap-reboot.min.css</code></div>
  78       </th>
  79       <td class="bg-light text-muted">Not included</td>
  80       <td><a class="text-warning" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/content/reboot/">Only Reboot</a></td>
  81       <td class="bg-light text-muted">Not included</td>
  82       <td class="bg-light text-muted">Not included</td>
  83     </tr>
  84   </tbody>
  85 </table>
  86
  87 ## JS files
  88
  89 Similarly, we have options for including some or all of our compiled JavaScript.
  90
  91 <table class="table table-bordered">
  92   <thead>
  93     <tr>
  94       <th scope="col">JS files</th>
  95       <th scope="col">Popper</th>
  96       <th scope="col">jQuery</th>
  97     </tr>
  98   </thead>
  99   <tbody>
 100     <tr>
 101       <th scope="row">
 102         <div><code class="font-weight-normal text-nowrap">bootstrap.bundle.js</code></div>
 103         <div><code class="font-weight-normal text-nowrap">bootstrap.bundle.min.js</code></div>
 104       </th>
 105       <td class="text-success">Included</td>
 106       <td class="bg-light text-muted">Not included</td>
 107     </tr>
 108     <tr>
 109       <th scope="row">
 110         <div><code class="font-weight-normal text-nowrap">bootstrap.js</code></div>
 111         <div><code class="font-weight-normal text-nowrap">bootstrap.min.js</code></div>
 112       </th>
 113       <td class="bg-light text-muted">Not included</td>
 114       <td class="bg-light text-muted">Not included</td>
 115     </tr>
 116   </tbody>
 117 </table>
 118
 119 ## Bootstrap source code
 120
 121 The Bootstrap source code download includes the precompiled CSS and JavaScript assets, along with source Sass, JavaScript, and documentation. More specifically, it includes the following and more:
 122
 123 {% highlight plaintext %}
 124 bootstrap/
 125 ├── dist/
 126 │   ├── css/
 127 │   └── js/
 128 ├── docs/
 129 │   └── examples/
 130 ├── js/
 131 └── scss/
 132 {% endhighlight %}
 133
 134 The `scss/` and `js/` are the source code for our CSS and JavaScript. The `dist/` folder includes everything listed in the precompiled download section above. The `docs/` folder includes the source code for our documentation, and `examples/` of Bootstrap usage. Beyond that, any other included file provides support for packages, license information, and development.