Toolkit file comparison, minor changes and updates to the files

docs/v2/DEVLOG.md

@@ -425,3 +425,7 @@
 - Added some custom styling for the cards in `index`.
 - Changed the `border-radius` of `card`s to `0`.
 - Deployed new live demo page.
+- Fixed a mixup bug with `header` and `heading`. All the `hX` elements now use `heading` instead of `header` to deal with that problem.
+- Slightly tweaked the `margin`s and stuff of `p` and `hX` elements.
+- Added file size comparison between toolkits.
+- Updated `table` `border-radius`es.

docs/v2/index.html

@@ -4,7 +4,7 @@
     <!-- Live demo styled as of 20161111 -->
     <link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/5dcfabb7f3bdb01834414c27d2cca637e481c3b8/dist/mini-default.min.css">
     <!-- Local stylesheet -->
-    <!-- <link rel="stylesheet" href="../../dist/mini-default.min.css"> -->
+    <link rel="stylesheet" href="../../dist/mini-default.min.css">
     <title>mini.css - A minimal Sass-y responsive mobile-first style-agnostic CSS framework</title>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -101,6 +101,63 @@
           </div>
         </div>
       </div>
+      <div class="row">
+        <div class="col-sm">
+          <h2>Quick overview</h2>
+          <p>Take a couple of minutes to learn how <strong>mini.css</strong> differs from all those other UI toolkits (Bootstrap, Semantic UI etc).</p>
+          <hr>
+          <table>        
+              <caption>Toolkit file size comparison</caption>
+              <thead>
+                <tr>
+                  <th>Name</th>
+                  <th>Version</th>
+                  <th>Size (uncompressed)</th>
+                  <th>Size (minified)</th>
+                  <th>Size (gzipped)</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td data-label="Name">Bootstrap</td>
+                  <td data-label="Version"><a href="https://github.com/twbs/bootstrap/blob/0b9c4a4007c44201dce9a6cc1a38407005c26c86/dist/css/bootstrap.css">v3.3.7</a></td>
+                  <td data-label="Size (uncompressed)">143 KB</td>
+                  <td data-label="Size (minified)">117 KB</td>
+                  <td data-label="Size (gzipped)">20 KB</td>
+                </tr>
+                <tr>
+                  <td data-label="Name">Material Framework</td>
+                  <td data-label="Version"><a href="https://github.com/nt1m/material-framework/blob/c5f7fed174686118dded31aecca311d4cc9d8b07/css/material.css">v3.0</a></td>
+                  <td data-label="Size (uncompressed)">114 KB</td>
+                  <td data-label="Size (minified)">90 KB</td>
+                  <td data-label="Size (gzipped)">18 KB</td>
+                </tr>
+                <tr>
+                  <td data-label="Name">mini.css</td>
+                  <td data-label="Version"><a href="https://github.com/chalarangelo/mini.css/blob/v2.0/dist/css/mini-default.css">v2.0</a></td>
+                  <td data-label="Size (uncompressed)">38 KB</td>
+                  <td data-label="Size (minified)">31 KB</td>
+                  <td data-label="Size (gzipped)">6 KB</td>
+                </tr>
+                <tr>
+                  <td data-label="Name">Semantic UI</td>
+                  <td data-label="Version"><a href="https://github.com/Semantic-Org/Semantic-UI/blob/0b1b59b0e1c780e842820df5c1904a162034812c/dist/semantic.css">v2.2.6</a></td>
+                  <td data-label="Size (uncompressed)">730 KB</td>
+                  <td data-label="Size (minified)">550 KB</td>
+                  <td data-label="Size (gzipped)">95 KB</td>
+                </tr>
+                <tr>
+                  <td data-label="Name">Zurb Foundation</td>
+                  <td data-label="Version"><a href="https://github.com/zurb/foundation-sites/blob/ab172838d6de406204956015c9fd393c5a526e0e/dist/foundation.css">v3.0</a></td>
+                  <td data-label="Size (uncompressed)">90 KB</td>
+                  <td data-label="Size (minified)">64 KB</td>
+                  <td data-label="Size (gzipped)">12 KB</td>
+                </tr>
+              </tbody>
+          </table><br>
+          <p><mark class="secondary" style="font-size: 1.4em; padding: 3px 10px;">!</mark>&nbsp;The above comparison takes into account only the CSS files of each framework. <strong>mini.css</strong>'s size is an approximation due to the nature of its flavor system. The calculated results were produced using <a href="http://refresh-sf.com/">Refresh-SF</a>.</p>
+        </div>
+      </div>
     </div></main>
     <!-- End of page content-->
     <footer><strong>mini.css</strong> was designed and built by <a href="https://github.com/Chalarangelo">@Chalarangelo</a>. It is licensed under the <a href="https://github.com/Chalarangelo/mini.css/blob/master/LICENSE">MIT License</a>. You can view the project's source code on <a href="https://github.com/Chalarangelo/mini.css">Github</a>.</footer>