Alerts demo example

Pooya Parsa · Pooya Parsa · commit fd8eb39ffda4 · 2017-03-19T10:09:16.000+03:30
diff --git a/examples/alerts/demo.css b/examples/alerts/demo.css
@@ -0,0 +1,4 @@
+#app {
+    padding: 20px;
+    height: 400px;
+}
diff --git a/examples/alerts/demo.details b/examples/alerts/demo.details
@@ -0,0 +1,10 @@
+ name: Alerts demo - BootstrapVue
+ description: Please see BootstrapVue docs for more information https://bootstrap-vue.github.io
+ authors:
+   - Pooya Parsa
+ resources:
+   - https://unpkg.com/bootstrap@next/dist/css/bootstrap.min.css
+   - https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css
+   - https://unpkg.com/vue@latest/dist/vue.min.js
+   - https://unpkg.com/tether@latest/dist/js/tether.min.js
+   - https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js
diff --git a/examples/alerts/demo.html b/examples/alerts/demo.html
@@ -0,0 +1,22 @@
+<div id="app">
+    <b-alert show>
+        Default Alert
+    </b-alert>
+
+    <b-alert state="success" show>
+        Success Alert
+    </b-alert>
+
+    <b-alert state="danger" dismissible :show="showDismissibleAlert" @dismissed="showDismissibleAlert=false">
+        Dismissible Alert!
+    </b-alert>
+
+    <b-alert :show="dismissCountDown" dismissible state="warning" @dismiss-count-down="countDownChanged">
+        This alert will dismiss after {{dismissCountDown}} seconds...
+    </b-alert>
+
+    <b-btn @click="showAlert" variant="info" class="m-1">Show alert with count-down timer</b-btn>
+    <b-btn @click="showDismissibleAlert=true" variant="info" class="m-1">
+        Show dismissible alert ({{showDismissibleAlert?'visible':'hidden'}})
+    </b-btn>
+</div>
diff --git a/examples/alerts/demo.js b/examples/alerts/demo.js
@@ -0,0 +1,15 @@
+new Vue({
+    el: '#app',
+    data: {
+        dismissCountDown: null,
+        showDismissibleAlert: false
+    },
+    methods: {
+        countDownChanged(dismissCountDown) {
+            this.dismissCountDown = dismissCountDown;
+        },
+        showAlert() {
+            this.dismissCountDown = 5;
+        }
+    }
+});

-Original file line number
+Diff line change
@@ @@ -0,0 +1,4 @@ @@
 +#app {
 +    padding: 20px;
 +    height: 400px;
 +}