From 2e7fba60da8146f24a6facfbb82c4112a5c06cc4 Mon Sep 17 00:00:00 2001
From: Soichi Hayashi <hayashis@iu.edu>
Date: Wed, 26 Sep 2018 10:06:24 -0400
Subject: [PATCH] fixed the vue-select/bootstrap-vue css conflict
 https://github.com/sagalbot/vue-select/issues/662

---
 ui/src/components/datatypeselecter.vue | 7 +++++++
 ui/src/main.js                         | 4 ++--
 ui/src/warehouse.vue                   | 6 ++++++
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/datatypeselecter.vue b/ui/src/components/datatypeselecter.vue
index d8c2373a..5f3ad33a 100644
--- a/ui/src/components/datatypeselecter.vue
+++ b/ui/src/components/datatypeselecter.vue
@@ -4,6 +4,13 @@
         <datatype :datatype="datatype"/>
     </template>
 </v-select>
+<!--
+<el-select v-model="selected" placeholder="Select" v-if="datatypes">
+    <el-option v-for="datatype in datatypes" :key="datatype._id" :label="datatype.name" :value="datatype._id">
+        <datatype :datatype="datatype"/>
+    </el-option>
+</el-select>
+-->
 </template>
 
 <script>
diff --git a/ui/src/main.js b/ui/src/main.js
index c8fd8fa0..01fc37dc 100644
--- a/ui/src/main.js
+++ b/ui/src/main.js
@@ -52,8 +52,8 @@ Vue.use(Meta);
 
 /////////////////////////////////////// css /////////////////////////////////////
 
-//import 'bootstrap/dist/css/bootstrap.min.css'
-//import 'bootstrap-vue/dist/bootstrap-vue.min.css'
+import 'bootstrap/dist/css/bootstrap.min.css'
+import 'bootstrap-vue/dist/bootstrap-vue.min.css'
 
 //is this for vue-element?
 import '../theme/index.css' 
diff --git a/ui/src/warehouse.vue b/ui/src/warehouse.vue
index 60e53998..e3697ea4 100644
--- a/ui/src/warehouse.vue
+++ b/ui/src/warehouse.vue
@@ -348,6 +348,12 @@ background-color: white;
 .v-select {
 font-family: inherit;
 }
+.v-select.dropdown .dropdown-toggle {
+content: inherit; /*prevent bootstrap-vue css conflict*/
+}
+.v-select.dropdown .form-control {
+height: inherit; /*prevent bootstrap-vue css conflict*/
+}
 
 .select2-container--default .select2-selection--single {
 height: 36px;