pcl-labs / hotel-website-vkirirom.com

vkirirom.com is a hotel website in Cambodia. Built in vue.js, and a progressive web app; They support conservation of the national forest their reside in, while also supporting a free software college with 300 Cambodian students. One of our favorite clients, they are always willing to pilot new ideas, and is a good playground for new contributers.
https://vkirirom.com/
GNU Affero General Public License v3.0
15 stars 11 forks source link

Booking Flow 8/9 - Payment Info #223

Closed paulchrisluke closed 4 years ago

paulchrisluke commented 4 years ago

This is part 8 of 9 of the booking flow, when closed please refer to #213 and check off.

Previous Design

image

This payment info process is not specific enough, does not show any booking details at all

Desktop

image

Adds a info section that shows booking info while going through flow.

They can exit booking process early by clicking vkririom logo to return to home.

It doesn't have any Footer for both Desktop and Mobile version.

When we're on this page, the booking nav should show that this is on the Payment Info Page (WILL LINK ISSUE @bamboochow )

image

The card info fill in field will not be visible UNLESS visitor chooses "pay with card" option, at which point it will slide out and visible.

image image Something like this

Mobile

image

Clicking "x" closes booking process, returns to accomodation image

No changes in font sizing/case

Extra Info

Design File: https://www.figma.com/file/ZCcD4RV58FowzVvWdVmY4a/Airbnb-Dark-mode-by-PaulChrisLuke?node-id=8237%3A0

paulchrisluke commented 4 years ago

image Missing divider lines as shown in design below image

image Hide the x in this section so they cannot exit out of the booking process prematurely (showing screenshot for review rules, but same concept)

image If shuttle bus chosen in previous screen, add price into the card on the right

bamboochow commented 4 years ago

Will close issue and write any more edits as separate issue, we're in polishing stage as this major feature is done