Timeshare - unitpage

src/components/timeshare/resort/unitPage.vue

@@ -114,54 +114,50 @@
               <div class="col-md-6">
                 <label for="price">Price</label>
                 <div class="property-price d-flex">
-                  <!-- <div class="card-header-c d-flex"> -->
-                  <div style="width: 260px; height: 70px; border-style: solid; color: #60CBEB;">
-                    <!-- <div class="card-title-c align-self-center"> -->
-                    <a class="justify-content-center" style="color: black; font-size: 250%">
-                      <b>R{{ formatPrice(week ? week.sellPrice : 0) }}</b>
-                    </a>
-                    <!-- </div> -->
+                  <div class="price-border">
+                    <div class="price-label">
+                      <b>R {{ formatPrice(week ? week.sellPrice : 0) }}</b>
+                    </div>
                   </div>
-                  <!-- </div> -->
                 </div>
               </div>
             </div>
             <br />
           </form>
           <br />
-
-          <!-- <a
-              class="btn btn-b-n even-width mr-auto"
-              href="/share-transfer-initiation-for-purchaser/"
-          >Make an Offer</a>-->
-          <button
-            type="button"
-            class="btn btn-b-n even-width mr-auto"
-            data-toggle="modal"
-            data-target="#myModal"
-          >Make an Offer</button>
-          <div class="col-md-12">
-            <div id="myModal" class="modal fade" role="dialog">
-              <div class="modal-dialog modal-lg">
-                <!-- Modal content-->
-                <div class="modal-content">
-                  <div class="modal-header">
-                    <button type="button" class="close" data-dismiss="modal">&times;</button>
-                  </div>
-                  <div padding-left="20px">
-                    <makeOffer
-                      name="MakeOffer"
-                      :isMakeOffer="true"
-                      :isProperty="false"
-                      :item="week"
-                    />
+          <div class="d-flex justify-content-between">
+            <div class="p-1">
+              <a class="btn btn-b-c even-width mr-auto" href="javascript:history.back()">Back</a>
+            </div>
+            <div class="p-1">
+              <button
+                type="button"
+                class="btn btn-lg btn-b-n even-width mr-auto"
+                data-toggle="modal"
+                data-target="#myModal"
+              >Make an Offer</button>
+              <div class="col-md-12">
+                <div id="myModal" class="modal fade" role="dialog">
+                  <div class="modal-dialog modal-lg">
+                    <!-- Modal content-->
+                    <div class="modal-content">
+                      <div class="modal-header">
+                        <button type="button" class="close" data-dismiss="modal">&times;</button>
+                      </div>
+                      <div padding-left="20px">
+                        <makeOffer
+                          name="MakeOffer"
+                          :isMakeOffer="true"
+                          :isProperty="false"
+                          :item="week"
+                        />
+                      </div>
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
-
-          <a class="btn btn-b-c even-width mr-auto" href="javascript:history.back()">Back</a>
         </div>
       </div>
     </div>
@@ -214,9 +210,16 @@ export default {
   color: #60cbeb;
   border-radius: 0;
 }
-
 .btn.btn-b-c:hover {
   background-color: #089bf0;
   color: #ffffff;
 }
+.price-border {
+  border: solid #60cbeb medium;
+  padding: 0px 20px;
+}
+.price-label {
+  color: black;
+  font-size: 250%;
+}
 </style>