Updated Select form control.

9 files changed, 365 insertions, 302 deletions

diff --git a/kvision-modules/kvision-bootstrap-select/build.gradle b/kvision-modules/kvision-bootstrap-select/build.gradle
index 83bcd627..7c10515f 100644
--- a/kvision-modules/kvision-bootstrap-select/build.gradle
+++ b/kvision-modules/kvision-bootstrap-select/build.gradle
@@ -7,8 +7,8 @@ dependencies {
 kotlinFrontend {
 
     npm {
-        dependency("bootstrap-select", "1.12.4")
-        dependency("ajax-bootstrap-select", "1.4.3")
+        dependency("bootstrap-select", "1.13.11")
+        dependency("ajax-bootstrap-select", "1.4.5")
     }
 
 }
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/KVManagerSelect.kt b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/KVManagerSelect.kt
index 3617c417..09f92a0d 100644
--- a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/KVManagerSelect.kt
+++ b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/KVManagerSelect.kt
@@ -36,6 +36,7 @@ internal object KVManagerSelect {
         require("./js/locales/bootstrap-select/bootstrap-select-i18n.min.js")
         require("ajax-bootstrap-select/dist/css/ajax-bootstrap-select.min.css")
         require("ajax-bootstrap-select/dist/js/ajax-bootstrap-select.min.js")
+        require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.cs-CZ.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.de-DE.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.es-ES.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.fr-FR.min.js")
@@ -46,7 +47,11 @@ internal object KVManagerSelect {
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.pl-PL.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.pt-BR.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.ru-RU.min.js")
+        require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.sr-SP.min.js")
         require("./js/locales/ajax-bootstrap-select/ajax-bootstrap-select.tr-TR.min.js")
+        js("$.fn.selectpicker.Constructor.BootstrapVersion = '4';")
+        js("$.fn.selectpicker.Constructor.DEFAULTS.styleBase = 'form-control';");
+        js("$.fn.selectpicker.Constructor.DEFAULTS.style = '';")
     }
 
     internal fun init() {}
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.cs-CZ.min.js b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.cs-CZ.min.js
new file mode 100644
index 00000000..994014a9
--- /dev/null
+++ b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.cs-CZ.min.js
@@ -0,0 +1,23 @@
+/*!
+ * Ajax Bootstrap Select
+ *
+ * Extends existing [Bootstrap Select] implementations by adding the ability to search via AJAX requests as you type. Originally for CROSCON.
+ *
+ * @version 1.4.5
+ * @author Adam Heim - https://github.com/truckingsim
+ * @link https://github.com/truckingsim/Ajax-Bootstrap-Select
+ * @copyright 2019 Adam Heim
+ * @license Released under the MIT license.
+ *
+ * Contributors:
+ *   Mark Carver - https://github.com/markcarver
+ *
+ * Last build: 2019-04-23 12:18:55 PM EDT
+ */
+!(function ($) {
+
+/*!
+ * Czech translation for the "cs-CZ" and "cs" language codes.
+ * Martin Brettschneider <martin.brettschneider@gmail.com>
+ */
+$.fn.ajaxSelectPicker.locale["cs-CZ"]={currentlySelected:"Aktuálně vybrané",emptyTitle:"Vyberte a začněte psát",errorText:"Výsledky nelze načíst",searchPlaceholder:"Vyhledat...",statusInitialized:"Začněte psát hledaný výraz",statusNoResults:"Žádné výsledky",statusSearching:"Vyhledávání...",statusTooShort:"Zadejte více znaků"},$.fn.ajaxSelectPicker.locale.cs=$.fn.ajaxSelectPicker.locale["cs-CZ"];})(jQuery);
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.sr-SP.min.js b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.sr-SP.min.js
new file mode 100644
index 00000000..4536c620
--- /dev/null
+++ b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/ajax-bootstrap-select/ajax-bootstrap-select.sr-SP.min.js
@@ -0,0 +1,23 @@
+/*!
+ * Ajax Bootstrap Select
+ *
+ * Extends existing [Bootstrap Select] implementations by adding the ability to search via AJAX requests as you type. Originally for CROSCON.
+ *
+ * @version 1.4.5
+ * @author Adam Heim - https://github.com/truckingsim
+ * @link https://github.com/truckingsim/Ajax-Bootstrap-Select
+ * @copyright 2019 Adam Heim
+ * @license Released under the MIT license.
+ *
+ * Contributors:
+ *   Mark Carver - https://github.com/markcarver
+ *
+ * Last build: 2019-04-23 12:18:55 PM EDT
+ */
+!(function ($) {
+
+/*!
+ * Serbian translation for the "sr-SP" and "sr" language codes.
+ * Miroslav Maksimovic <miroslavmaksimovic95@gmail.com>
+ */
+$.fn.ajaxSelectPicker.locale["sr-SP"]={currentlySelected:"Trenutno izabrano",emptyTitle:"Izaberite i pocnite kucati",errorText:"Nemoguce dobiti rezultate",searchPlaceholder:"Pretrazi...",statusInitialized:"Pocnite kucati kljucnu rijec",statusNoResults:"Nema rezultata",statusSearching:"Trazim...",statusTooShort:"Molimo unesite vise znakova"},$.fn.ajaxSelectPicker.locale.ru=$.fn.ajaxSelectPicker.locale["sr-SP"];})(jQuery);
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/bootstrap-select/bootstrap-select-i18n.min.js b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/bootstrap-select/bootstrap-select-i18n.min.js
index 4428d3c0..877071ce 100644
--- a/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/bootstrap-select/bootstrap-select-i18n.min.js
+++ b/kvision-modules/kvision-bootstrap-select/src/main/resources/js/locales/bootstrap-select/bootstrap-select-i18n.min.js
@@ -1 +1 @@
-!function(a,b){"function"==typeof define&&define.amd?define(["jquery"],function(a){return b(a)}):"object"==typeof module&&module.exports?module.exports=b(require("jquery")):b(a.jQuery)}(this,function(a){!function(a){a.fn.selectpicker.defaults={noneSelectedText:"",noneResultsText:"",countSelectedText:function(a,b){return 1==a?"... ({n})":"... ({n})"},maxOptionsText:function(a,b){return[1==a?"🛇":"🛇",1==b?"🛇":"🛇"]},selectAllText:"++",deselectAllText:"--",multipleSeparator:", "}}(a)});
\ No newline at end of file
+!function(a,b){"function"==typeof define&&define.amd?define(["jquery"],function(a){return b(a)}):"object"==typeof module&&module.exports?module.exports=b(require("jquery")):b(a.jQuery)}(this,function(a){!function(a){a.fn.selectpicker.defaults={noneSelectedText:" ",noneResultsText:"",countSelectedText:function(a,b){return 1==a?"... ({n})":"... ({n})"},maxOptionsText:function(a,b){return[1==a?"🛇":"🛇",1==b?"🛇":"🛇"]},selectAllText:"++",deselectAllText:"--",multipleSeparator:", "}}(a)});
\ No newline at end of file
diff --git a/kvision-modules/kvision-bootstrap/src/main/kotlin/pl/treksoft/kvision/KVManagerBootstrap.kt b/kvision-modules/kvision-bootstrap/src/main/kotlin/pl/treksoft/kvision/KVManagerBootstrap.kt
index b7a44115..78365281 100644
--- a/kvision-modules/kvision-bootstrap/src/main/kotlin/pl/treksoft/kvision/KVManagerBootstrap.kt
+++ b/kvision-modules/kvision-bootstrap/src/main/kotlin/pl/treksoft/kvision/KVManagerBootstrap.kt
@@ -33,7 +33,6 @@ internal object KVManagerBootstrap {
     init {
         require("bootstrap/dist/js/bootstrap.bundle.min.js")
         require("awesome-bootstrap-checkbox")
-        require("./css/kvbootstrap.css")
     }
 
     private val elementResizeEvent = require("element-resize-event")
diff --git a/kvision-modules/kvision-bootstrap/src/main/resources/css/kvbootstrap.css b/kvision-modules/kvision-bootstrap/src/main/resources/css/kvbootstrap.css
deleted file mode 100644
index 6f99a26c..00000000
--- a/kvision-modules/kvision-bootstrap/src/main/resources/css/kvbootstrap.css
+++ /dev/null
@@ -1,295 +0,0 @@
-.input-group.date.is-invalid~.invalid-feedback {
-    display: block;
-}
-
-/*
-
-.bootstrap-touchspin .input-group-btn-vertical> .input-sm {
-  padding: 7px 10px;
-  height: 6px;
-}
-
-.bootstrap-touchspin .input-group-btn-vertical> .input-lg {
-  height: 24px;
-}
-
-.kv-spinner-btn-none .input-group-btn-vertical {
-  display: none;
-}
-
-.kv-spinner-btn-none .form-control {
-  border-radius: 4px !important;
-}
-
-.kv-spinner-btn-vertical .form-control {
-  border-radius: 4px 0px 0px 4px !important;
-}*/
-
-.form-check {
-    padding-left: 0.5rem;
-}
-
-.form-check-input.form-control-sm, .form-check-input.form-control-lg {
-    height: inherit;
-}
-
-.kv-radiogroup-inline label.control-label {
-  vertical-align: top;
-  margin-right: .75rem;
-  margin-bottom: 0px;
-}
-.row.kv-radiogroup-inline label.control-label {
-  margin-right: 0px;
-}
-
-.row.kv-radiogroup-inline .kv-radiogroup-container, .row.kv-radiogroup .kv-radiogroup-container {
-  margin-left: -15px;
-}
-
-.kv-radiogroup-inline .kv-radiogroup-container {
-    display: inline-flex;
-}
-
-.kv-radiogroup-container.is-invalid~.invalid-feedback {
-    display: block;
-}
-
-.form-check-inline {
-    margin-left: 3px;
-}
-
-.form-check-inline.form-check {
-    padding-left: 0px;
-}
-
-.form-horizontal.container-fluid {
-    width: inherit;
-}
-
-.form-inline .form-group {
-    margin-right: 6px;
-}
-
-.form-inline .form-group .control-label {
-    margin-right: 6px;
-}
-
-.form-inline .form-check.form-group {
-    margin-left: 6px;
-}
-
-.kv-form-condensed .form-group {
-    margin-bottom: 0.5rem;
-}
-
-.kv-window.modal-content {
-    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
-    box-shadow: 0 5px 15px rgba(0,0,0,.5);
-    border-radius: 0px;
-}
-
-.kv-window .modal-header {
-  height: 40px;
-  padding: 5px 15px 5px 15px;
-  align-items: center;
-}
-
-.kv-window .modal-header button.close {
-  width: 24px;
-  height: 24px;
-  margin: 0px;
-  padding: 0px;
-}
-
-.kv-window .modal-header .modal-title {
-  white-space: nowrap;
-}
-
-.kv-window .modal-header .window-icon {
-    margin-right: 6px;
-}
-
-.kv-window .kv-window-icons-container {
-    display: flex;
-}
-
-.kv-preview-thumb .btn, .kv-zoom-actions .btn, .file-zoom-dialog .floating-buttons .btn {
-   padding: 5px 8px;
-}
-
-.file-drop-zone.clickable:hover {
-    border: 1px dashed #999;
-}
-
-.file-drop-zone.clickable:focus {
-    border: 1px solid #5acde2;
-}
-
-.nav.tabs-top {
-    flex-wrap: nowrap;
-}
-
-ul.tabs-top {
-    overflow-x: auto;
-    overflow-y: hidden;
-    display: flex;
-}
-
-ul.tabs-top > li {
-    float:none;
-    flex-shrink: 0;
-}
-
-.kv-tab-close {
-    margin-left: 10px;
-    color: #000;
-    text-shadow: 0 1px 0 #fff;
-    filter: alpha(opacity=20);
-    opacity: 0.2;
-}
-
-.kv-tab-close:hover, .kv-tab-close:focus {
-    cursor: pointer;
-    filter: alpha(opacity=50);
-    opacity: 0.5;
-}
-
-/*select.form-control, .tabulator-row .tabulator-cell.tabulator-editing select {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    background: transparent none no-repeat;
-    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAKCAYAAABblxXYAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4wUKFyIn4IjqJgAAAENJREFUKM/l0LERACEQQlGsiTa2px1aokGugNNAx8wfMy8AeLoBALYjaTqoKkga2+gKPgF/2Q7JkEx359oftu+C7/UBCUIcVQz0PvcAAAAASUVORK5CYII=');
-    background-position: right center;
-    cursor: pointer;
-}
-
-select.form-control:hover {
-    background-color: #e6e6e6;
-}
-
-select.form-control option {
-    background-color: white;
-}
-
-select.input-sm {
-    line-height: inherit;
-}*/
-
-.abc-checkbox input[type="checkbox"]:checked+label::after,
-.abc-checkbox input[type="radio"]:checked+label::after {
-    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
-    content: "\f00c";
-    font-weight: 900;
-}
-
-.abc-checkbox label::before {
-    top: 0px;
-}
-.abc-checkbox label::after {
-    top: 0px;
-}
-
-.abc-radio label::before {
-    top: 0px;
-}
-
-.abc-radio label::after {
-    top: 3px;
-}
-
-.abc-checkbox.form-check-inline label::before {
-    top: 2px;
-}
-
-.abc-checkbox.form-check-inline label::after {
-    top: 2px;
-}
-
-.abc-radio.form-check-inline label::before {
-    top: 2px;
-}
-
-.abc-radio.form-check-inline label::after {
-    top: 5px;
-}
-
-.abc-checkbox label.col-form-label-lg::before {
-    top: 10px;
-}
-.abc-checkbox label.col-form-label-lg::after {
-    top: 10px;
-}
-
-.abc-radio label.col-form-label-lg::before {
-    top: 10px;
-}
-
-.abc-radio label.col-form-label-lg::after {
-    top: 13px;
-}
-
-.abc-checkbox.form-check-inline label.col-form-label-lg::before {
-    top: 15px;
-}
-
-.abc-checkbox.form-check-inline label.col-form-label-lg::after {
-    top: 15px;
-}
-
-.abc-radio.form-check-inline label.col-form-label-lg::before {
-    top: 15px;
-}
-
-.abc-radio.form-check-inline label.col-form-label-lg::after {
-    top: 18px;
-}
-
-/*!
- * bootstrap-vertical-tabs - v1.2.2
- * https://dbtek.github.io/bootstrap-vertical-tabs
- * 2016-12-02
- * Copyright (c) 2016 İsmail Demirbilek
- * License: MIT
- */
-.nav-tabs.tabs-left, .nav-tabs.tabs-right {
-  border-bottom: none;
-  padding-top: 2px;
-}
-.nav-tabs.tabs-left {
-  border-right: 1px solid #dee2e6;
-}
-.nav-tabs.tabs-right {
-  border-left: 1px solid #dee2e6;
-}
-.nav-tabs.tabs-left>li.nav-item, .nav-tabs.tabs-right>li.nav-item {
-  float: none;
-  margin-bottom: 2px;
-}
-.nav-tabs.tabs-left>li.nav-item {
-  margin-right: -1px;
-}
-.nav-tabs.tabs-right>li.nav-item {
-  margin-left: -1px;
-}
-.nav-tabs.tabs-left>li.nav-item>a.nav-link.active,
-.nav-tabs.tabs-left>li.nav-item>a.nav-link.active:hover,
-.nav-tabs.tabs-left>li.nav-item>a.nav-link.active:focus {
-  border-bottom-color: #dee2e6;
-  border-right-color: transparent;
-}
-.nav-tabs.tabs-right>li.nav-item>a.nav-link.active,
-.nav-tabs.tabs-right>li.nav-item>a.nav-link.active:hover,
-.nav-tabs.tabs-right>li.nav-item>a.nav-link.active:focus {
-  border-bottom: 1px solid #dee2e6;
-  border-left-color: transparent;
-}
-.nav-tabs.tabs-left>li.nav-item>a.nav-link {
-  border-radius: 4px 0 0 4px;
-  margin-right: 0;
-  display:block;
-}
-.nav-tabs.tabs-right>li.nav-item>a.nav-link {
-  border-radius: 0 4px 4px 0;
-  margin-right: 0;
-}
diff --git a/src/main/kotlin/pl/treksoft/kvision/KVManager.kt b/src/main/kotlin/pl/treksoft/kvision/KVManager.kt
index 9772f808..0ba694eb 100644
--- a/src/main/kotlin/pl/treksoft/kvision/KVManager.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/KVManager.kt
@@ -46,11 +46,11 @@ external fun require(name: String): dynamic
 object KVManager {
     init {
         try {
-            require("kvision-bootstrap").pl.treksoft.kvision.KVManagerBootstrap
+            require("kvision-bootstrap-css").pl.treksoft.kvision.KVManagerBootstrapCss
         } catch (e: Throwable) {
         }
         try {
-            require("kvision-bootstrap-css").pl.treksoft.kvision.KVManagerBootstrapCss
+            require("kvision-bootstrap").pl.treksoft.kvision.KVManagerBootstrap
         } catch (e: Throwable) {
         }
         try {
diff --git a/src/main/resources/css/style.css b/src/main/resources/css/style.css
index 7323772b..ace7da8c 100644
--- a/src/main/resources/css/style.css
+++ b/src/main/resources/css/style.css
@@ -38,7 +38,6 @@
     overflow: auto;
 }
 
-
 .splitter-vertical {
   flex: 0 0 auto;
   width: 9px;
@@ -76,3 +75,312 @@ trix-toolbar .trix-button-group {
     border-right: 1px solid #1d68cd !important;
     padding: 2px !important;
 }
+
+.input-group.date.is-invalid~.invalid-feedback {
+    display: block;
+}
+
+.input-group.date {
+    padding-left: 0px;
+    padding-right: 0px;
+}
+
+.bootstrap-select .dropdown-toggle.btn-default:focus {
+    outline: none !important;
+}
+
+.bootstrap-select .dropdown-toggle::after {
+    margin-left: -1em !important;
+}
+
+.form-inline .bootstrap-select .form-control {
+    min-width: 200px;
+}
+
+/*.bootstrap-select.form-control {
+    border: 1px solid #ced4da !important;
+}
+
+.bootstrap-select.form-control:focus {
+    border-color: #80bdff !important;
+}*/
+
+/*
+
+.bootstrap-touchspin .input-group-btn-vertical> .input-sm {
+  padding: 7px 10px;
+  height: 6px;
+}
+
+.bootstrap-touchspin .input-group-btn-vertical> .input-lg {
+  height: 24px;
+}
+
+.kv-spinner-btn-none .input-group-btn-vertical {
+  display: none;
+}
+
+.kv-spinner-btn-none .form-control {
+  border-radius: 4px !important;
+}
+
+.kv-spinner-btn-vertical .form-control {
+  border-radius: 4px 0px 0px 4px !important;
+}*/
+
+.kv-radiogroup-inline label.control-label {
+  vertical-align: top;
+  margin-right: .75rem;
+  margin-bottom: 0px;
+}
+.row.kv-radiogroup-inline label.control-label {
+  margin-right: 0px;
+}
+
+.row.kv-radiogroup-inline .kv-radiogroup-container, .row.kv-radiogroup .kv-radiogroup-container {
+  margin-left: -15px;
+}
+
+.kv-radiogroup-inline .kv-radiogroup-container {
+    display: inline-flex;
+}
+
+.kv-radiogroup-container.is-invalid~.invalid-feedback {
+    display: block;
+}
+
+.form-check {
+    padding-left: 0.5rem;
+}
+
+.form-check-input.form-control-sm, .form-check-input.form-control-lg {
+    height: inherit;
+}
+
+.form-check-inline {
+    margin-left: 3px;
+}
+
+.form-check-inline.form-check {
+    padding-left: 0px;
+}
+
+.form-horizontal.container-fluid {
+    width: inherit;
+}
+
+.form-inline .form-group {
+    margin-right: 6px;
+}
+
+.form-inline .form-group .control-label {
+    margin-right: 6px;
+}
+
+.form-inline .form-check.form-group {
+    margin-left: 6px;
+}
+
+.kv-form-condensed .form-group {
+    margin-bottom: 0.5rem;
+}
+
+.kv-window.modal-content {
+    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
+    box-shadow: 0 5px 15px rgba(0,0,0,.5);
+    border-radius: 0px;
+}
+
+.kv-window .modal-header {
+  height: 40px;
+  padding: 5px 15px 5px 15px;
+  align-items: center;
+}
+
+.kv-window .modal-header button.close {
+  width: 24px;
+  height: 24px;
+  margin: 0px;
+  padding: 0px;
+}
+
+.kv-window .modal-header .modal-title {
+  white-space: nowrap;
+}
+
+.kv-window .modal-header .window-icon {
+    margin-right: 6px;
+}
+
+.kv-window .kv-window-icons-container {
+    display: flex;
+}
+
+.kv-preview-thumb .btn, .kv-zoom-actions .btn, .file-zoom-dialog .floating-buttons .btn {
+   padding: 5px 8px;
+}
+
+.file-drop-zone.clickable:hover {
+    border: 1px dashed #999;
+}
+
+.file-drop-zone.clickable:focus {
+    border: 1px solid #5acde2;
+}
+
+.nav.tabs-top {
+    flex-wrap: nowrap;
+}
+
+ul.tabs-top {
+    overflow-x: auto;
+    overflow-y: hidden;
+    display: flex;
+}
+
+ul.tabs-top > li {
+    float:none;
+    flex-shrink: 0;
+}
+
+.kv-tab-close {
+    margin-left: 10px;
+    color: #000;
+    text-shadow: 0 1px 0 #fff;
+    filter: alpha(opacity=20);
+    opacity: 0.2;
+}
+
+.kv-tab-close:hover, .kv-tab-close:focus {
+    cursor: pointer;
+    filter: alpha(opacity=50);
+    opacity: 0.5;
+}
+
+select.form-control, .tabulator-row .tabulator-cell.tabulator-editing select {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    background: transparent none no-repeat;
+    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAKCAYAAABblxXYAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4wUKFyIn4IjqJgAAAENJREFUKM/l0LERACEQQlGsiTa2px1aokGugNNAx8wfMy8AeLoBALYjaTqoKkga2+gKPgF/2Q7JkEx359oftu+C7/UBCUIcVQz0PvcAAAAASUVORK5CYII=');
+    background-position: right center;
+    cursor: pointer;
+}
+
+.abc-checkbox input[type="checkbox"]:checked+label::after,
+.abc-checkbox input[type="radio"]:checked+label::after {
+    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
+    content: "\f00c";
+    font-weight: 900;
+}
+
+.abc-checkbox label::before {
+    top: 0px;
+}
+.abc-checkbox label::after {
+    top: 0px;
+}
+
+.abc-radio label::before {
+    top: 0px;
+}
+
+.abc-radio label::after {
+    top: 3px;
+}
+
+.abc-checkbox.form-check-inline label::before {
+    top: 2px;
+}
+
+.abc-checkbox.form-check-inline label::after {
+    top: 2px;
+}
+
+.abc-radio.form-check-inline label::before {
+    top: 2px;
+}
+
+.abc-radio.form-check-inline label::after {
+    top: 5px;
+}
+
+.abc-checkbox label.col-form-label-lg::before {
+    top: 10px;
+}
+.abc-checkbox label.col-form-label-lg::after {
+    top: 10px;
+}
+
+.abc-radio label.col-form-label-lg::before {
+    top: 10px;
+}
+
+.abc-radio label.col-form-label-lg::after {
+    top: 13px;
+}
+
+.abc-checkbox.form-check-inline label.col-form-label-lg::before {
+    top: 15px;
+}
+
+.abc-checkbox.form-check-inline label.col-form-label-lg::after {
+    top: 15px;
+}
+
+.abc-radio.form-check-inline label.col-form-label-lg::before {
+    top: 15px;
+}
+
+.abc-radio.form-check-inline label.col-form-label-lg::after {
+    top: 18px;
+}
+
+/*!
+ * bootstrap-vertical-tabs - v1.2.2
+ * https://dbtek.github.io/bootstrap-vertical-tabs
+ * 2016-12-02
+ * Copyright (c) 2016 İsmail Demirbilek
+ * License: MIT
+ */
+.nav-tabs.tabs-left, .nav-tabs.tabs-right {
+  border-bottom: none;
+  padding-top: 2px;
+}
+.nav-tabs.tabs-left {
+  border-right: 1px solid #dee2e6;
+}
+.nav-tabs.tabs-right {
+  border-left: 1px solid #dee2e6;
+}
+.nav-tabs.tabs-left>li.nav-item, .nav-tabs.tabs-right>li.nav-item {
+  float: none;
+  margin-bottom: 2px;
+}
+.nav-tabs.tabs-left>li.nav-item {
+  margin-right: -1px;
+}
+.nav-tabs.tabs-right>li.nav-item {
+  margin-left: -1px;
+}
+.nav-tabs.tabs-left>li.nav-item>a.nav-link.active,
+.nav-tabs.tabs-left>li.nav-item>a.nav-link.active:hover,
+.nav-tabs.tabs-left>li.nav-item>a.nav-link.active:focus {
+  border-bottom-color: #dee2e6;
+  border-right-color: transparent;
+}
+.nav-tabs.tabs-right>li.nav-item>a.nav-link.active,
+.nav-tabs.tabs-right>li.nav-item>a.nav-link.active:hover,
+.nav-tabs.tabs-right>li.nav-item>a.nav-link.active:focus {
+  border-bottom: 1px solid #dee2e6;
+  border-left-color: transparent;
+}
+.nav-tabs.tabs-left>li.nav-item>a.nav-link {
+  border-radius: 4px 0 0 4px;
+  margin-right: 0;
+  display:block;
+}
+.nav-tabs.tabs-right>li.nav-item>a.nav-link {
+  border-radius: 0 4px 4px 0;
+  margin-right: 0;
+}