add with-vuikit example

examples/with-vuikit/README.md

@@ -0,0 +1,3 @@
+# Nuxt with Vuikit
+
+https://vuikit.js.org

examples/with-vuikit/layouts/default.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="uk-container">
+    <nuxt/>
+  </div>
+</template>

examples/with-vuikit/nuxt.config.js

@@ -0,0 +1,6 @@
+export default {
+  css: ['@vuikit/theme'],
+  plugins: [
+    '~/plugins/vuikit.js'
+  ]
+}

examples/with-vuikit/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "nuxt-with-vuikit",
+  "dependencies": {
+    "@vuikit/icons": "latest",
+    "@vuikit/theme": "latest",
+    "nuxt-edge": "latest",
+    "vuikit": "latest"
+  },
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start"
+  }
+}

examples/with-vuikit/pages/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <vk-card type="primary">
+    <vk-card-title>Nuxt + Vuikit</vk-card-title>
+    <div class="uk-inline">
+      <vk-button>Hover</vk-button>
+      <vk-dropdown>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
+      </vk-dropdown>
+    </div>
+    <div class="uk-inline">
+      <vk-button>Click</vk-button>
+      <vk-dropdown mode="click">
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
+      </vk-dropdown>
+    </div>
+    <hr class="uk-divider-icon">
+    <vk-icon icon="heart"></vk-icon>
+  </vk-card>
+</template>

examples/with-vuikit/plugins/vuikit.js

@@ -0,0 +1,6 @@
+import Vue from 'vue'
+import Vuikit from 'vuikit'
+import VuikitIcons from '@vuikit/icons'
+
+Vue.use(Vuikit)
+Vue.use(VuikitIcons)