implemented home and warning

This commit is contained in:
thilo 2020-03-21 16:00:59 +01:00
parent f1988b6348
commit 2d012177be
4 changed files with 41 additions and 60 deletions

View file

@ -4,6 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Zilla+Slab&display=swap" rel="stylesheet">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
</head> </head>

View file

@ -1,32 +1,52 @@
<template> <template>
<div id="app"> <div id="app">
<div id="nav"> <!-- <div id="nav">
<router-link to="/">Home</router-link> | <router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link> <router-link to="/about">About</router-link>
</div> </div> -->
<router-view/> <router-view/>
</div> </div>
</template> </template>
<style> <style>
#app { h1 {
font-family: Avenir, Helvetica, Arial, sans-serif; font-size: 1.2em;
-webkit-font-smoothing: antialiased; line-height: 1em;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
} }
#nav { img {
padding: 30px; width: 100%;
height: auto;
} }
#nav a { a {
font-weight: bold; color: #2779E1;
color: #2c3e50;
} }
#nav a.router-link-exact-active { a:visited {
color: #42b983; color: #2779E1;
}
button {
background: #23286B;
box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25);
border-radius: 20px;
font-family: Open Sans,sans-serif;
font-style: normal;
font-weight: normal;
font-size: 1em;
padding: 0.7em 1em;
color: #FFFFFF;
}
body {
background-color: #FCF7F8;
color: #0B2545;
font-family: Zilla Slab;
font-style: normal;
font-weight: normal;
font-size: 30px;
} }
</style> </style>

BIN
src/assets/welcome.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

View file

@ -1,38 +1,12 @@
<template> <template>
<div class="hello"> <div class="hello">
<h1>{{ msg }}</h1> <h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'HelloWorld', name: 'COVIDassist',
props: { props: {
msg: String msg: String
} }
@ -41,18 +15,4 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped> <style scoped>
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style> </style>