Hello world, this is my very first VD modal.
Click anywhere outside to close it.
This is my first modal using VD modal
Content always centered using flexbox.
Mister Penguin
3 weeks ago
Great day with my fellows!
Simple HTML modals
Centered modals using flexbox
Sidebar modals
$ npm install --save vd-modal
<script src="/path/to/vd-modal/dist/js/vd-modal.min.js" type="application/javascript"></script>
<link rel="stylesheet" href="/path/to/vd-modal/dist/css/vd-modal.css">
vd-modal module to your application.
"use strict"
(function(){
angular.module("my-application", ["vd-modal"]);
})();
> my-application.js
"use strict"
(function(){
angular.module("my-application").controller("mainController", function(ModalModel){
var vc = this;
vc.helloWorlModal = new ModalModel.getConstructor("hello-world");
vc.openHelloWorlModal = function(){
vc.helloWorlModal.isOpen = true;
}
});
})();
> my-application.html (inside body excerpt)
<body ng-app="my-application">
<modal model="vc.helloWorlModal">
<h1>Hello world!</h1>
<p> This is my first modal using VD modal </p>
</modal>
<main ng-controller="mainController">
<button ng-click="vc.openHelloWorlModal()"></button>
</main>
</body>
Voilá! You will have a modal just like this.