Merge pull request #14765 from mauriciofauth/bootstrap

Add initial support for Bootstrap 4

ChangeLog

@@ -24,6 +24,7 @@ phpMyAdmin - ChangeLog
 - issue #13023 Show errors at the bottom of the page and add copy query button for errors in processing sql queries
 - issue #14633 Use Sass instead of PHP to compile CSS
 - issue #14053 Fix missed padding on query results
+- issue #14765 Add initial support for Bootstrap 4
 
 4.8.5 (not yet released)
 

package.json

@@ -6,6 +6,7 @@
   "author": "The phpMyAdmin Team <developers@phpmyadmin.net> (https://www.phpmyadmin.net/team/)",
   "license": "GPL-2.0",
   "dependencies": {
+    "bootstrap": "^4.1.3",
     "codemirror": "5.37.0",
     "jquery": "3.3.1",
     "jquery-migrate": "3.0.1",

themes/metro/scss/_common.scss

@@ -356,6 +356,7 @@ h3 {
   font-family: $font-family-extra-bold;
   text-transform: uppercase;
   font-weight: normal;
+  font-size: 1rem;
 }
 
 a {
@@ -544,6 +545,8 @@ fieldset {
 
 legend {
   padding: 0 5px;
+  width: initial;
+  font-size: 1rem;
 }
 
 .some-margin {
@@ -1462,6 +1465,7 @@ div#tablestatistics table {
   color: $button-color;
   background: $navi-background;
   height: 15px;
+  box-sizing: content-box;
 
   .item {
     font-family: $font-family;

themes/metro/scss/_navigation.scss

@@ -76,6 +76,7 @@
     cursor: default;
     height: 15px;
     line-height: 100%;
+    box-sizing: content-box;
 
     &::after {
       font-family: $font-family-extra-bold;
@@ -108,6 +109,10 @@
     padding-bottom: 1em;
     text-align: center;
     background-color: $border-color;
+
+    a {
+      box-sizing: content-box;
+    }
   }
 }
 
@@ -232,6 +237,7 @@ img {
 #pma_navigation_tree {
   a {
     color: $navi-color;
+    padding-left: 0;
 
     &:hover {
       text-decoration: none;
@@ -240,6 +246,8 @@ img {
   }
 
   li {
+    margin-bottom: 0;
+
     &.activePointer,
     &.selected {
       color: $th-color;

themes/metro/scss/theme.scss

@@ -1,3 +1,4 @@
+@import "../../../node_modules/bootstrap/scss/bootstrap";
 @import "../../pmahomme/scss/direction";
 @import "variables";
 @import "common";

themes/original/scss/_common.scss

@@ -58,6 +58,7 @@ h2 {
 
 h3 {
   font-weight: bold;
+  font-size: 1rem;
 }
 
 a {
@@ -157,6 +158,8 @@ fieldset {
     font-weight: bold;
     color: #444;
     background-color: transparent;
+    width: initial;
+    font-size: 1rem;
   }
 }
 
@@ -1022,6 +1025,7 @@ div#tablestatistics table {
   padding-bottom: 0.5em;
   width: 10000px;
   overflow: hidden;
+  box-sizing: content-box;
 
   .item {
     white-space: nowrap;

themes/original/scss/_navigation.scss

@@ -145,6 +145,7 @@
 #pma_navigation_tree {
   a {
     color: $navi-color;
+    padding-left: 0;
 
     &:hover {
       text-decoration: underline;
@@ -152,6 +153,8 @@
   }
 
   li {
+    margin-bottom: 0;
+
     &.activePointer,
     &.selected {
       color: $navi-pointer-color;

themes/original/scss/theme.scss

@@ -1,3 +1,4 @@
+@import "../../../node_modules/bootstrap/scss/bootstrap";
 @import "../../pmahomme/scss/direction";
 @import "variables";
 @import "common";

themes/pmahomme/scss/_common.scss

@@ -83,6 +83,7 @@ h2 {
 
 h3 {
   font-weight: bold;
+  font-size: 1rem;
 }
 
 a {
@@ -518,6 +519,8 @@ fieldset {
     -moz-box-shadow: 3px 3px 15px #bbb;
     -webkit-box-shadow: 3px 3px 15px #bbb;
     box-shadow: 3px 3px 15px #bbb;
+    width: initial;
+    font-size: 1rem;
   }
 }
 
@@ -1460,6 +1463,7 @@ div#tablestatistics table {
   max-width: 100%;
   max-height: 16px;
   overflow: hidden;
+  box-sizing: content-box;
 
   .item {
     white-space: nowrap;

themes/pmahomme/scss/_navigation.scss

@@ -125,6 +125,7 @@
 
   a {
     color: $navi-color;
+    padding-left: 0;
 
     &:hover {
       text-decoration: underline;
@@ -143,6 +144,8 @@
   }
 
   li {
+    margin-bottom: 0;
+
     &.activePointer,
     &.selected {
       color: $navi-pointer-color;

themes/pmahomme/scss/theme.scss

@@ -1,3 +1,4 @@
+@import "../../../node_modules/bootstrap/scss/bootstrap";
 @import "direction";
 @import "variables";
 @import "common";

yarn.lock

@@ -340,6 +340,11 @@ binary-extensions@^1.0.0:
   resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-1.12.0.tgz#c2d780f53d45bba8317a8902d4ceeaf3a6385b14"
   integrity sha512-DYWGk01lDcxeS/K9IHPGWfT8PsJmbXRtRd2Sx72Tnb8pcYZQFF1oSDb8hJtS1vhp212q1Rzi5dUf9+nq0o9UIg==
 
+bootstrap@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.1.3.tgz#0eb371af2c8448e8c210411d0cb824a6409a12be"
+  integrity sha512-rDFIzgXcof0jDyjNosjv4Sno77X4KuPeFxG2XZZv1/Kc8DRVGVADdoQyyOVDwPqL36DDmtCQbrpMCqvpPLJQ0w==
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"