Skip to content

created food menu and food order #9

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

created food menu and food order #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
88bcac2
created checkout form and food menu popup
mayank6725 Nov 21, 2020
c9a49f3
made food menu and food order
mayank6725 Nov 23, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added src/assets/bouquet.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/food.jfif
View file
Open in desktop
Binary file not shown.
Binary file added src/assets/food.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/foodorder.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/veg.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion src/components/Buffet.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,7 @@ export default{
}

#wrapper {
margin-top:5rem;
margin-top:1.5rem;
width: 90%;
max-width:80rem;
}
Expand Down
100 changes: 42 additions & 58 deletions src/components/booking-request.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,45 +15,29 @@
<label for="email" class="form__label">Email address</label>
</div>

<div class="u-center-text">
<a href="#popup" class="btn-text">See all rooms &rarr;</a>
</div>
<div class="row roomsrow">
<div class="row roomsrow">
<div class="form__group col-1-of-4">
<input type="number" class="form__input" placeholder="Number of people" id="number" required min="1" max="3" v-model="rooms">
</div>
<div class="form__group roomtype col-1-of-4">
<select class="room-types" v-if="rooms==1||rooms==2||rooms==3" required>
<option value="0">R-1</option>
<option value="1">Queen</option>
<option value="2">King</option>
<option value="3">Executive Suite</option>
<option value="4">Cabana</option>
</select>
<input type="number" class="form__input roomno" placeholder="Number of rooms" required min="1" max="3" v-model="rooms" id="numberofrooms">
</div>
<div class="form__group roomtype col-1-of-4">
<select class="room-types" v-if="rooms==2||rooms==3" required>
<option value="0">R-2</option>
<option value="1">Queen</option>
<option value="2">King</option>
<option value="3">Executive Suite</option>
<option value="4">Cabana</option>
</select>
</div>
<div class="roomdetails">
<a href="#popup" class="btn-text">See all rooms &rarr;</a>
<a href="#popup" class="btn-text">Book room(s) &rarr;</a>
</div>


<div class="form__group numberpeople">
<input type="number" class="form__input" placeholder="Number of adults" id="number1" required min="1" max="20">
<label for="number1" class="form__label">Number of adults</label>
</div>
<div class="form__group roomtype col-1-of-4 thirdroom">
<select class="room-types" v-if="rooms==3" required>
<option value="0">R-3</option>
<option value="1">Queen</option>
<option value="2">King</option>
<option value="3">Executive Suite</option>
<option value="4">Cabana</option>
</select>
<div class="form__group numberpeople">
<input type="number" class="form__input" placeholder="Number of children" id="number2" required min="1" max="20">
<label for="number2" class="form__label">Number of children</label>
</div>
</div>
<div class="form_group">
<input placeholder="Check-in Date" class="textbox-n" type="text" onfocus="(this.type='date')" onfocusout="(this.type='text')" id="date1" required>
<input placeholder="Check-out Date" class="textbox-n" type="text" onfocus="(this.type='date')" onfocusout="(this.type='text')" id="date2" required>

<div class="form__group numberpeople">
<input type="number" class="form__input" placeholder="Number of people" id="number" required min="1" max="20">
<label for="number" class="form__label">Number of people</label>
</div>
<div class="form__group">
<button class="btn btn--blue">Next step &rarr;</button>
Expand Down Expand Up @@ -119,8 +103,9 @@ export default {

<style lang="scss" scoped>
.section-book {
padding: 4.5rem 0;
padding: 1.4rem 0;
background-image: linear-gradient(to right bottom, $color-primary-light, $color-primary-dark);
background-size:cover;
}

.book {
Expand All @@ -133,12 +118,12 @@ export default {
border-radius: 3px;
box-shadow: 0 1.5rem 4rem rgba($color-black, .2);
margin: 0 auto;
height: 38rem;
width:80rem;
height: 44.5rem;
width:90rem;

&__form {
width: 50%;
padding: 6rem;
padding: 3rem;
}
}
.booking-heading{
Expand Down Expand Up @@ -208,8 +193,8 @@ export default {

.form {
&__group:not(:last-child) {
margin-bottom: 2rem;
margin-top:1rem;
margin-bottom: 0.5rem;
margin-top:0.7rem;
padding:0;
}

Expand Down Expand Up @@ -247,6 +232,7 @@ export default {
font-weight: 700;
margin-left: 1.5rem;
margin-top: .5rem;
margin-bottom:0.5rem;
display: block;
transition: all .3s;
}
Expand Down Expand Up @@ -350,9 +336,8 @@ export default {

&--blue {
background-color: $color-primary;
margin-top:1rem;
color: $color-white;
margin-top:-2rem;

&::after {
background-color: $color-primary;
}
Expand All @@ -376,28 +361,18 @@ export default {
animation-fill-mode: backwards;
}
}
.room-types{
border:none;
padding:1rem;
color:$color-grey-dark-2;
width:35%;
&:focus{
outline:none;
}
}
.btn-text {
&:link,
&:visited {
position:absolute;
top:20rem;
left:14.5rem;
margin: 0.7rem auto 0.7rem auto;
font-size: $default-font-size;
color: $color-primary;
display: inline-block;
text-decoration: none;
border-bottom: 1px solid $color-primary;
padding: 3px;
transition: all .2s;
margin-right:2rem;
}

&:hover {
Expand Down Expand Up @@ -515,10 +490,6 @@ export default {
.roomsrow{
padding:0;
}
.room-types{
width:90%;
height:3.7rem;
}
.thirdroom
{
margin-top:1rem;
Expand All @@ -528,9 +499,22 @@ export default {
top:40rem;
left:20rem;
}
.textbox-n{
margin-right:0.8rem;
width:35%;
padding:0.8rem;
border:none;
&:focus{
border:none;
}
}
.roomno{
width:15rem;
}
.u-center-text { text-align: center; }

.u-margin-bottom-small { margin-bottom: 1.5rem; }
.u-margin-bottom-medium { margin-bottom: 4rem; }
.u-margin-bottom-big { margin-bottom: 8rem; }

</style>
161 changes: 161 additions & 0 deletions src/components/checkout.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,161 @@
<template>
<div>
<navbar/>
<div class="checkout-main">
<div class="container checkout-form">
<div class="row my-row">
<div class="col-lg-6 col-md-12 col-sm-12 my-col">
<h1 class="heading-secondary">Receipt form</h1>
<h4 class="fields">ROOM NO.</h4>
<h4 class="fields">ROOM CHARGES</h4>
<h4 class="fields">SERVICES</h4>
<h4 class="fields">GST</h4>
<h2 class="fields">TOTAL</h2>
<div class="col-1-of-2"><a href="#" class="btn btn--blue btn--animated"><strong>PAY SECURELY</strong></a></div>
</div>
<div class="col-6 d-none d-lg-block flower my-col">

</div>
</div>

</div>
</div>
</div>
</template>

<script>
import navbar from "./navbar.vue";
export default {
components: {
navbar
},
data(){
return {
};
}
}
</script>

<style lang="scss" scoped>
.checkout-main
{
height:91.75vh;
background-image:linear-gradient(to right bottom,rgba(#FFFFDD,0.3),rgba(#FFDAB9,0.5)) , url(../assets/hero.jpg);
background-size: cover;
background-position: top;
padding-top:1.5rem;
padding-left:1rem;
padding-right:1rem;
}
.checkout-form
{
height:40rem;
background-image:linear-gradient(to right bottom,rgba(#FFF4D1,0.8),rgba(#FFFDD0,0.8));
border-radius:1.75rem;
overflow:hidden;

}

.flower
{
background-image:url(../assets/bouquet.jpg);
background-size:cover;
border-radius:1.75rem;
box-shadow: 0 1rem 2rem rgba($color-black,.2);
}
.my-row
{
height:40rem;
padding:1rem;
}
.heading-secondary{
font-size:2.7rem;
text-transform: uppercase;
font-weight: 700;
color:#006a71;
letter-spacing: 0.2rem;
margin-top:1rem;
margin-left:1.5rem;
}
.fields
{
margin:1.7rem;
}
.btn {
&,
&:link,
&:visited {
text-transform: uppercase;
text-decoration: none;
padding: 1rem 3.5rem;
display: inline-block;
border-radius: 10rem;
transition: all .2s;
position: relative;
font-size: $default-font-size;

border: none;
cursor: pointer;
margin-top:4rem;
margin-left:6rem;
}

&:hover {
transform: translateY(-3px);
box-shadow: 0 1rem 1.5rem rgba($color-black,.2);
color:white;

&::after {
transform: scaleX(1.4) scaleY(1.6);
opacity: 0;
}
}

&:active,
&:focus {
outline: none;
transform: translateY(-1px);
box-shadow: 0 .5rem 1rem rgba($color-black,.2);
}

&--white {
background-color: $color-white;
color: $color-grey-dark;

&::after {
background-color: $color-white;
}
}

&--blue {
background-color: #006a71;
color: $color-white;

&::after {
background-color: #006a71;
}
}

&::after {
content: "";
display: inline-block;
height: 100%;
width: 100%;
border-radius: 10rem;
position: absolute;
top: 0;
left: 0;
z-index: -1;
transition: all .4s;
}

&--animated {
animation: moveInBottom .5s ease-out .75s;
animation-fill-mode: backwards;
}
}
.my-col
{
padding:1rem;
}
</style>
4 changes: 2 additions & 2 deletions src/components/edit-profile.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,10 @@
</template>

<script>
import Navbar from "./navbar.vue";
import navbar from "./navbar.vue";
export default {
components: {
Navbar
navbar
},
data(){
return {
Expand Down
17 changes: 17 additions & 0 deletions src/components/food-menu.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<template>
<div>
</div>
</template>

<script>

export default {
data(){
return {
};
}
}
</script>

<style>
</style>
Loading