From 6f9200d6b7110c66cb9f45d1f7796c9eafd9e793 Mon Sep 17 00:00:00 2001
From: Janne Koivistoinen <janne@sharetribe.com>
Date: Fri, 30 Jun 2017 15:32:32 +0300
Subject: [PATCH] order and sales page design fixes

---
 src/components/BookingBreakdown/BookingBreakdown.css   | 4 ++--
 src/components/OrderDetailsPanel/OrderDetailsPanel.css | 2 +-
 src/components/SaleDetailsPanel/SaleDetailsPanel.css   | 7 ++++++-
 src/containers/BookingDatesForm/BookingDatesForm.css   | 1 +
 src/containers/StripePaymentForm/StripePaymentForm.css | 1 +
 src/translations/en.json                               | 2 +-
 6 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/components/BookingBreakdown/BookingBreakdown.css b/src/components/BookingBreakdown/BookingBreakdown.css
index 1e4dde57..c0ad7be1 100644
--- a/src/components/BookingBreakdown/BookingBreakdown.css
+++ b/src/components/BookingBreakdown/BookingBreakdown.css
@@ -1,7 +1,6 @@
 @import '../../marketplace.css';
 
 .root {
-  padding-top: 6px; /* align with baseline */
   display: flex;
   flex-direction: column;
 }
@@ -33,13 +32,14 @@
 
 .itemValue {
   @apply --marketplaceDefaultFontStyles;
+  font-weight: 600;
 }
 
 .totalDivider {
   /* dimensions */
   width: 100%;
   height: 1px;
-  margin: 10px 0 13px 0;
+  margin: 13px 0 4px 0;
 
   border: none;
   background-color: var(--matterColorNegative);
diff --git a/src/components/OrderDetailsPanel/OrderDetailsPanel.css b/src/components/OrderDetailsPanel/OrderDetailsPanel.css
index 9fbf1a64..a38f137c 100644
--- a/src/components/OrderDetailsPanel/OrderDetailsPanel.css
+++ b/src/components/OrderDetailsPanel/OrderDetailsPanel.css
@@ -5,7 +5,7 @@
 }
 
 .title {
-  margin: 35px 24px 0 24px;
+  margin: 28px 24px 0 24px;
 }
 
 .mainTitle {
diff --git a/src/components/SaleDetailsPanel/SaleDetailsPanel.css b/src/components/SaleDetailsPanel/SaleDetailsPanel.css
index ff94148f..e1f1c3a9 100644
--- a/src/components/SaleDetailsPanel/SaleDetailsPanel.css
+++ b/src/components/SaleDetailsPanel/SaleDetailsPanel.css
@@ -14,7 +14,7 @@
 
 .header {
   display: flex;
-  margin-top: 35px;
+  margin-top: 28px;
 }
 
 .title {
@@ -32,6 +32,7 @@
 
 .avatarWrapper {
   width: var(--avatarSize);
+  margin-top: 7px;
 }
 
 .avatar {
@@ -40,6 +41,10 @@
   height: var(--avatarSize);
 }
 
+.avatar span {
+  margin-bottom: 5px;
+}
+
 .breakdownTitle {
   color: var(--matterColorAnti);
   margin-top: 47px;
diff --git a/src/containers/BookingDatesForm/BookingDatesForm.css b/src/containers/BookingDatesForm/BookingDatesForm.css
index 6143edfe..0f8551f3 100644
--- a/src/containers/BookingDatesForm/BookingDatesForm.css
+++ b/src/containers/BookingDatesForm/BookingDatesForm.css
@@ -33,4 +33,5 @@
 .submitButton {
   margin: 0 24px 48px 24px;
   width: calc(100% - 48px);
+  background-color: var(--successColor);
 }
diff --git a/src/containers/StripePaymentForm/StripePaymentForm.css b/src/containers/StripePaymentForm/StripePaymentForm.css
index de8b9622..73c92396 100644
--- a/src/containers/StripePaymentForm/StripePaymentForm.css
+++ b/src/containers/StripePaymentForm/StripePaymentForm.css
@@ -43,4 +43,5 @@
 
 .submitButton {
   margin-top: 24px;
+  background-color: var(--successColor);
 }
diff --git a/src/translations/en.json b/src/translations/en.json
index 22e70efc..323686f6 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -8,7 +8,7 @@
   "AuthenticationPage.signupLinkText": "Sign up",
   "AuthenticationPage.signupPageTitle": "Sign up",
   "AuthorInfo.host": "Hosted by {firstName} {lastName}",
-  "BookingBreakdown.bookingPeriod": "{bookingStart} - {bookingEnd}",
+  "BookingBreakdown.bookingPeriod": "{bookingStart} – {bookingEnd}",
   "BookingBreakdown.commission": "Saunatime fee:",
   "BookingBreakdown.nightCount": "&times; {count, number} {count, plural, one {night} other {nights}}",
   "BookingBreakdown.pricePerNight": "Price per night",