More fun with vue

2019-11-06 11:18:20 -05:00
parent 2af3b431b2
commit d0911e7039
11 changed files with 8853 additions and 27 deletions
--- a/vuefun/src/App.vue
+++ b/vuefun/src/App.vue
@@ -0,0 +1,43 @@
+<template>
+  <div class="container">
+    <h1>{{ greeting }}</h1>
+    <p>{{ message }}</p>
+    <input v-model="message">
+    <p class="container__frig">rendered: {{ frig }}</p>
+  </div>
+</template>
+
+<script>
+import 'normalize.css'
+
+export default {
+  computed: {
+    frig() {
+      return new Date() + '';
+    },
+  },
+  data() {
+    return {
+      message: 'welp',
+      greeting: 'yoiks',
+    }
+  },
+}
+</script>
+
+<style lang="scss">
+body {
+  color: white;
+  background: black;
+  font-family: sans-serif;
+}
+
+.container {
+  padding: 2rem;
+
+  &__frig {
+    font-size: .8rem;
+    color: gray;
+  }
+}
+</style>
--- a/vuefun/src/index.html
+++ b/vuefun/src/index.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>vuefun</title>
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>
--- a/vuefun/src/index.js
+++ b/vuefun/src/index.js
@@ -0,0 +1,8 @@
+import Vue from 'vue'
+import App from './App'
+
+const app = new Vue({
+  el: '#app',
+  template: '<App/>',
+  components: { App },
+})