Merge branch 'v4-dev' into btn_input_split_variables

2026-06-17 19:21:23 +03:00 · 2017-10-22 14:26:49 -07:00
parent 58e553d7bc 29d58fb758
commit 1f42d79561
180 changed files with 1382 additions and 1203 deletions
@@ -12,6 +12,3 @@ trim_trailing_whitespace = true
 [*.md]
 trim_trailing_whitespace = false
 [*.py]
 indent_size = 4
@@ -38,11 +38,11 @@
 Several quick start options are available:
- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.0.0-beta.zip)
+- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip)
 - Clone the repo: `git clone https://github.com/twbs/bootstrap.git`
- Install with [npm](https://www.npmjs.com/): `npm install bootstrap@4.0.0-beta`
+- Install with [npm](https://www.npmjs.com/): `npm install bootstrap@4.0.0-beta.2`
- Install with [yarn](https://yarnpkg.com/): `yarn add bootstrap@4.0.0-beta`
+- Install with [yarn](https://yarnpkg.com/): `yarn add bootstrap@4.0.0-beta.2`
- Install with [Composer](https://getcomposer.org/): `composer require twbs/bootstrap:4.0.0-beta`
+- Install with [Composer](https://getcomposer.org/): `composer require twbs/bootstrap:4.0.0-beta.2`
 - Install with [NuGet](https://www.nuget.org/): CSS: `Install-Package bootstrap -Pre` Sass: `Install-Package bootstrap.sass -Pre` (`-Pre` is only required until Bootstrap v4 has a stable release).
 Read the [Getting started page](https://getbootstrap.com/getting-started/) for information on the framework contents, templates and examples, and more.
@@ -109,7 +109,7 @@ Documentation search is powered by [Algolia's DocSearch](https://community.algol
 2. Run `npm install` to install Node.js dependencies.
 3. Run `npm run test` (or a specific NPM script) to rebuild distributed CSS and JavaScript files, as well as our docs assets.
 4. From the root `/bootstrap` directory, run `npm run docs-serve` in the command line.
-5. Open <http://localhost:9001> in your browser, and voilà.
+5. Open `http://localhost:9001` in your browser, and voilà.
 Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
@@ -49,25 +49,26 @@ social_image_path:  /assets/brand/bootstrap-social.png
 social_logo_path:   /assets/brand/bootstrap-social-logo.png
 # Custom variables
-current_version:    4.0.0-beta
+current_version:      4.0.0-beta.2
-docs_version:       4.0
+current_ruby_version: 4.0.0.beta2
-repo:               "https://github.com/twbs/bootstrap"
+docs_version:         4.0
-slack:              "https://bootstrap-slack.herokuapp.com"
+repo:                 "https://github.com/twbs/bootstrap"
-blog:               "https://blog.getbootstrap.com"
+slack:                "https://bootstrap-slack.herokuapp.com"
-expo:               "https://expo.getbootstrap.com"
+blog:                 "https://blog.getbootstrap.com"
-jobs:               "https://jobs.getbootstrap.com"
+expo:                 "https://expo.getbootstrap.com"
-themes:             "https://themes.getbootstrap.com"
+jobs:                 "https://jobs.getbootstrap.com"
 themes:               "https://themes.getbootstrap.com"
 download:
-  source:           "https://github.com/twbs/bootstrap/archive/v4.0.0-beta.zip"
+  source:           "https://github.com/twbs/bootstrap/archive/v4.0.0-beta.2.zip"
-  dist:             "https://github.com/twbs/bootstrap/releases/download/v4.0.0-beta/bootstrap-4.0.0-beta-dist.zip"
+  dist:             "https://github.com/twbs/bootstrap/releases/download/v4.0.0-beta.2/bootstrap-4.0.0-beta.2-dist.zip"
 cdn:
  # See https://www.srihash.org for info on how to generate the hashes
-  css:              "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css"
+  css:              "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css"
-  css_hash:         "sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M"
+  css_hash:         "sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb"
-  js:               "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"
+  js:               "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"
-  js_hash:          "sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1"
+  js_hash:          "sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ"
  jquery:           "https://code.jquery.com/jquery-3.2.1.slim.min.js"
  jquery_hash:      "sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
  popper:           "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
@@ -1,19 +0,0 @@
 - name: Lyft
  url: https://www.lyft.com
  expo_url: https://expo.getbootstrap.com/2014/10/29/lyft/
  img: lyft
 - name: Vogue
  url: http://www.vogue.com
  expo_url: https://expo.getbootstrap.com/2014/09/30/vogue/
  img: vogue
 - name: Riot Design
  url: https://riot.design/en/
  expo_url: https://expo.getbootstrap.com/2014/03/13/riot-design/
  img: riot
 - name: Newsweek
  url: http://www.newsweek.com/
  expo_url: https://expo.getbootstrap.com/2014/02/12/newsweek/
  img: newsweek
@@ -11,4 +11,4 @@
 - name: Brazilian Portuguese
  code: pt-BR
  description: Bootstrap 4 Português do Brasil
-  url: https://bootstrapbrasil.github.io/v4/
+  url: http://getbootstrap.com.br/v4/
@@ -37,7 +37,7 @@
      <div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
        <a class="dropdown-item active" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/">Latest (4.x)</a>
        <a class="dropdown-item" href="https://v4-alpha.getbootstrap.com/">v4 Alpha 6</a>
-        <a class="dropdown-item" href="https://getbootstrap.com/3.3/">v3.3.7</a>
+        <a class="dropdown-item" href="https://getbootstrap.com/docs/3.3/">v3.3.7</a>
        <a class="dropdown-item" href="https://getbootstrap.com/2.3.2/">v2.3.2</a>
      </div>
    </li>
@@ -36,7 +36,7 @@
              {{ doc.title }}
            </a>
-            {% comment %}
+            {%- comment -%}
            {% unless doc.sections == nil %}
              <ul class="nav">
                {% for section in doc.sections %}
@@ -48,7 +48,7 @@
                {% endfor %}
              </ul>
            {% endunless %}
-            {% endcomment %}
+            {%- endcomment -%}
          </li>
        {%- endfor -%}
      </ul>
@@ -1,20 +1,22 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 <meta name="description" content="{{ page.description | default: site.description }}">
 <meta name="author" content="{{ site.authors }}">
 <meta name="generator" content="Jekyll v{{ jekyll.version }}">
 <title>
  {%- if page.title -%}
-    {{ page.title }} &middot; {{ site.title }}
+    {{ page.title }} · {{ site.title }}
  {%- else -%}
-    {{ site.title }} &middot; {{ site.description }}
+    {{ site.title }} · {{ site.description }}
  {%- endif -%}
 </title>
 <!-- Bootstrap core CSS -->
 {% if site.github %}
-  <link href="{{ site.baseurl }}/dist/css/bootstrap.min.css" rel="stylesheet">
+<link href="{{ site.baseurl }}/dist/css/bootstrap.min.css" rel="stylesheet">
 {% else %}
-  <link href="{{ site.baseurl }}/dist/css/bootstrap.css" rel="stylesheet">
+<link href="{{ site.baseurl }}/dist/css/bootstrap.css" rel="stylesheet">
 {% endif %}
 <!-- Documentation extras -->
@@ -3,25 +3,25 @@
 <script src="{{ site.baseurl }}/assets/js/vendor/popper.min.js"></script>
-{% if site.github %}
+{%- if site.github -%}
  <script src="{{ site.baseurl }}/dist/js/bootstrap.min.js"></script>
-{% else %}
+{%- else -%}
  <script src="{{ site.baseurl }}/dist/js/bootstrap.js"></script>
-{% endif %}
+{%- endif -%}
-{% if site.github %}
+{%- if site.github -%}
  <script src="{{ site.baseurl }}/assets/js/docs.min.js"></script>
-{% else %}
+{%- else -%}
  <script src="{{ site.baseurl }}/assets/js/vendor/anchor.min.js"></script>
  <script src="{{ site.baseurl }}/assets/js/vendor/clipboard.min.js"></script>
  <script src="{{ site.baseurl }}/assets/js/vendor/holder.min.js"></script>
  <script src="{{ site.baseurl }}/assets/js/src/application.js"></script>
  <script src="{{ site.baseurl }}/assets/js/src/pwa.js"></script>
-{% endif %}
+{%- endif -%}
 <script src="{{ site.baseurl }}/assets/js/ie-emulation-modes-warning.js"></script>
-{% if page.layout == "docs" %}
+{%- if page.layout == "docs" -%}
 <script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
 <script>
  docsearch({
@@ -43,7 +43,7 @@
    debug: false // Set debug to true if you want to inspect the dropdown
  });
 </script>
-{% endif %}
+{%- endif -%}
 <script>
  Holder.addTheme('gray', {
@@ -1,36 +1,18 @@
 <!-- Meta -->
 <meta name="description" content="{{ site.description }}">
 <meta name="author" content="{{ site.authors }}">
 <!-- Twitter -->
 <meta name="twitter:card" content="{% if page.title %}summary{% else %}summary_large_image{% endif %}">
 <meta name="twitter:site" content="@{{ site.twitter }}">
 <meta name="twitter:creator" content="@{{ site.twitter }}">
-
+<meta name="twitter:title" content="{{ page.title | default: site.title }}">
-{% if page.title %}
+<meta name="twitter:description" content="{{ page.description | default: site.description }}">
-  <meta name="twitter:card" content="summary">
+<meta name="twitter:image" content="{% if page.title %}{{ site.url | append: site.social_logo_path }}{% else %}{{ site.url | append: site.social_image_path }}{% endif %}">
  <meta name="twitter:title" content="{{ page.title }}">
  <meta name="twitter:description" content="{{ page.description }}">
  <meta name="twitter:image" content="{{ site.url }}{{ site.social_logo_path }}">
 {% else %}
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="{{ site.title }}">
  <meta name="twitter:description" content="{{ site.description }}">
  <meta name="twitter:image" content="{{ site.url }}{{ site.social_image_path }}">
 {% endif %}
 <!-- Facebook -->
-{% if page.title %}
+<meta property="og:url" content="{{ site.url | append: page.url }}">
-  <meta property="og:url" content="{{ site.url }}{{ page.url }}">
+<meta property="og:title" content="{{ page.title | default: site.title }}">
-  <meta property="og:title" content="{{ page.title }}">
+<meta property="og:description" content="{{ page.description | default: site.description }}">
-  <meta property="og:description" content="{{ page.description }}">
+<meta property="og:type" content="website">
-  <meta property="og:type" content="website">
+<meta property="og:image" content="{{ site.url | replace: 'https://', 'http://' | append: site.social_image_path }}">
-{% else %}
+<meta property="og:image:secure_url" content="{{ site.url | append: site.social_image_path }}">
  <meta property="og:url" content="{{ site.url }}">
  <meta property="og:title" content="{{ site.title }}">
  <meta property="og:description" content="{{ site.description }}">
 {% endif %}
 <meta property="og:image" content="{{ site.url | replace: 'https://', 'http://' }}{{ site.social_image_path }}">
 <meta property="og:image:secure_url" content="{{ site.url }}{{ site.social_image_path }}">
 <meta property="og:image:type" content="image/png">
 <meta property="og:image:width" content="1200">
 <meta property="og:image:height" content="630">
@@ -13,11 +13,11 @@
    {% include docs-navbar.html %}
    {% if page.layout == "simple" %}
-        {{ content }}
+      {{ content }}
    {% else %}
-        <main id="content" role="main">
+      <main id="content" role="main">
-            {{ content }}
+        {{ content }}
-        </main>
+      </main>
    {% endif %}
    {% include footer.html %}
@@ -14,7 +14,7 @@
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
-  background-color: rgba(0,0,0,.05);
+  background-color: rgba(0, 0, 0, .05);
  a {
    color: #333;
@@ -15,8 +15,8 @@
    padding: .75rem 0 !important;
    background-color: #fff;
    background-clip: padding-box;
-    border: 1px solid rgba(0,0,0,.1);
+    border: 1px solid rgba(0, 0, 0, .1);
-    box-shadow: 0 .5rem 1rem rgba(0,0,0,.175);
+    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .175);
    @include media-breakpoint-up(md) {
      width: 175%;
@@ -82,7 +82,7 @@
      .algolia-docsearch-suggestion--category-header {
        padding-top: .75rem !important;
        margin-top: .75rem !important;
-        border-top: 1px solid rgba(0,0,0,.1);
+        border-top: 1px solid rgba(0, 0, 0, .1);
      }
    }
@@ -115,7 +115,7 @@
    font-size: .75rem !important;
    line-height: 1 !important;
    color: #767676 !important;
-    border-top: 1px solid rgba(0,0,0,.1);
+    border-top: 1px solid rgba(0, 0, 0, .1);
  }
  .algolia-docsearch-footer--logo {
@@ -132,10 +132,10 @@
  }
  .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight {
-    box-shadow: inset 0 -2px 0 0 rgba(95,45,171,.5) !important;
+    box-shadow: inset 0 -2px 0 0 rgba(95, 45, 171, .5) !important;
  }
  .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content {
-    background-color: rgba(208,189,236,.15) !important;
+    background-color: rgba(208, 189, 236, .15) !important;
  }
 }
@@ -14,8 +14,8 @@
    > [class^="col-"] {
      padding-top: .75rem;
      padding-bottom: .75rem;
-      background-color: rgba(86,61,124,.15);
+      background-color: rgba(86, 61, 124, .15);
-      border: 1px solid rgba(86,61,124,.2);
+      border: 1px solid rgba(86, 61, 124, .2);
    }
  }
@@ -23,13 +23,13 @@
  .flex-items-middle,
  .flex-items-bottom {
    min-height: 6rem;
-    background-color: rgba(255,0,0,.1);
+    background-color: rgba(255, 0, 0, .1);
  }
 }
 .bd-example-row-flex-cols .row {
  min-height: 10rem;
-  background-color: rgba(255,0,0,.1);
+  background-color: rgba(255, 0, 0, .1);
 }
 .bd-highlight {
@@ -5,7 +5,7 @@
 .bd-navbar {
  min-height: 4rem;
  background-color: $bd-purple;
-  box-shadow: 0 .5rem 1rem rgba(0,0,0,.05), inset 0 -1px 0 rgba(0,0,0,.1);
+  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .05), inset 0 -1px 0 rgba(0, 0, 0, .1);
  @include media-breakpoint-down(md) {
    padding-right: .5rem;
@@ -8,7 +8,7 @@
  @supports (position: sticky) {
    position: sticky;
    top: 4rem;
-    max-height: calc(100vh - 4rem);
+    height: calc(100vh - 4rem);
    overflow-y: auto;
  }
  order: 2;
@@ -52,16 +52,16 @@
 .bd-sidebar {
  order: 0;
  // background-color: #f5f2f9;
-  border-bottom: 1px solid rgba(0,0,0,.1);
+  border-bottom: 1px solid rgba(0, 0, 0, .1);
  @include media-breakpoint-up(md) {
    @supports (position: sticky) {
      position: sticky;
      top: 4rem;
      z-index: 1000;
-      max-height: calc(100vh - 4rem);
+      height: calc(100vh - 4rem);
    }
-    border-right: 1px solid rgba(0,0,0,.1);
+    border-right: 1px solid rgba(0, 0, 0, .1);
  }
  @include media-breakpoint-up(xl) {
@@ -93,7 +93,7 @@
  padding: 1rem 15px;
  margin-right: -15px;
  margin-left: -15px;
-  border-bottom: 1px solid rgba(0,0,0,.05);
+  border-bottom: 1px solid rgba(0, 0, 0, .05);
  .form-control:focus {
    border-color: $bd-purple-bright;
@@ -114,10 +114,10 @@
  display: block;
  padding: .25rem 1.5rem;
  font-weight: 500;
-  color: rgba(0,0,0,.65);
+  color: rgba(0, 0, 0, .65);
  &:hover {
-    color: rgba(0,0,0,.85);
+    color: rgba(0, 0, 0, .85);
    text-decoration: none;
  }
 }
@@ -131,7 +131,7 @@
    }
    > .bd-toc-link {
-      color: rgba(0,0,0,.85);
+      color: rgba(0, 0, 0, .85);
      &:hover {
        background-color: transparent;
@@ -149,11 +149,11 @@
  display: block;
  padding: .25rem 1.5rem;
  font-size: 90%;
-  color: rgba(0,0,0,.65);
+  color: rgba(0, 0, 0, .65);
 }
 .bd-sidebar .nav > li > a:hover {
-  color: rgba(0,0,0,.85);
+  color: rgba(0, 0, 0, .85);
  text-decoration: none;
  background-color: transparent;
 }
@@ -161,6 +161,6 @@
 .bd-sidebar .nav > .active > a,
 .bd-sidebar .nav > .active:hover > a {
  font-weight: 500;
-  color: rgba(0,0,0,.85);
+  color: rgba(0, 0, 0, .85);
  background-color: transparent;
 }
@@ -1,19 +1,43 @@
 {
  "attr-bans": ["align", "background", "bgcolor", "border", "frameborder", "longdesc", "marginwidth", "marginheight", "scrolling"],
  "attr-name-style": false,
-  "attr-no-unsafe-char": false,
+  "attr-no-dup": true,
  "attr-no-unsafe-char": true,
  "attr-quote-style": "double",
  "attr-req-value": true,
  "attr-validate": true,
  "class-no-dup": true,
  "class-style": "dash",
  "doctype-first": true,
  "doctype-html5": true,
  "fig-req-figcaption": false,
  "focusable-tabindex-style": true,
  "head-req-title": true,
  "head-valid-content-model": false,
  "href-style": false,
  "html-req-lang": true,
  "html-valid-content-model": false,
  "id-class-ignore-regex": "(onclick|content|[a-z]+([A-Z][a-z])+)",
  "id-class-no-ad": true,
  "id-class-style": "dash",
  "id-no-dup": true,
  "img-req-alt": "allownull",
  "img-req-src": false,
  "img-req-alt": false,
  "indent-style": "spaces",
  "indent-width": 2,
  "input-radio-req-name": false,
  "input-req-label": false,
  "label-req-for": true,
  "lang-style": "case",
  "line-end-style": "lf",
  "spec-char-escape": false,
  "table-req-header": false,
  "tag-bans": ["b", "i"],
-  "title-max-len": false
+  "tag-close": true,
  "tagname-lowercase": true,
  "tag-name-match": true,
  "tag-self-close": false,
  "text-ignore-regex": false,
  "title-max-len": 70,
  "title-no-dup": true
 }
@@ -21,7 +21,6 @@
    "declaration-no-important": true,
    "font-family-name-quotes": "always-where-recommended",
    "font-weight-notation": "numeric",
    "function-comma-space-after": null,
    "function-url-no-scheme-relative": true,
    "function-url-quotes": "always",
    "length-zero-no-unit": true,
@@ -7,6 +7,6 @@ module.exports = (ctx) => ({
    sourcesContent: true
  },
  plugins: {
-    autoprefixer: {}
+    autoprefixer: { cascade: false }
  }
 })
@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Grid v4.0.0-beta (https://getbootstrap.com)
+ * Bootstrap Grid v4.0.0-beta.2 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Reboot v4.0.0-beta (https://getbootstrap.com)
+ * Bootstrap Reboot v4.0.0-beta.2 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
@@ -63,7 +63,7 @@ abbr[title],
 abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
-          text-decoration: underline dotted;
+  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
 }
@@ -194,7 +194,7 @@ select,
 summary,
 textarea {
  -ms-touch-action: manipulation;
-      touch-action: manipulation;
+  touch-action: manipulation;
 }
 table {
@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Reboot v4.0.0-beta (https://getbootstrap.com)
+ * Bootstrap Reboot v4.0.0-beta.2 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
@@ -1,5 +1,5 @@
 /*!
-  * Bootstrap v4.0.0-beta (https://getbootstrap.com)
+  * Bootstrap v4.0.0-beta.2 (https://getbootstrap.com)
  * Copyright 2011-2017 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */
@@ -10,7 +10,7 @@ $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): util.js
+ * Bootstrap (v4.0.0-beta.2): util.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -179,7 +179,7 @@ var inheritsLoose = _inheritsLoose;
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): alert.js
+ * Bootstrap (v4.0.0-beta.2): alert.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -191,7 +191,7 @@ var Alert = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'alert';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.alert';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -351,7 +351,7 @@ var Alert = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): button.js
+ * Bootstrap (v4.0.0-beta.2): button.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -363,7 +363,7 @@ var Button = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'button';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.button';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -514,7 +514,7 @@ var Button = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): carousel.js
+ * Bootstrap (v4.0.0-beta.2): carousel.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -526,7 +526,7 @@ var Carousel = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'carousel';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.carousel';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -1014,7 +1014,7 @@ var Carousel = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): collapse.js
+ * Bootstrap (v4.0.0-beta.2): collapse.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -1026,7 +1026,7 @@ var Collapse = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'collapse';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.collapse';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -3819,7 +3819,7 @@ Popper.Defaults = Defaults;
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): dropdown.js
+ * Bootstrap (v4.0.0-beta.2): dropdown.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -3840,7 +3840,7 @@ var Dropdown = function () {
  var NAME = 'dropdown';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.dropdown';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -4258,7 +4258,7 @@ var Dropdown = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): modal.js
+ * Bootstrap (v4.0.0-beta.2): modal.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -4270,7 +4270,7 @@ var Modal = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'modal';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.modal';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -4834,7 +4834,7 @@ var Modal = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): tooltip.js
+ * Bootstrap (v4.0.0-beta.2): tooltip.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -4855,7 +4855,7 @@ var Tooltip = function () {
  var NAME = 'tooltip';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.tooltip';
  var EVENT_KEY = "." + DATA_KEY;
  var JQUERY_NO_CONFLICT = $.fn[NAME];
@@ -5495,7 +5495,7 @@ var Tooltip = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): popover.js
+ * Bootstrap (v4.0.0-beta.2): popover.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -5507,7 +5507,7 @@ var Popover = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'popover';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.popover';
  var EVENT_KEY = "." + DATA_KEY;
  var JQUERY_NO_CONFLICT = $.fn[NAME];
@@ -5681,7 +5681,7 @@ var Popover = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): scrollspy.js
+ * Bootstrap (v4.0.0-beta.2): scrollspy.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -5693,7 +5693,7 @@ var ScrollSpy = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'scrollspy';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.scrollspy';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -5992,7 +5992,7 @@ var ScrollSpy = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): tab.js
+ * Bootstrap (v4.0.0-beta.2): tab.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -6004,7 +6004,7 @@ var Tab = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'tab';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.tab';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -6258,11 +6258,14 @@ var Tab = function () {
  }
  var version = $.fn.jquery.split(' ')[0].split('.');
-  var min = 3;
+  var minMajor = 1;
-  var max = 4;
+  var ltMajor = 2;
  var minMinor = 9;
  var minPatch = 1;
  var maxMajor = 4;
-  if (version[0] < min || version[0] >= max) {
+  if (version[0] < ltMajor && version[1] < minMinor || version[0] === minMajor && version[1] === minMinor && version[2] < minPatch || version[0] >= maxMajor) {
-    throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0');
+    throw new Error('Bootstrap\'s JavaScript requires at least jQuery v1.9.1 but less than v4.0.0');
  }
 })($);
@@ -6281,3 +6284,4 @@ exports.Tooltip = Tooltip;
 return exports;
 }({},$));
 //# sourceMappingURL=bootstrap.bundle.js.map
@@ -1,5 +1,5 @@
 /*!
-  * Bootstrap v4.0.0-beta (https://getbootstrap.com)
+  * Bootstrap v4.0.0-beta.2 (https://getbootstrap.com)
  * Copyright 2011-2017 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */
@@ -11,7 +11,7 @@ Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): util.js
+ * Bootstrap (v4.0.0-beta.2): util.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -180,7 +180,7 @@ var inheritsLoose = _inheritsLoose;
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): alert.js
+ * Bootstrap (v4.0.0-beta.2): alert.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -192,7 +192,7 @@ var Alert = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'alert';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.alert';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -352,7 +352,7 @@ var Alert = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): button.js
+ * Bootstrap (v4.0.0-beta.2): button.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -364,7 +364,7 @@ var Button = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'button';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.button';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -515,7 +515,7 @@ var Button = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): carousel.js
+ * Bootstrap (v4.0.0-beta.2): carousel.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -527,7 +527,7 @@ var Carousel = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'carousel';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.carousel';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -1015,7 +1015,7 @@ var Carousel = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): collapse.js
+ * Bootstrap (v4.0.0-beta.2): collapse.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -1027,7 +1027,7 @@ var Collapse = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'collapse';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.collapse';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -1382,7 +1382,7 @@ var Collapse = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): dropdown.js
+ * Bootstrap (v4.0.0-beta.2): dropdown.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -1403,7 +1403,7 @@ var Dropdown = function () {
  var NAME = 'dropdown';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.dropdown';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -1821,7 +1821,7 @@ var Dropdown = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): modal.js
+ * Bootstrap (v4.0.0-beta.2): modal.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -1833,7 +1833,7 @@ var Modal = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'modal';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.modal';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -2397,7 +2397,7 @@ var Modal = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): tooltip.js
+ * Bootstrap (v4.0.0-beta.2): tooltip.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -2418,7 +2418,7 @@ var Tooltip = function () {
  var NAME = 'tooltip';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.tooltip';
  var EVENT_KEY = "." + DATA_KEY;
  var JQUERY_NO_CONFLICT = $.fn[NAME];
@@ -3058,7 +3058,7 @@ var Tooltip = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): popover.js
+ * Bootstrap (v4.0.0-beta.2): popover.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -3070,7 +3070,7 @@ var Popover = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'popover';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.popover';
  var EVENT_KEY = "." + DATA_KEY;
  var JQUERY_NO_CONFLICT = $.fn[NAME];
@@ -3244,7 +3244,7 @@ var Popover = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): scrollspy.js
+ * Bootstrap (v4.0.0-beta.2): scrollspy.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -3256,7 +3256,7 @@ var ScrollSpy = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'scrollspy';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.scrollspy';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -3555,7 +3555,7 @@ var ScrollSpy = function () {
 /**
 * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): tab.js
+ * Bootstrap (v4.0.0-beta.2): tab.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * --------------------------------------------------------------------------
 */
@@ -3567,7 +3567,7 @@ var Tab = function () {
   * ------------------------------------------------------------------------
   */
  var NAME = 'tab';
-  var VERSION = '4.0.0-beta';
+  var VERSION = '4.0.0-beta.2';
  var DATA_KEY = 'bs.tab';
  var EVENT_KEY = "." + DATA_KEY;
  var DATA_API_KEY = '.data-api';
@@ -3821,11 +3821,14 @@ var Tab = function () {
  }
  var version = $.fn.jquery.split(' ')[0].split('.');
-  var min = 3;
+  var minMajor = 1;
-  var max = 4;
+  var ltMajor = 2;
  var minMinor = 9;
  var minPatch = 1;
  var maxMajor = 4;
-  if (version[0] < min || version[0] >= max) {
+  if (version[0] < ltMajor && version[1] < minMinor || version[0] === minMajor && version[1] === minMinor && version[2] < minPatch || version[0] >= maxMajor) {
-    throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0');
+    throw new Error('Bootstrap\'s JavaScript requires at least jQuery v1.9.1 but less than v4.0.0');
  }
 })($);
@@ -3844,3 +3847,4 @@ exports.Tooltip = Tooltip;
 return exports;
 }({},$,Popper));
 //# sourceMappingURL=bootstrap.js.map
@@ -14,7 +14,7 @@ In browsers where the [Page Visibility API](https://www.w3.org/TR/page-visibilit
 Please be aware that nested carousels are not supported, and carousels are generally not compliant with accessibility standards.
-Lastly, if you're building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+Lastly, if you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 ## Example
@@ -12,7 +12,7 @@ Dropdowns are toggleable, contextual overlays for displaying lists of links and
 Dropdowns are built on a third party library, [Popper.js](https://popper.js.org/), which provides dynamic positioning and viewport detection. Be sure to include [popper.min.js]({{ site.cdn.popper }}) before Bootstrap's JavaScript or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js.
-If you're building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 ## Accessibility
@@ -264,11 +264,11 @@ The `.form-group` class is the easiest way to add some structure to forms. Its o
 {% example html %}
 <form>
  <div class="form-group">
-    <label class="form-control-label" for="formGroupExampleInput">Example label</label>
+    <label class="col-form-label" for="formGroupExampleInput">Example label</label>
    <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
  </div>
  <div class="form-group">
-    <label class="form-control-label" for="formGroupExampleInput2">Another label</label>
+    <label class="col-form-label" for="formGroupExampleInput2">Another label</label>
    <input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input">
  </div>
 </form>
@@ -359,11 +359,11 @@ Below is a live demo followed by example HTML and JavaScript. For more informati
      <div class="modal-body">
        <form>
          <div class="form-group">
-            <label for="recipient-name" class="form-control-label">Recipient:</label>
+            <label for="recipient-name" class="col-form-label">Recipient:</label>
            <input type="text" class="form-control" id="recipient-name">
          </div>
          <div class="form-group">
-            <label for="message-text" class="form-control-label">Message:</label>
+            <label for="message-text" class="col-form-label">Message:</label>
            <textarea class="form-control" id="message-text"></textarea>
          </div>
        </form>
@@ -52,10 +52,10 @@ Here's an example of all the sub-components included in a responsive light-theme
          Dropdown
        </a>
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-          <a class="dropdown-item" href="/action">Action</a>
+          <a class="dropdown-item" href="#">Action</a>
-          <a class="dropdown-item" href="/another_action">Another action</a>
+          <a class="dropdown-item" href="#">Another action</a>
          <div class="dropdown-divider"></div>
-          <a class="dropdown-item" href="http://www.example.com/something_else_here">Something else here</a>
+          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
      <li class="nav-item">
@@ -70,7 +70,7 @@ Here's an example of all the sub-components included in a responsive light-theme
 </nav>
 {% endexample %}
-This example uses [color]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/color/) (`bg-light`) and [spacing]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/) (`my-2`, `my-lg-0`, `mr-sm-0`, `my-sm-0`) utility classes.
+This example uses [color]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/colors/) (`bg-light`) and [spacing]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/) (`my-2`, `my-lg-0`, `mr-sm-0`, `my-sm-0`) utility classes.
 ### Brand
@@ -235,7 +235,7 @@ If you need responsive nav variations, consider using a series of [flexbox utili
 If you're using navs to provide a navigation bar, be sure to add a `role="navigation"` to the most logical parent container of the `<ul>`, or wrap a `<nav>` element around the whole navigation. Do not add the role to the `<ul>` itself, as this would prevent it from being announced as an actual list by assistive technologies.
-Note that navigation bars, even if visually styled as tabs with the `.nav-tabs` class, should **not** be given `role="tablist"`, `role="tab"` or `role="tabpanel"` attributes. These are only appropriate for dynamic tabbed interfaces, as described in the [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessible Rich Internet Applications">ARIA</abbr> Authoring Practices](https://www.w3.org/TR/wai-aria-practices/#tabpanel). See [JavaScript behavior for dynamic tabbed interfaces](#javascript-behavior-for-dynamic-tabbed-interfaces) in this section for an example.
+Note that navigation bars, even if visually styled as tabs with the `.nav-tabs` class, should **not** be given `role="tablist"`, `role="tab"` or `role="tabpanel"` attributes. These are only appropriate for dynamic tabbed interfaces, as described in the [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessible Rich Internet Applications">ARIA</abbr> Authoring Practices](https://www.w3.org/TR/wai-aria-practices/#tabpanel). See [JavaScript behavior](#javascript-behavior) for dynamic tabbed interfaces in this section for an example.
 ## Using dropdowns
@@ -297,7 +297,7 @@ Add dropdown menus with a little extra HTML and the [dropdowns JavaScript plugin
 Use the tab JavaScript plugin—include it individually or through the compiled `bootstrap.js` file—to extend our navigational tabs and pills to create tabbable panes of local content, even via dropdown menus.
-If you're building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 Dynamic tabbed interfaces, as described in the [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessible Rich Internet Applications">ARIA</abbr> Authoring Practices](https://www.w3.org/TR/wai-aria-practices/#tabpanel), require `role="tablist"`, `role="tab"`, `role="tabpanel"`, and additional `aria-` attributes in order to convey their structure, functionality and current state to users of assistive technologies (such as screen readers).
@@ -13,7 +13,7 @@ Things to know when using the popover plugin:
 - Popovers rely on the 3rd party library [Popper.js](https://popper.js.org/) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for popovers to work!
 - Popovers require the [tooltip plugin]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/tooltips/) as a dependency.
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+- If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 - Popovers are opt-in for performance reasons, so **you must initialize them yourself**.
 - Zero-length `title` and `content` values will never show a popover.
 - Specify `container: 'body'` to avoid rendering problems in more complex components (like our input groups, button groups, etc).
@@ -10,7 +10,7 @@ toc: true
 Scrollspy has a few requirements to function properly:
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+- If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 - It must be used on a Bootstrap [nav component]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/navs/) or [list group]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/list-group/).
 - Scrollspy requires `position: relative;` on the element you're spying on, usually the `<body>`.
 - When spying on elements other than the `<body>`, be sure to have a `height` set and `overflow-y: scroll;` applied.
@@ -11,7 +11,7 @@ toc: true
 Things to know when using the tooltip plugin:
 - Tooltips rely on the 3rd party library [Popper.js](https://popper.js.org/) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for tooltips to work!
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
+- If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 - Tooltips are opt-in for performance reasons, so **you must initialize them yourself**.
 - Tooltips with zero-length titles are never displayed.
 - Specify `container: 'body'` to avoid rendering problems in more complex components (like our input groups, button groups, etc).
@@ -579,11 +579,48 @@ Regular table background variants are not available with the dark table, however
 {% capture callout-include %}{% include callout-warning-color-assistive-technologies.md %}{% endcapture %}
 {{ callout-include | markdownify }}
 ## Captions
 A `<caption>` functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.
 {% example html %}
 <table class="table">
  <caption>List of users</caption>
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First Name</th>
      <th scope="col">Last Name</th>
      <th scope="col">Username</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td>Larry</td>
      <td>the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
 </table>
 {% endexample %}
 ## Responsive tables
-Create responsive tables by adding `.table-responsive{-sm|-md|-lg|-xl}` to any `.table` to make them scroll horizontally at each `max-width` breakpoint 575px, 767px, 991px, and 1199px, respectively.
+Responsive tables allow tables to be scrolled horizontally with ease. Make any table responsive across all viewports by adding `.table-responsive` class on `.table`. Or, pick a maximum breakpoint with which to have a responsive table up to by adding `.table-responsive{-sm|-md|-lg|-xl}`.
 For responsive tables that always scroll horizontally when the table is wider than its container, add the `.table-responsive` class on `.table`.
 {% callout warning %}
 #### Vertical clipping/truncation
@@ -591,6 +628,8 @@ For responsive tables that always scroll horizontally when the table is wider th
 Responsive tables make use of `overflow-y: hidden`, which clips off any content that goes beyond the bottom or top edges of the table. In particular, this can clip off dropdown menus and other third-party widgets.
 {% endcallout %}
 ### Always responsive
 <div class="bd-example">
  <table class="table table-responsive">
    <thead>
@@ -697,41 +736,57 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
 </table>
 {% endhighlight %}
 ### Breakpoint specific
-## Captions
+Use `.table-responsive{-sm|-md|-lg|-xl}` as needed to create responsive tables up to a particular breakpoint. From that breakpoint and up, the table will behave normally and not scroll horizontally.
-A `<caption>` functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.
+<div class="bd-example">
-
+{% for bp in site.data.breakpoints %}{% unless bp.breakpoint == "xs" %}
-{% example html %}
+<table class="table table-responsive{{ bp.abbr }}">
 <table class="table">
  <caption>List of users</caption>
  <thead>
    <tr>
      <th scope="col">#</th>
-      <th scope="col">First Name</th>
+      <th scope="col">Table heading</th>
-      <th scope="col">Last Name</th>
+      <th scope="col">Table heading</th>
-      <th scope="col">Username</th>
+      <th scope="col">Table heading</th>
      <th scope="col">Table heading</th>
      <th scope="col">Table heading</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
-      <td>Mark</td>
+      <td>Table cell</td>
-      <td>Otto</td>
+      <td>Table cell</td>
-      <td>@mdo</td>
+      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
    <tr>
      <th scope="row">2</th>
-      <td>Jacob</td>
+      <td>Table cell</td>
-      <td>Thornton</td>
+      <td>Table cell</td>
-      <td>@fat</td>
+      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
    <tr>
      <th scope="row">3</th>
-      <td>Larry</td>
+      <td>Table cell</td>
-      <td>the Bird</td>
+      <td>Table cell</td>
-      <td>@twitter</td>
+      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
  </tbody>
 </table>
-{% endexample %}
+{% endunless %}{% endfor %}
 </div>
 {% highlight html %}
 {% for bp in site.data.breakpoints %}{% unless bp.breakpoint == "xs" %}
 <table class="table table-responsive{{ bp.abbr }}">
  ...
 </table>
 {% endunless %}{% endfor %}
 {% endhighlight %}
@@ -47,7 +47,7 @@ h6,
 .blog-masthead {
  margin-bottom: 3rem;
  background-color: #428bca;
-  box-shadow: inset 0 -.1rem .25rem rgba(0,0,0,.1);
+  box-shadow: inset 0 -.1rem .25rem rgba(0, 0, 0, .1);
 }
 /* Nav links */
@@ -32,7 +32,7 @@ body {
 body {
  color: #fff;
  text-align: center;
-  text-shadow: 0 .05rem .1rem rgba(0,0,0,.5);
+  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
 }
 /* Extra markup and styles for table-esque vertical and horizontal centering */
@@ -41,7 +41,7 @@ body {
  width: 100%;
  height: 100%; /* For at least Firefox */
  min-height: 100%;
-  box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
+  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
 }
 .site-wrapper-inner {
  display: table-cell;
@@ -73,14 +73,14 @@ body {
 .nav-masthead .nav-link {
  padding: .25rem 0;
  font-weight: 700;
-  color: rgba(255,255,255,.5);
+  color: rgba(255, 255, 255, .5);
  background-color: transparent;
  border-bottom: .25rem solid transparent;
 }
 .nav-masthead .nav-link:hover,
 .nav-masthead .nav-link:focus {
-  border-bottom-color: rgba(255,255,255,.25);
+  border-bottom-color: rgba(255, 255, 255, .25);
 }
 .nav-masthead .nav-link + .nav-link {
@@ -120,7 +120,7 @@ body {
 */
 .mastfoot {
-  color: rgba(255,255,255,.5);
+  color: rgba(255, 255, 255, .5);
 }
@@ -17,8 +17,8 @@ h3 {
 [class*="col-"] {
  padding-top: 1rem;
  padding-bottom: 1rem;
-  background-color: rgba(86,61,124,.15);
+  background-color: rgba(86, 61, 124, .15);
-  border: 1px solid rgba(86,61,124,.2);
+  border: 1px solid rgba(86, 61, 124, .2);
 }
 hr {
@@ -14,14 +14,14 @@ Examples that focus on implementing uses of built-in components provided by Boot
 <div class="row bd-examples">
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/starter-template/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/starter-template.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/starter-template.png" alt="" width="800" height="600">
      <h4>Starter template</h4>
    </a>
    <p>Nothing but the basics: compiled CSS and JavaScript.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/grid/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/grid.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/grid.png" alt="" width="800" height="600">
      <h4>Grids</h4>
    </a>
    <p>Multiple examples of grid layouts with all four tiers, nesting, and more.</p>
@@ -30,14 +30,14 @@ Examples that focus on implementing uses of built-in components provided by Boot
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/jumbotron/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/jumbotron.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/jumbotron.png" alt="" width="800" height="600">
      <h4>Jumbotron</h4>
    </a>
    <p>Build around the jumbotron with a navbar and some basic grid columns.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/narrow-jumbotron/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/jumbotron-narrow.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/jumbotron-narrow.png" alt="" width="800" height="600">
      <h4>Narrow jumbotron</h4>
    </a>
    <p>Build a more custom page by narrowing the default container and jumbotron.</p>
@@ -51,14 +51,14 @@ Taking the default navbar component and showing how it can be moved, placed, and
 <div class="row bd-examples">
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/navbars/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar.png" alt="" width="800" height="600">
      <h4>Navbar</h4>
    </a>
    <p>Super basic template that includes the navbar along with some additional content.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/navbar-top/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-static.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-static.png" alt="" width="800" height="600">
      <h4>Static top navbar</h4>
    </a>
    <p>Super basic template with a static top navbar along with some additional content.</p>
@@ -67,14 +67,14 @@ Taking the default navbar component and showing how it can be moved, placed, and
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/navbar-top-fixed/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-fixed.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-fixed.png" alt="" width="800" height="600">
      <h4>Fixed navbar</h4>
    </a>
    <p>Super basic template with a fixed top navbar along with some additional content.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/navbar-bottom/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-bottom.jpg" alt="">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/navbar-bottom.png" alt="">
      <h4>Bottom navbar</h4>
    </a>
    <p>Super basic template with a bottom navbar along with some additional content.</p>
@@ -88,14 +88,14 @@ Brand new components and templates to help folks quickly get started with Bootst
 <div class="row bd-examples">
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/album/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/album.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/album.png" alt="" width="800" height="600">
      <h4>Album</h4>
    </a>
    <p>Simple one-page template for photo galleries, portfolios, and more.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/cover/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/cover.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/cover.png" alt="" width="800" height="600">
      <h4>Cover</h4>
    </a>
    <p>A one-page template for building simple and beautiful home pages.</p>
@@ -104,14 +104,14 @@ Brand new components and templates to help folks quickly get started with Bootst
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/carousel/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/carousel.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/carousel.png" alt="" width="800" height="600">
      <h4>Carousel</h4>
    </a>
    <p>Customize the navbar and carousel, then add some new components.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/blog/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/blog.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/blog.png" alt="" width="800" height="600">
      <h4>Blog</h4>
    </a>
    <p>Simple two-column blog layout with custom navigation, header, and type.</p>
@@ -120,14 +120,14 @@ Brand new components and templates to help folks quickly get started with Bootst
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/dashboard/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/dashboard.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/dashboard.png" alt="" width="800" height="600">
      <h4>Dashboard</h4>
    </a>
    <p>Basic admin dashboard shell with fixed sidebar and navbar.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/signin/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sign-in.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sign-in.png" alt="" width="800" height="600">
      <h4>Sign-in page</h4>
    </a>
    <p>Custom form layout and design for a simple sign in form.</p>
@@ -136,14 +136,14 @@ Brand new components and templates to help folks quickly get started with Bootst
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/justified-nav/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/justified-nav.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/justified-nav.png" alt="" width="800" height="600">
      <h4>Justified nav</h4>
    </a>
    <p>Create a custom navbar with justified links. Heads up! Not too Safari friendly.</p>
  </div>
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/sticky-footer/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sticky-footer.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sticky-footer.png" alt="" width="800" height="600">
      <h4>Sticky footer</h4>
    </a>
    <p>Attach a footer to the bottom of the viewport when the content is shorter than it.</p>
@@ -152,7 +152,7 @@ Brand new components and templates to help folks quickly get started with Bootst
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/sticky-footer-navbar/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sticky-footer-navbar.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/sticky-footer-navbar.png" alt="" width="800" height="600">
      <h4>Sticky footer w/ navbar</h4>
    </a>
    <p>Attach a footer to the bottom of the viewport with a fixed top navbar.</p>
@@ -166,7 +166,7 @@ Examples that focus on future-friendly features or techniques.
 <div class="row bd-examples">
  <div class="col-6 col-md-4">
    <a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/offcanvas/">
-      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/offcanvas.jpg" alt="" width="800" height="600">
+      <img class="img-thumbnail" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/examples/screenshots/offcanvas.png" alt="" width="800" height="600">
      <h4>Offcanvas</h4>
    </a>
    <p>Build a toggleable off-canvas navigation menu for use with Bootstrap.</p>
@@ -20,7 +20,7 @@ body {
 }
 .navbar {
-  background-image: linear-gradient(to bottom, #f7f7f7 0%,#eee 100%);
+  background-image: linear-gradient(to bottom, #f7f7f7 0%, #eee 100%);
  border: 1px solid #e5e5e5;
 }
@@ -21,7 +21,7 @@
        <a class="btn btn-lg btn-primary" href="../../components/navbar/" role="button">View navbar docs &raquo;</a>
      </div>
    </div>
-    <nav class="navbar fixed-bottom navbar-expand navbar-dark bg-dark">
+    <nav class="navbar fixed-bottom navbar-expand-sm navbar-dark bg-dark">
      <a class="navbar-brand" href="#">Bottom navbar</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
@@ -49,5 +49,5 @@ For visually hidden interactive controls, such as traditional "skip" links, `.sr
 - [The A11Y Project](http://a11yproject.com/)
 - [MDN accessibility documentation](https://developer.mozilla.org/en-US/docs/Web/Accessibility)
 - [Tenon.io Accessibility Checker](https://tenon.io/)
- [Colour Contrast Analyser (CCA)](https://www.paciellogroup.com/resources/contrastanalyser/)
+- [Colour Contrast Analyser (CCA)](https://developer.paciellogroup.com/resources/contrastanalyser/)
 - ["HTML Codesniffer" bookmarklet for identifying accessibility issues](https://github.com/squizlabs/HTML_CodeSniffer)
@@ -46,7 +46,7 @@ Running our documentation locally requires the use of Jekyll, a decently flexibl
 1. Run through the [tooling setup](#tooling-setup) above to install Jekyll (the site builder) and other Ruby dependencies with `bundle install`.
 2. From the root `/bootstrap` directory, run `npm run docs-serve` in the command line.
-3. Open <http://localhost:9001> in your browser, and voilà.
+3. Open `http://localhost:9001` in your browser, and voilà.
 Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
@@ -68,13 +68,13 @@ Bootstrap's `package.json` contains some additional metadata under the following
 Install Bootstrap in your Ruby apps using [Bundler](https://bundler.io/) (**recommended**) and [RubyGems](https://rubygems.org/) by adding the following line to your [`Gemfile`](https://bundler.io/gemfile.html):
 {% highlight ruby %}
-gem 'bootstrap', '~> 4.0.0.beta'
+gem 'bootstrap', '~> {{ site.current_ruby_version }}'
 {% endhighlight %}
 Alternatively, if you're not using Bundler, you can install the gem by running this command:
 {% highlight sh %}
-gem install bootstrap -v 4.0.0.beta
+gem install bootstrap -v {{ site.current_ruby_version }}
 {% endhighlight %}
 [See the gem's README](https://github.com/twbs/bootstrap-rubygem/blob/master/README.md) for further details.
@@ -120,6 +120,6 @@ Bootstrap's plugins don't fall back particularly gracefully when JavaScript is d
 ## Util
-All Bootstrap's JavaScript files depend on `util.js` and it has to be included alongside the other JS files. If you're using the compiled (or minified) `bootstrap.js`, there is no need to include this—it's already there.
+All Bootstrap's JavaScript files depend on `util.js` and it has to be included alongside the other JavaScript files. If you're using the compiled (or minified) `bootstrap.js`, there is no need to include this—it's already there.
 `util.js` includes utility functions and a basic helper for `transitionEnd` events as well as a CSS transition emulator. It's used by the other plugins to check for CSS transition support and to catch hanging transitions.
@@ -11,7 +11,7 @@ redirect_from: "/docs/4.0/getting-started/options/"
 In Bootstrap 3, theming was largely driven by variable overrides in LESS, custom CSS, and a separate theme stylesheet that we included in our `dist` files. With some effort, one could completely redesign the look of Bootstrap 3 without touching the core files. Bootstrap 4 provides a familiar, but slightly different approach.
-Now, theming is accomplished by Sass variables, Sass maps, and custom CSS. There's no more dedicated theme stylesheet anymore; instead, you can enable the built-in theme to add gradients, shadows, and more.
+Now, theming is accomplished by Sass variables, Sass maps, and custom CSS. There's no more dedicated theme stylesheet; instead, you can enable the built-in theme to add gradients, shadows, and more.
 ## Sass
@@ -19,7 +19,7 @@ Utilize our source Sass files to take advantage of variables, maps, mixins, and
 ### File structure
-Whenever possible, avoid modifying Bootstrap's core files. For Sass, that means creating your own stylesheet that imports Bootstrap so you can modify and extend it. Assuming you've downloaded our source files or are using package manager, you'll have a file structure that looks like this:
+Whenever possible, avoid modifying Bootstrap's core files. For Sass, that means creating your own stylesheet that imports Bootstrap so you can modify and extend it. Assuming you've downloaded our source files or are using a package manager, you'll have a file structure that looks like this:
 {% highlight plaintext %}
 your-project/
@@ -150,7 +150,7 @@ Additional functions could be added in the future or your own custom Sass to cre
 ### Color contrast
-One additional function we include in Bootstrap is the color contrast function, `color-yiq`. It utilizes the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) to automatically return a light (`#fff`) or dark (`#111`) contrast color based the specified base color. This function is especially useful for mixins or loops where you're generating multiple classes.
+One additional function we include in Bootstrap is the color contrast function, `color-yiq`. It utilizes the [YIQ color space](https://en.wikipedia.org/wiki/YIQ) to automatically return a light (`#fff`) or dark (`#111`) contrast color based on the specified base color. This function is especially useful for mixins or loops where you're generating multiple classes.
 For example, to generate color swatches from our `$theme-colors` map:
@@ -202,7 +202,7 @@ Many of Bootstrap's various components and utilities are built through a series
 ### All colors
-All colors available in Bootstrap 4, available as Sass variables and a Sass map in our `scss/_variables.scss` file. This will be expanded upon in subsequent minor releases to add additional shades, much like the [grayscale palette](#grays) we already include.
+All colors available in Bootstrap 4, are available as Sass variables and a Sass map in our `scss/_variables.scss` file. This will be expanded upon in subsequent minor releases to add additional shades, much like the [grayscale palette](#grays) we already include.
 <div class="row">
  {% for color in site.data.colors %}
@@ -172,3 +172,5 @@ $zindex-tooltip:           1070 !default;
 ```
 Background elements—like the backdrops that allow click-dismissing—tend to reside on a lower `z-index`s, while navigation and popovers utilize higher `z-index`s to ensure they overlay surrounding content.
 Additionally, the `button-group`, `input-group`, `list-group`, and `pagination` components make use of setting `z-index` to `1` or `2` in order to ensure that the borders of the _active_ element correctly appear "above" their sibling elements.
@@ -6,6 +6,12 @@ group: migration
 toc: true
 ---
 ## Beta 3 changes
 While Beta 2 saw the bulk of our breaking changes during the beta phase, but we still have a few that needed to be addressed in the Beta 3 release. These changes apply if you're updating to Beta 3 from Beta 2 or any older version of Bootstrap.
 - Removed the unused `$thumbnail-transition` variable. We weren't transitioning anything, so it was just extra code.
 ## Beta 2 changes
 While in beta, we aim to have no breaking changes. However, things don't always go as planned. Below are the breaking changes to bear in mind when moving from Beta 1 to Beta 2.
@@ -17,7 +23,7 @@ While in beta, we aim to have no breaking changes. However, things don't always
 - Renamed `.table-inverse`, `.thead-inverse`, and `.thead-default` to `.*-dark` and `.*-light`, matching our color schemes used elsewhere.
 - Responsive tables now generate classes for each grid breakpoint. This breaks from Beta 1 in that the `.table-responsive` you've been using is more like `.table-responsive-md`. You may now use `.table-responsive` or `.table-responsive-{sm,md,lg,xl}` as needed.
 - Dropped Bower support as the package manager has been deprecated for alternatives (e.g., Yarn or npm). [See bower/bower#2298](https://github.com/bower/bower/issues/2298) for details.
- Bootstrap now requires jQuery 3.0.0 or higher.
+- Bootstrap still requires jQuery 1.9.1 or higher, but you're advised to use version 3.x since v3.x's supported browsers are the ones Bootstrap supports plus v3.x has some security fixes.
 - Removed the unused `.form-control-label` class. If you did make use of this class, it was duplicate of the `.col-form-label` class that vertically centered a `<label>` with it's associated input in horizontal form layouts.
 - Changed the `color-yiq` from a mixin that included the `color` property to a function that returns a value, allowing you to use it for any CSS property. For example, instead of `color-yiq(#000)`, you'd write `color: color-yiq(#000);`.
@@ -130,7 +136,7 @@ New to Bootstrap 4 is the [Reboot]({{ site.baseurl }}/docs/{{ site.docs_version
 - Renamed `.btn-default` to `.btn-secondary`.
 - Dropped the `.btn-xs` class entirely as `.btn-sm` is proportionally much smaller than v3's.
- The [stateful button]({{ site.baseurl }}/docs/3.3/javascript/#buttons-stateful) feature of the `button.js` jQuery plugin has been dropped. This includes the `$().button(string)` and `$().button('reset')` methods. We advise using a tiny bit of custom JavaScript instead, which will have the benefit of behaving exactly the way you want it to.
+- The [stateful button]({{ site.url }}/docs/3.3/javascript/#buttons-stateful) feature of the `button.js` jQuery plugin has been dropped. This includes the `$().button(string)` and `$().button('reset')` methods. We advise using a tiny bit of custom JavaScript instead, which will have the benefit of behaving exactly the way you want it to.
  - Note that the other features of the plugin (button checkboxes, button radios, single-toggle buttons) have been retained in v4.
 - Change buttons' `[disabled]` to `:disabled` as IE9+ supports `:disabled`. However `fieldset[disabled]` is still necessary because [native disabled fieldsets are still buggy in IE11](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset#Browser_compatibility).
--- a/Show More
+++ b/Show More