search

creativetimofficial / vue-paper-dashboard

Creative Tim Paper Dashboard made for Vue
https://www.creative-tim.com/product/paper-dashboard
MIT License
1.8k stars 589 forks source link

Modal is not working good #9

Closed obelich closed 7 years ago

obelich commented 7 years ago

I add a modal Bootstrap and import bootstrap.min but the modal is show but is not usable :(

cristijora commented 7 years ago

First of all this project does NOT use jQuery or jQuery plugins. It only uses bootstrap css as you can see here https://github.com/cristijora/vue-paper-dashboard/blob/master/src/main.js#L16

To use a modal I suggest using pure Vue components for that. There are many good third party modal components there. You can find them in the awesome-vue repo https://github.com/vuejs/awesome-vue#overlay

Also you can build your own since it's not that hard. There is an example for that in the official Vue.js documentation https://vuejs.org/v2/examples/modal.html

As a future suggestion, I don't recomend using jQuery unless you totally need it for plugins or components which don't exist for vue. Using it, blocks you a bit from using the full power of Vue and also adds to the final size of the project. Search in awesome-vue. There is a lot of good stuff there!

kikoseijo commented 6 years ago

Install bootstrap 3, require in JS, 

require('bootstrap/dist/js/npm');

in your CSS add the following:

.modal-backdrop {
  display: none !important;
}

Now you can use it.

Happy days!