Move browser feature requests to new "Most wanted features" section

Ports 58aca2823404d6dc18fd44ae15f7ff2f34f64705 to v3

3 files changed, 89 insertions, 60 deletions

diff --git a/docs/_data/browser-bugs.yml b/docs/_data/browser-bugs.yml
index 715eee741..5f11e36a7 100644
--- a/docs/_data/browser-bugs.yml
+++ b/docs/_data/browser-bugs.yml
@@ -72,16 +72,6 @@
   browser: >
     Microsoft Edge
   summary: >
-    Implement the `:dir()` pseudo-class from Selectors Level 4
-  upstream_bug: >
-    UserVoice#12299532
-  origin: >
-    Bootstrap#19984
-
--
-  browser: >
-    Microsoft Edge
-  summary: >
     Hovering over descendant SVG element fires `mouseleave` event at ancestor
   upstream_bug: >
     Edge#7787318
@@ -122,16 +112,6 @@
   browser: >
     Firefox
   summary: >
-    Fire `transitioncancel` event when a transition is canceled
-  upstream_bug: >
-    Mozilla#1264125
-  origin: >
-    Mozilla#1182856
-
--
-  browser: >
-    Firefox
-  summary: >
     Wide floated table doesn't wrap onto new line
   upstream_bug: >
     Mozilla#1277782
@@ -152,16 +132,6 @@
   browser: >
     Firefox
   summary: >
-    Implement the `of <selector-list>` clause of the `:nth-child()` pseudo-class
-  upstream_bug: >
-    Mozilla#854148
-  origin: >
-    Bootstrap#20143
-
--
-  browser: >
-    Firefox
-  summary: >
     `position: absolute` element that's wider than its column renders differently than other browsers
   upstream_bug: >
     Mozilla#1282363
@@ -252,16 +222,6 @@
   browser: >
     Chrome
   summary: >
-    Implement the `:dir()` pseudo-class from Selectors Level 4
-  upstream_bug: >
-    Chromium#576815
-  origin: >
-    Bootstrap#19984
-
--
-  browser: >
-    Chrome
-  summary: >
     Don't make `:hover` sticky on touch-friendly webpages
   upstream_bug: >
     Chromium#370155
@@ -270,16 +230,6 @@
 
 -
   browser: >
-    Chrome
-  summary: >
-    Implement the `of <selector-list>` clause of the `:nth-child()` pseudo-class
-  upstream_bug: >
-    Chromium#304163
-  origin: >
-    Bootstrap#20143
-
--
-  browser: >
     Chrome (Windows & Linux)
   summary: >
     Animation glitch when returning to inactive tab after animations occurred while tab was hidden.
@@ -302,16 +252,6 @@
 
 -
   browser: >
-    Safari
-  summary: >
-    Implement the `:dir()` pseudo-class from Selectors Level 4
-  upstream_bug: >
-    WebKit#64861
-  origin: >
-    Bootstrap#19984
-
--
-  browser: >
     Safari (OS X)
   summary: >
     `px`, `em`, and `rem` should all behave the same in media queries when page zoom is applied
diff --git a/docs/_data/browser-features.yml b/docs/_data/browser-features.yml
new file mode 100644
index 000000000..1ac88af25
--- /dev/null
+++ b/docs/_data/browser-features.yml
@@ -0,0 +1,59 @@
+-
+  browser: >
+    Microsoft Edge
+  summary: >
+    Implement the [`:dir()` pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:dir) from Selectors Level 4
+  upstream_bug: >
+    UserVoice#12299532
+  origin: >
+    Bootstrap#19984
+
+-
+  browser: >
+    Firefox
+  summary: >
+    Fire a [`transitioncancel` event](https://developer.mozilla.org/en-US/docs/Web/Events/transitioncancel) when a CSS transition is canceled
+  upstream_bug: >
+    Mozilla#1264125
+  origin: >
+    Mozilla#1182856
+
+-
+  browser: >
+    Firefox
+  summary: >
+    Implement the [`of <selector-list>` clause](http://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
+  upstream_bug: >
+    Mozilla#854148
+  origin: >
+    Bootstrap#20143
+
+-
+  browser: >
+    Chrome
+  summary: >
+    Implement the [`of <selector-list>` clause](http://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
+  upstream_bug: >
+    Chromium#304163
+  origin: >
+    Bootstrap#20143
+
+-
+  browser: >
+    Chrome
+  summary: >
+    Implement the [`:dir()` pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:dir) from Selectors Level 4
+  upstream_bug: >
+    Chromium#576815
+  origin: >
+    Bootstrap#19984
+
+-
+  browser: >
+    Safari
+  summary: >
+    Implement the [`:dir()` pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:dir) from Selectors Level 4
+  upstream_bug: >
+    WebKit#64861
+  origin: >
+    Bootstrap#19984
diff --git a/docs/browser-bugs.html b/docs/browser-bugs.html
index bb04c2d08..7ad42bac3 100644
--- a/docs/browser-bugs.html
+++ b/docs/browser-bugs.html
@@ -42,3 +42,33 @@ fullwidth: true
     </table>
   </div>
 </div>
+
+<div class="bs-docs-section">
+  <h1 id="most-wanted" class="page-header">Most wanted features</h1>
+
+  <p class="lead">There are several features specified in Web standards which would allow us to make Bootstrap more robust, elegant, or performant, but aren't yet implemented in certain browsers, thus preventing us from taking advantage of them.</p>
+  <p>We publicly list these "most wanted" feature requests here, in the hopes of expediting the process of getting them implemented.</p>
+
+   <div class="table-responsive">
+     <table class="bs-docs-browser-bugs table table-bordered table-hover">
+       <thead>
+         <tr>
+           <th>Browser(s)</th>
+           <th>Summary of feature</th>
+           <th>Upstream issue(s)</th>
+           <th>Bootstrap issue(s)</th>
+         </tr>
+       </thead>
+       <tbody>
+         {% for feat in site.data.browser-features %}
+         <tr>
+           <td>{{ feat.browser }}</td>
+           <td>{{ feat.summary | markdownify | bugify }}</td>
+           <td>{{ feat.upstream_bug | bugify }}</td>
+           <td>{{ feat.origin | bugify }}</td>
+         </tr>
+         {% endfor %}
+       </tbody>
+     </table>
+   </div>
+</div>