bootstrap upgrade, table fixes

package.json

@@ -76,7 +76,7 @@
   "main": "dist/js/tabler.js",
   "homepage": "https://tabler.io",
   "devDependencies": {
-    "@babel/preset-env": "^7.9.5",
+    "@babel/preset-env": "^7.9.6",
     "browser-sync": "^2.26.7",
     "bundlesize": "^0.18.0",
     "child_process": "^1.0.2",
@@ -85,30 +85,30 @@
     "eslint": "^6.8.0",
     "eslint-config-xo": "^0.29.1",
     "eslint-plugin-import": "^2.20.2",
-    "eslint-plugin-unicorn": "^18.0.1",
+    "eslint-plugin-unicorn": "^19.0.1",
     "glob": "^7.1.6",
     "gulp": "^4.0.2",
-    "http-server": "^0.12.1",
+    "http-server": "^0.12.3",
     "icon-font-generator": "^2.1.10",
-    "node-sass": "^4.13.1",
+    "node-sass": "^4.14.0",
     "node-sass-package-importer": "^5.3.2",
     "nodemon": "^2.0.3",
     "npm-run-all": "^4.1.5",
     "percy": "^0.26.2",
-    "postcss-cli": "^7.1.0",
-    "rollup": "^2.6.1",
+    "postcss-cli": "^7.1.1",
+    "rollup": "^2.7.6",
     "rollup-plugin-babel": "^4.4.0",
     "rollup-plugin-babel-minify": "^10.0.0",
     "rollup-plugin-commonjs": "^10.1.0",
-    "rollup-plugin-filesize": "^7.0.0",
+    "rollup-plugin-filesize": "^8.0.0",
     "rollup-plugin-multi-input": "^1.1.1",
     "rollup-plugin-node-resolve": "^5.2.0",
-    "shelljs": "^0.8.3",
-    "stylelint": "^13.3.2",
-    "stylelint-config-twbs-bootstrap": "^2.0.1",
+    "shelljs": "^0.8.4",
+    "stylelint": "^13.3.3",
+    "stylelint-config-twbs-bootstrap": "^2.0.2",
     "svgo": "^1.3.2",
-    "tabler-icons": "^1.6.0",
-    "terser": "^4.6.11",
+    "tabler-icons": "^1.6.1",
+    "terser": "^4.6.13",
     "yaml": "^1.9.2"
   },
   "dependencies": {
@@ -117,10 +117,10 @@
     "@fullcalendar/interaction": "^4.4.0",
     "@fullcalendar/list": "^4.4.0",
     "@fullcalendar/timegrid": "^4.4.0",
-    "apexcharts": "^3.18.1",
+    "apexcharts": "^3.19.0",
     "autosize": "^4.0.2",
-    "bootstrap": "twbs/bootstrap#ed32ee2",
-    "countup.js": "^2.0.4",
+    "bootstrap": "twbs/bootstrap#81404d2",
+    "countup.js": "^2.0.5",
     "daterangepicker": "^3.0.5",
     "flatpickr": "^4.6.3",
     "fullcalendar": "^3.10.1",

pages/_includes/cards/invoices.html

@@ -28,12 +28,12 @@
 			<tr>
 				<th class="w-1"><input class="form-check-input m-0 align-middle" type="checkbox"></th>
 				<th class="w-1">No. {% include ui/icon.html icon="chevron-up" class="icon-sm text-dark icon-thick" %}</th>
-				<th>Invoice Subject {% include ui/icon.html icon="code" %}</th>
-				<th>Client {% include ui/icon.html icon="code" %}</th>
-				<th>VAT No. {% include ui/icon.html icon="code" %}</th>
-				<th>Created {% include ui/icon.html icon="code" %}</th>
-				<th>Status {% include ui/icon.html icon="code" %}</th>
-				<th>Price {% include ui/icon.html icon="code" %}</th>
+				<th>Invoice Subject</th>
+				<th>Client</th>
+				<th>VAT No.</th>
+				<th>Created</th>
+				<th>Status</th>
+				<th>Price</th>
 				<th></th>
 			</tr>
 			</thead>

scss/_variables.scss

@@ -448,7 +448,12 @@ $spinner-border-width-sm: 1px !default;
 
 //tables
 $table-head-border-color: $border-color !default;
+$table-head-padding-y: .5rem !default;
+$table-head-color: $text-muted !default;
+$table-head-bg: $min-black !default;
+$table-group-seperator-color: $border-color !default;
 $table-striped-order: even !default;
+$table-striped-bg: $min-black !default;
 $table-accent-bg: $min-black !default;
 
 //toasts

scss/ui/_tables.scss

@@ -1,50 +1,33 @@
 .table {
-  color: inherit;
-
   thead {
     th {
-      background: $min-black;
-      border-width: $table-border-width;
+      color: $table-head-color;
+      background: $table-head-bg;
       @include subheader;
-      padding-top: .5rem;
-      padding-bottom: .5rem;
+      padding-top: $table-head-padding-y;
+      padding-bottom: $table-head-padding-y;
 
       @media print {
         background: transparent;
       }
     }
   }
-
-  th {
-    color: $text-muted;
-  }
 }
 
 .table-nowrap {
-  th,
-  td {
+  > :not(caption) > * > * {
     white-space: nowrap;
   }
 }
 
-
-.table-md {
-  th,
-  td {
-    padding: .5rem;
-  }
-}
-
 .table-vcenter {
-  td,
-  th {
+  > :not(caption) > * > * {
     vertical-align: middle;
   }
 }
 
 .table-center {
-  td,
-  th {
+  > :not(caption) > * > * {
     text-align: center;
   }
 }