From 5eda91c45ae5dad735ef54fec0e41bcf7d7ffd12 Mon Sep 17 00:00:00 2001
From: Angelos Chalaris <chalarangelo@gmail.com>
Date: Sun, 23 Oct 2016 09:14:18 +0300
Subject: [PATCH] Button module initial commit

---
 docs/v2/DEVLOG.md               | 13 ++++-
 docs/v2/index.html              |  9 +++-
 flavors/v2/mini-default.css     | 96 ++++++++-------------------------
 flavors/v2/mini-default.min.css |  2 +-
 scss/v2/_core.scss              | 90 ++++---------------------------
 scss/v2/mini-core/_button.scss  | 25 +++++++++
 scss/v2/mini-core/_table.scss   |  1 -
 7 files changed, 79 insertions(+), 157 deletions(-)
 create mode 100644 scss/v2/mini-core/_button.scss

diff --git a/docs/v2/DEVLOG.md b/docs/v2/DEVLOG.md
index 9ddb15b..957d49e 100644
--- a/docs/v2/DEVLOG.md
+++ b/docs/v2/DEVLOG.md
@@ -163,4 +163,15 @@
 - Added table styling and responsiveness, made customizable etc.
 - Added demo table to page, tested.
 - Minor consistency reorganization in table module.
-- Updated demo page, deployed live.
\ No newline at end of file
+- Updated demo page, deployed live.
+
+## 20161023
+
+- Removed `table-layout: fixed;` from tables.
+- Added `mini-core/button` and started testing button styling.
+- Removed the reset for `:-moz-focusring` (`outline: 1px dotted ButtonText`) for buttons as it was unnecessary and didn't look great.
+- Moved fix for `::-moz-focus-inner` to the `button` module.
+- Moved generic fix for Android, iOS and Safari to `button` module.
+- Removed generic styling reset for `button`, `input`, `optgroup`, `select` and `textarea` based on the fact that the styles are already applied in the first rule `html, *`.
+- Split some fixes into generic and button-specific.
+- Moved `::-webkit-file-upload-button` fixes to the `button` module.
diff --git a/docs/v2/index.html b/docs/v2/index.html
index 71eb07e..9704b21 100644
--- a/docs/v2/index.html
+++ b/docs/v2/index.html
@@ -10,7 +10,7 @@
     <link rel="icon" type="image/png" href="favicon.png">
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
     <!-- Live demo styled as of 20161021 -->
-    <link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/c9d597fac2ede99d97850a5c1f150714e1cacf0e/flavors/v2/mini-default.min.css">
+    <!-- <link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/c9d597fac2ede99d97850a5c1f150714e1cacf0e/flavors/v2/mini-default.min.css"> -->
     <link rel="stylesheet" href="../../flavors/v2/mini-default.css">   
     <style>
       #top-logo {
@@ -253,6 +253,13 @@
               </tbody>
             </table>
             <br>
+            <h3>Buttons</h3>
+            <p>Buttons are already pre-styled in <strong>mini.css</strong> to allow for consistent presentation. However, there is a lot you can do to customize them, as the pre-applied styles are mostly overrides for the default presentation styles. Pre-styled buttons and other button-like inputs can be seen below:</p>
+            <button>Normal button</button><br>
+            <input type="button" value="Input button"><br>
+            <input type="submit" value="Submit button"><br>
+            <input type="reset" value="Reset button"><br>
+            <input type="file" value="File button"><br>
           </div>
         </div>
       </div>
diff --git a/flavors/v2/mini-default.css b/flavors/v2/mini-default.css
index fe4d5a4..8c41ea4 100644
--- a/flavors/v2/mini-default.css
+++ b/flavors/v2/mini-default.css
@@ -27,6 +27,9 @@ audio, video {
 svg:not(:root) {
   overflow: hidden; }
 
+input {
+  overflow: visible; }
+
 h1, h2, h3, h4, h5, h6 {
   line-height: 1.2em;
   margin: 0.7em 8px;
@@ -591,8 +594,7 @@ table {
   border-spacing: 0;
   border: 1px solid #bdbdbd;
   border-radius: 2px;
-  margin: 0 auto;
-  table-layout: fixed; }
+  margin: 0 auto; }
 
 caption {
   font-size: 1.5em;
@@ -685,72 +687,30 @@ progress {
   progress[value="100"]::-moz-progress-bar {
     border-radius: 1px; }
 
-/**
- * 1. Change the font styles in all browsers (opinionated).
- * 2. Remove the margin in Firefox and Safari.
- */
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: sans-serif;
-  /* 1 */
-  font-size: 100%;
-  /* 1 */
-  line-height: 1.15;
-  /* 1 */
-  margin: 0;
-  /* 2 */ }
-
-/**
- * Show the overflow in IE.
- * 1. Show the overflow in Edge.
- */
-button,
-input {
-  /* 1 */
-  overflow: visible; }
-
-/**
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 1. Remove the inheritance of text transform in Firefox.
- */
-button,
-select {
-  /* 1 */
-  text-transform: none; }
-
-/**
- * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
- *    controls in Android 4.
- * 2. Correct the inability to style clickable types in iOS and Safari.
- */
-button,
-html [type="button"],
-[type="reset"],
-[type="submit"] {
-  -webkit-appearance: button;
-  /* 2 */ }
-
-/**
- * Remove the inner border and padding in Firefox.
- */
-button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
+button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
   border-style: none;
   padding: 0; }
 
+button, html [type="button"], [type="reset"], [type="submit"] {
+  -webkit-appearance: button; }
+
+button {
+  overflow: visible;
+  text-transform: none; }
+
 /**
- * Restore the focus styles unset by the previous rule.
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
  */
-button:-moz-focusring,
-[type="button"]:-moz-focusring,
-[type="reset"]:-moz-focusring,
-[type="submit"]:-moz-focusring {
-  outline: 1px dotted ButtonText; }
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  font: inherit; }
+
+/**
+ * Remove the inheritance of text transform in Firefox.
+ */
+select {
+  text-transform: none; }
 
 /**
  * Change the border, margin, and padding in all browsers (opinionated).
@@ -810,16 +770,6 @@ textarea {
 [type="search"]::-webkit-search-decoration {
   -webkit-appearance: none; }
 
-/**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
- */
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  /* 1 */
-  font: inherit;
-  /* 2 */ }
-
 /*
  * Add the correct display in IE 9-.
  * 1. Add the correct display in Edge, IE, and Firefox.
diff --git a/flavors/v2/mini-default.min.css b/flavors/v2/mini-default.min.css
index f7b2a3f..880b6f7 100644
--- a/flavors/v2/mini-default.min.css
+++ b/flavors/v2/mini-default.min.css
@@ -1 +1 @@
-*,html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-webkit-text-size-adjust:100%}body{margin:0;color:#212121;background:#fafafa}article,aside,figcaption,figure,footer,header,main,nav,section{display:block}abbr[title]{border-bottom:none;text-decoration:underline}audio,video{display:inline-block}svg:not(:root){overflow:hidden}h1,h2,h3,h4,h5,h6{line-height:1.2em;margin:.7em 8px;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#424242;display:block;margin-top:-.35em;font-size:45%}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.85em}h6{font-size:.75em}p{margin:1px 10px}b,strong{font-weight:700}hr{box-sizing:content-box;border:0;overflow:visible;line-height:1.2em;margin:.5em 4px;height:1px;background:-webkit-linear-gradient(to right,#bdbdbd,#616161,#bdbdbd);background:linear-gradient(to right,#bdbdbd,#616161,#bdbdbd)}code,kbd,pre,samp{font-family:monospace,monospace}code{border-radius:2px;background:#e0e0e0;padding:2px 4px}pre{overflow:auto;border-radius:0 2px 2px 0;background:#e0e0e0;padding:12px;margin:1px 10px;border-left:3px solid #1565c0}kbd{border-radius:2px;background:#212121;color:#fafafa;padding:2px 4px}small,sub,sup{font-size:75%}sup{top:-.5em}sub{bottom:-.25em}sub,sup{line-height:0;position:relative;vertical-align:baseline}a{color:#0277bd;text-decoration:underline;opacity:1;transition:all .3s ease 0s}a:visited{color:#01579b}a:active,a:focus,a:hover{opacity:.75}.container{margin:0 auto;padding:0 10px}.row{box-sizing:border-box;-webkit-box-flex:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;display:-webkit-flex;display:flex;-webkit-flex:0 1 auto;flex:0 1 auto;-webkit-flex-flow:row wrap;flex-flow:row wrap}.col-xs,[class^=col-xs-],[class^=col-xs-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-xs{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-xs-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-xs-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-xs-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-xs-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-xs-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-xs-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-xs-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-xs-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-xs-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-xs-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-xs-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-xs-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333%}.col-xs-offset-2{margin-left:16.66667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333%}.col-xs-offset-5{margin-left:41.66667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333%}.col-xs-offset-8{margin-left:66.66667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333%}.col-xs-offset-11{margin-left:91.66667%}@media only screen and (min-width:768px){.col-sm,[class^=col-sm-],[class^=col-sm-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-sm{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-sm-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-sm-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-sm-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-sm-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-sm-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-sm-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-sm-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-sm-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-sm-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-sm-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-sm-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-sm-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333%}.col-sm-offset-2{margin-left:16.66667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333%}.col-sm-offset-5{margin-left:41.66667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.33333%}.col-sm-offset-8{margin-left:66.66667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333%}.col-sm-offset-11{margin-left:91.66667%}}@media only screen and (min-width:1024px){.col-md,[class^=col-md-],[class^=col-md-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-md{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-md-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-md-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-md-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-md-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-md-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-md-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-md-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-md-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-md-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-md-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-md-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-md-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.33333%}.col-md-offset-2{margin-left:16.66667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333%}.col-md-offset-5{margin-left:41.66667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.33333%}.col-md-offset-8{margin-left:66.66667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333%}.col-md-offset-11{margin-left:91.66667%}}@media only screen and (min-width:1200px){.col-lg,[class^=col-lg-],[class^=col-lg-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-lg{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-lg-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-lg-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-lg-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-lg-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-lg-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-lg-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-lg-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-lg-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-lg-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-lg-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-lg-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-lg-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-lg-offset-0{margin-left:0}.col-lg-offset-1{margin-left:8.33333%}.col-lg-offset-2{margin-left:16.66667%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.33333%}.col-lg-offset-5{margin-left:41.66667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.33333%}.col-lg-offset-8{margin-left:66.66667%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.33333%}.col-lg-offset-11{margin-left:91.66667%}}table{border-collapse:separate;border-spacing:0;border:1px solid #bdbdbd;border-radius:2px;margin:0 auto;table-layout:fixed}caption{font-size:1.5em;margin:6px 0 12px}tr{padding:6px}td,th{padding:10px;border-left:1px solid #bdbdbd;border-top:1px solid #bdbdbd}th{border-top:0;background:#eceff1}td:first-child,th:first-child{border-left:0}@media only screen and (max-width:768px){table{border-collapse:collapse;border:0;width:100%}thead{border:0;height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%)}tr{display:block;border:1px solid #bdbdbd;border-radius:2px;margin-bottom:10px}td{display:block;border:0;border-bottom:1px solid #bdbdbd;text-align:right}td:before{content:attr(data-label);float:left;font-weight:700}td:last-child{border-bottom:0}}mark{background:#0277bd;color:#fafafa;font-size:95%;line-height:1;padding:1px}progress{display:block;vertical-align:baseline;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;border:0;border-radius:1px;margin:1px auto;background:#f5f5f5;color:#01579b}progress::-webkit-progress-value{background:#01579b;border-top-left-radius:1px;border-bottom-left-radius:1px}progress::-webkit-progress-bar{background:#f5f5f5}progress::-moz-progress-bar{background:#01579b;border-top-left-radius:1px;border-bottom-left-radius:1px}progress[value="100"]::-webkit-progress-value{border-radius:1px}progress[value="100"]::-moz-progress-bar{border-radius:1px}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}mark.secondary{background:#f44336}mark.tertiary{background:#558b2f}mark.tag{display:inline-block;border-radius:2px;padding:2px}mark.bubble{display:inline-block;border-radius:200px;padding:3px 5px}progress.inline{display:inline-block;vertical-align:middle;width:20em}progress.secondary{color:#e53935}progress.secondary::-webkit-progress-value{background:#e53935}progress.secondary::-moz-progress-bar{background:#e53935}progress.tertiary{color:#689f38}progress.tertiary::-webkit-progress-value{background:#689f38}progress.tertiary::-moz-progress-bar{background:#689f38}progress.nano{height:2px;margin:0 auto 1px;border-radius:0}progress.nano::-webkit-progress-value{border-top-left-radius:0;border-bottom-left-radius:0}progress.nano::-moz-progress-bar{border-top-left-radius:0;border-bottom-left-radius:0}progress.nano[value="100"]::-webkit-progress-value{border-radius:0}progress.nano[value="100"]::-moz-progress-bar{border-radius:0}
\ No newline at end of file
+*,html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-webkit-text-size-adjust:100%}body{margin:0;color:#212121;background:#fafafa}article,aside,figcaption,figure,footer,header,main,nav,section{display:block}abbr[title]{border-bottom:none;text-decoration:underline}audio,video{display:inline-block}svg:not(:root){overflow:hidden}input{overflow:visible}h1,h2,h3,h4,h5,h6{line-height:1.2em;margin:.7em 8px;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#424242;display:block;margin-top:-.35em;font-size:45%}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.85em}h6{font-size:.75em}p{margin:1px 10px}b,strong{font-weight:700}hr{box-sizing:content-box;border:0;overflow:visible;line-height:1.2em;margin:.5em 4px;height:1px;background:-webkit-linear-gradient(to right,#bdbdbd,#616161,#bdbdbd);background:linear-gradient(to right,#bdbdbd,#616161,#bdbdbd)}code,kbd,pre,samp{font-family:monospace,monospace}code{border-radius:2px;background:#e0e0e0;padding:2px 4px}pre{overflow:auto;border-radius:0 2px 2px 0;background:#e0e0e0;padding:12px;margin:1px 10px;border-left:3px solid #1565c0}kbd{border-radius:2px;background:#212121;color:#fafafa;padding:2px 4px}small,sub,sup{font-size:75%}sup{top:-.5em}sub{bottom:-.25em}sub,sup{line-height:0;position:relative;vertical-align:baseline}a{color:#0277bd;text-decoration:underline;opacity:1;transition:all .3s ease 0s}a:visited{color:#01579b}a:active,a:focus,a:hover{opacity:.75}.container{margin:0 auto;padding:0 10px}.row{box-sizing:border-box;-webkit-box-flex:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;display:-webkit-flex;display:flex;-webkit-flex:0 1 auto;flex:0 1 auto;-webkit-flex-flow:row wrap;flex-flow:row wrap}.col-xs,[class^=col-xs-],[class^=col-xs-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-xs{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-xs-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-xs-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-xs-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-xs-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-xs-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-xs-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-xs-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-xs-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-xs-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-xs-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-xs-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-xs-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333%}.col-xs-offset-2{margin-left:16.66667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333%}.col-xs-offset-5{margin-left:41.66667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333%}.col-xs-offset-8{margin-left:66.66667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333%}.col-xs-offset-11{margin-left:91.66667%}@media only screen and (min-width:768px){.col-sm,[class^=col-sm-],[class^=col-sm-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-sm{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-sm-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-sm-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-sm-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-sm-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-sm-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-sm-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-sm-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-sm-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-sm-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-sm-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-sm-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-sm-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333%}.col-sm-offset-2{margin-left:16.66667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333%}.col-sm-offset-5{margin-left:41.66667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.33333%}.col-sm-offset-8{margin-left:66.66667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333%}.col-sm-offset-11{margin-left:91.66667%}}@media only screen and (min-width:1024px){.col-md,[class^=col-md-],[class^=col-md-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-md{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-md-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-md-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-md-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-md-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-md-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-md-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-md-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-md-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-md-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-md-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-md-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-md-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.33333%}.col-md-offset-2{margin-left:16.66667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333%}.col-md-offset-5{margin-left:41.66667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.33333%}.col-md-offset-8{margin-left:66.66667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333%}.col-md-offset-11{margin-left:91.66667%}}@media only screen and (min-width:1200px){.col-lg,[class^=col-lg-],[class^=col-lg-offset-]{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;flex:0 0 auto;padding:0 4px}.col-lg{-webkit-box-flex:1;max-width:100%;-webkit-flex-grow:1;flex-grow:1;-webkit-flex-basis:0;flex-basis:0}.col-lg-1{max-width:8.33333%;-webkit-flex-basis:8.33333%;flex-basis:8.33333%}.col-lg-2{max-width:16.66667%;-webkit-flex-basis:16.66667%;flex-basis:16.66667%}.col-lg-3{max-width:25%;-webkit-flex-basis:25%;flex-basis:25%}.col-lg-4{max-width:33.33333%;-webkit-flex-basis:33.33333%;flex-basis:33.33333%}.col-lg-5{max-width:41.66667%;-webkit-flex-basis:41.66667%;flex-basis:41.66667%}.col-lg-6{max-width:50%;-webkit-flex-basis:50%;flex-basis:50%}.col-lg-7{max-width:58.33333%;-webkit-flex-basis:58.33333%;flex-basis:58.33333%}.col-lg-8{max-width:66.66667%;-webkit-flex-basis:66.66667%;flex-basis:66.66667%}.col-lg-9{max-width:75%;-webkit-flex-basis:75%;flex-basis:75%}.col-lg-10{max-width:83.33333%;-webkit-flex-basis:83.33333%;flex-basis:83.33333%}.col-lg-11{max-width:91.66667%;-webkit-flex-basis:91.66667%;flex-basis:91.66667%}.col-lg-12{max-width:100%;-webkit-flex-basis:100%;flex-basis:100%}.col-lg-offset-0{margin-left:0}.col-lg-offset-1{margin-left:8.33333%}.col-lg-offset-2{margin-left:16.66667%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.33333%}.col-lg-offset-5{margin-left:41.66667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.33333%}.col-lg-offset-8{margin-left:66.66667%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.33333%}.col-lg-offset-11{margin-left:91.66667%}}table{border-collapse:separate;border-spacing:0;border:1px solid #bdbdbd;border-radius:2px;margin:0 auto}caption{font-size:1.5em;margin:6px 0 12px}tr{padding:6px}td,th{padding:10px;border-left:1px solid #bdbdbd;border-top:1px solid #bdbdbd}th{border-top:0;background:#eceff1}td:first-child,th:first-child{border-left:0}@media only screen and (max-width:768px){table{border-collapse:collapse;border:0;width:100%}thead{border:0;height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%)}tr{display:block;border:1px solid #bdbdbd;border-radius:2px;margin-bottom:10px}td{display:block;border:0;border-bottom:1px solid #bdbdbd;text-align:right}td:before{content:attr(data-label);float:left;font-weight:700}td:last-child{border-bottom:0}}mark{background:#0277bd;color:#fafafa;font-size:95%;line-height:1;padding:1px}progress{display:block;vertical-align:baseline;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;border:0;border-radius:1px;margin:1px auto;background:#f5f5f5;color:#01579b}progress::-webkit-progress-value{background:#01579b;border-top-left-radius:1px;border-bottom-left-radius:1px}progress::-webkit-progress-bar{background:#f5f5f5}progress::-moz-progress-bar{background:#01579b;border-top-left-radius:1px;border-bottom-left-radius:1px}progress[value="100"]::-webkit-progress-value{border-radius:1px}progress[value="100"]::-moz-progress-bar{border-radius:1px}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}button{overflow:visible;text-transform:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}select{text-transform:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}details,menu{display:block}summary{display:list-item}mark.secondary{background:#f44336}mark.tertiary{background:#558b2f}mark.tag{display:inline-block;border-radius:2px;padding:2px}mark.bubble{display:inline-block;border-radius:200px;padding:3px 5px}progress.inline{display:inline-block;vertical-align:middle;width:20em}progress.secondary{color:#e53935}progress.secondary::-webkit-progress-value{background:#e53935}progress.secondary::-moz-progress-bar{background:#e53935}progress.tertiary{color:#689f38}progress.tertiary::-webkit-progress-value{background:#689f38}progress.tertiary::-moz-progress-bar{background:#689f38}progress.nano{height:2px;margin:0 auto 1px;border-radius:0}progress.nano::-webkit-progress-value{border-top-left-radius:0;border-bottom-left-radius:0}progress.nano::-moz-progress-bar{border-top-left-radius:0;border-bottom-left-radius:0}progress.nano[value="100"]::-webkit-progress-value{border-radius:0}progress.nano[value="100"]::-moz-progress-bar{border-radius:0}
\ No newline at end of file
diff --git a/scss/v2/_core.scss b/scss/v2/_core.scss
index a40a52a..bd14e47 100644
--- a/scss/v2/_core.scss
+++ b/scss/v2/_core.scss
@@ -44,11 +44,16 @@ audio, video {
   display: inline-block;
 }
 
-// Hide overflow in IE
+// Hide overflow in IE.
 svg:not(:root) {
   overflow: hidden;
 }
 
+// Show overflow in IE.
+input { 
+  overflow: visible;
+}
+
 // Fix display in older versions of Android.
 $include-dfn-fix: true !default;
 @if $include-dfn-fix {
@@ -343,81 +348,18 @@ a{
 @import 'mini-core/table';
 @import 'mini-core/contextual';
 @import 'mini-core/progress';
+@import 'mini-core/button';
 
-// TODO: Move to forms and buttons respectively
+// TODO: Move to forms.
 
 /**
- * 1. Change the font styles in all browsers (opinionated).
- * 2. Remove the margin in Firefox and Safari.
+ * Remove the inheritance of text transform in Firefox.
  */
 
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: sans-serif; /* 1 */
-  font-size: 100%; /* 1 */
-  line-height: 1.15; /* 1 */
-  margin: 0; /* 2 */
-}
-
-/**
- * Show the overflow in IE.
- * 1. Show the overflow in Edge.
- */
-
-button,
-input { /* 1 */
-  overflow: visible;
-}
-
-/**
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 1. Remove the inheritance of text transform in Firefox.
- */
-
-button,
-select { /* 1 */
+select { 
   text-transform: none;
 }
 
-/**
- * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
- *    controls in Android 4.
- * 2. Correct the inability to style clickable types in iOS and Safari.
- */
-
-button,
-html [type="button"], /* 1 */
-[type="reset"],
-[type="submit"] {
-  -webkit-appearance: button; /* 2 */
-}
-
-/**
- * Remove the inner border and padding in Firefox.
- */
-
-button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-/**
- * Restore the focus styles unset by the previous rule.
- */
-
-button:-moz-focusring,
-[type="button"]:-moz-focusring,
-[type="reset"]:-moz-focusring,
-[type="submit"]:-moz-focusring {
-  outline: 1px dotted ButtonText;
-}
-
 /**
  * Change the border, margin, and padding in all browsers (opinionated).
  */
@@ -448,8 +390,6 @@ legend {
  * Remove the default vertical scrollbar in IE.
  */
 
-// TODO: Move to forms
-
 textarea {
   overflow: auto;
 }
@@ -482,16 +422,6 @@ textarea {
   -webkit-appearance: none;
 }
 
-/**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
- */
-
-::-webkit-file-upload-button {
-  -webkit-appearance: button; /* 1 */
-  font: inherit; /* 2 */
-}
-
 /*
  * Add the correct display in IE 9-.
  * 1. Add the correct display in Edge, IE, and Firefox.
diff --git a/scss/v2/mini-core/_button.scss b/scss/v2/mini-core/_button.scss
new file mode 100644
index 0000000..9583743
--- /dev/null
+++ b/scss/v2/mini-core/_button.scss
@@ -0,0 +1,25 @@
+// Definitions for the button and button-like elements.
+// Different elements are styled based on the same set of rules.
+// Reset for Firefox focusing on button elements.
+button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+// Fixes for Android 4, iOS and Safari.
+button, html [type="button"], [type="reset"], [type="submit"] {
+  -webkit-appearance: button;
+}
+// Other fixes
+button {
+	overflow: visible;	// Show the overflow in IE.
+	text-transform: none;	// Remove inheritance of text-transform in Edge, Firefox, and IE.
+}
+// TODO: Test and see if these are needed etc.
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+::-webkit-file-upload-button {
+  -webkit-appearance: button; // 1
+  font: inherit; // 2
+}
diff --git a/scss/v2/mini-core/_table.scss b/scss/v2/mini-core/_table.scss
index 4d914a4..7131343 100644
--- a/scss/v2/mini-core/_table.scss
+++ b/scss/v2/mini-core/_table.scss
@@ -7,7 +7,6 @@ table {
 	border: $table-border-style;
 	border-radius: $table-border-radius;
 	margin: $table-margin;
-	table-layout: fixed;
 }
 caption {
 	font-size: $table-caption-font-size;