Skip to content

Commit

Permalink
add account, dashboard placeholders
Browse files Browse the repository at this point in the history
  • Loading branch information
Po Rith authored and Po Rith committed Aug 24, 2019
1 parent cc0981c commit 165c066
Show file tree
Hide file tree
Showing 16 changed files with 460 additions and 135 deletions.
Binary file modified .DS_Store
View file
Binary file not shown.
155 changes: 152 additions & 3 deletions layouts/default.vue
View file
@@ -1,9 +1,128 @@
<template>
<div>
<nuxt />
</div>
<section>
<!-- Top Border -->
<div class="w-100 bg-uday-orange p-2 text-center text-white font-weight-bold">
PROTOTYPE: Last updated Aug 24th, 2019.
</div>

<!-- Header -->
<div class="container mt-3">
<div class="row">
<div class="col-md-6">
<nuxt-link to="/">
<img src="/uday-logo-lrg.png" class="w-25" alt="Uday Logo">
</nuxt-link>
</div>
<div class="col-md-6 text-right">
<div v-if="!loggedIn" class="pt-2 mt-4">
<ul id="footer-links" class="p-0 mb-0">
<li>
<nuxt-link to="/about">About</nuxt-link>
</li>
<li>
<nuxt-link to="/product">Product</nuxt-link>
</li>
<li>
<nuxt-link to="/team">Team</nuxt-link>
</li>
<li>
<nuxt-link to="/contact">Contact</nuxt-link>
</li>
<li>
|
</li>
<li>
<nuxt-link to="/login">Login</nuxt-link>
</li>
<li>
<nuxt-link to="/signup">Sign Up</nuxt-link>
</li>
</ul>
</div>
<div v-else class="pt-2 mt-4">
<ul id="footer-links" class="p-0 mb-0">
<li>
<nuxt-link to="/dashboard/account">Account</nuxt-link>
</li>
<li>
<nuxt-link to="/dashboard/">Dashboard</nuxt-link>
</li>
<li>
|
</li>
<li>
<nuxt-link @click.native="handleLogout()" to="/#">Logout</nuxt-link>
</li>
</ul>
</div>
</div>
</div>
</div>

<!-- Start Nuxt Body -->

<nuxt class="mt-4" />

<!-- End -->

<!-- Footer -->
<div class="text-white pb-2" style="background-color: #441E0D;">
<div class="container py-5 text-center">
<ul id="footer-links" class="p-0 mb-2">
<li>
<nuxt-link to="/about" class="text-white">About</nuxt-link>
</li>
<li>
<!-- • -->
</li>
<li>
<nuxt-link to="/product" class="text-white">Product</nuxt-link>
</li>
<li>
<!-- • -->
</li>
<li>
<nuxt-link to="/team" class="text-white">Team</nuxt-link>
</li>
<li>
<!-- • -->
</li>
<li>
<nuxt-link to="/contact" class="text-white">Contact</nuxt-link>
</li>
</ul>
<!-- <hr class="w-25 mx-auto" style="border: 1px solid #999;"> -->
Uday App: Electronic Patient Records <br>
© 2019
</div>
</div>
</section>
</template>

<script>
export default {
computed: {
loggedIn() {
return this.$store.state.loggedIn
}
},
methods: {
handleLogin() {
this.$store.commit('login')
this.$router.push({
path: '/'
})
},
handleLogout() {
this.$store.commit('logout')
this.$router.push({
path: '/'
})
}
}
}
</script>

<style>
html {
font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
Expand Down Expand Up @@ -38,4 +157,34 @@ a:hover {
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
.btn-bg-light {
background-color: #f9f9f9;
}
.btn-bg-light:hover {
background-color: #f5f5f5;
}
.bg-uday-orange {
background-color: #F1930E;
}
.btn-link:hover {
color: #d4810d!important;
text-decoration: none;
}
.text-uday-orange {
color:#F1930E;
}
.btn-rounded-lrg {
border-radius: 1.5rem;
}
ul#footer-links li {
display: inline;
padding: 0px 10px;
}
</style>
30 changes: 30 additions & 0 deletions pages/about.vue
View file
@@ -0,0 +1,30 @@
<template>
<div class="container">
<div class="row mb-4">
<div class="col-md-12">
<h3>About</h3>
<div class="w-100">
<img src="/uday-field-team.png" class="w-100 pb-2" alt="">
</div>
<p class="text-center mb-3">
<small>
India Field Team, 2019
</small>
</p>
<p class="mb-3">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem sit in sapiente unde recusandae rem reiciendis nisi, dolores deserunt consequuntur hic ea libero, numquam aliquid modi velit! Architecto qui similique odit delectus in nostrum ducimus reprehenderit ipsam rem quas maiores vitae recusandae debitis eligendi, deserunt eum nemo pariatur voluptas? Quibusdam repellendus ex enim impedit? Ullam mollitia, eaque enim hic iure ut in labore ex impedit sequi nihil dolores culpa ipsum incidunt aliquam soluta quis voluptatem, ipsa voluptatibus repellat dolorem. Quidem et quod sequi tenetur natus facere a, quaerat velit voluptatum porro dolores nobis distinctio assumenda voluptates rem excepturi! Necessitatibus, voluptas!
</p>
</div>
</div>
</div>
</template>

<script>
export default {
transition: 'fade'
}
</script>

<style>
</style>
53 changes: 53 additions & 0 deletions pages/contact.vue
View file
@@ -0,0 +1,53 @@
<template>
<div class="container">
<div class="row">
<div class="col-md-12">
<h3>Contact</h3>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem sit in sapiente unde recusandae rem reiciendis nisi, dolores deserunt consequuntur hic ea libero, numquam aliquid modi velit! Architecto qui similique odit delectus in nostrum ducimus reprehenderit ipsam rem quas maiores vitae recusandae debitis eligendi, deserunt eum nemo pariatur voluptas? Quibusdam repellendus ex enim impedit? Ullam mollitia, eaque enim hic iure ut in labore ex impedit sequi nihil dolores culpa ipsum incidunt aliquam soluta quis voluptatem, ipsa voluptatibus repellat dolorem. Quidem et quod sequi tenetur natus facere a, quaerat velit voluptatum porro dolores nobis distinctio assumenda voluptates rem excepturi! Necessitatibus, voluptas!
</p>
</div>
</div>
<div class="row mb-5">
<div class="offset-md-2 col-md-8 pt-3">
Name <br>
<input type="text" class="w-100 mb-3">
Email <br>
<input type="text" class="w-100 mb-3">
Message <br>
<textarea rows="5" class="w-100 mb-3"></textarea>
<button class="p-2 w-100">Send Message</button>
</div>
</div>
</div>
</template>

<script>
export default {
transition: 'fade'
}
</script>

<style>
input[type=text], textarea {
border-radius: 20px;
border: 2px solid #f2f2f2;
padding: .5rem 1rem;
margin: .4rem 0px;
}
button {
border-radius: 20px;
border: 0px;
background-color: #f7f7f7;
color: #F6960F;
font-size: 20px;
font-weight: 700;
}
button:hover {
color: #d4810d;
background-color: #f5f5f5;
cursor: pointer;
}
</style>
38 changes: 38 additions & 0 deletions pages/dashboard/account.vue
View file
@@ -0,0 +1,38 @@
<template>
<div class="container">
<div class="row mb-3">
<div class="col-md-12">
<h3>Account</h3>
<!-- <p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Non exercitationem recusandae nam inventore sit iste est doloribus, modi veniam illo dicta vero ut, praesentium numquam natus, quasi dolore! Commodi laudantium eligendi facilis, tempora veniam suscipit.
</p> -->
</div>
</div>
<div class="row pb-5">
<div class="col-md-6">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 300px;"></div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 300px;"></div>
</div>
</div>
</div>
</div>
</div>
</template>

<script>
export default {
transition: 'fade'
}
</script>

<style>
</style>
63 changes: 63 additions & 0 deletions pages/dashboard/index.vue
View file
@@ -0,0 +1,63 @@
<template>
<div class="container">
<div class="row mb-3">
<div class="col-md-12">
<h3>Dashboard</h3>
<!-- <p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam expedita, aliquam voluptates hic corrupti harum, nemo eligendi esse, blanditiis dolorum ipsum. Ipsum, voluptas earum asperiores rem ea nostrum eaque id, fuga sed, fugit sunt veniam magnam accusantium incidunt nisi amet!
</p> -->
</div>
</div>
<div class="row mb-4">
<div class="col-md-4">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 200px;"></div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 200px;"></div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 200px;"></div>
</div>
</div>
</div>
</div>
<div class="row mb-4">
<div class="col-md-12">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 300px;"></div>
</div>
</div>
</div>
</div>
<div class="row mb-5">
<div class="col-md-12">
<div class="container">
<div class="row">
<div class="col-md-12 bg-light" style="height: 200px;"></div>
</div>
</div>
</div>
</div>
</div>
</template>

<script>
export default {
transition: 'fade'
}
</script>

<style>
</style>

0 comments on commit 165c066

Please sign in to comment.