From f2b0ff04cab8d78e56e521586d228b1c2b9da29c Mon Sep 17 00:00:00 2001
From: PCoder <purple.coder@yahoo.co.uk>
Date: Thu, 24 Aug 2017 13:41:48 +0530
Subject: [PATCH] Added text and styles for monthly payment clarification

---
 .../templates/datacenterlight/order_detail.html          | 9 ++++++---
 hosting/static/hosting/css/landing-page.css              | 5 +++++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/datacenterlight/templates/datacenterlight/order_detail.html b/datacenterlight/templates/datacenterlight/order_detail.html
index 8b1180bb..61499134 100644
--- a/datacenterlight/templates/datacenterlight/order_detail.html
+++ b/datacenterlight/templates/datacenterlight/order_detail.html
@@ -67,14 +67,17 @@
                             <hr>
                             <p><b>{% trans "Configuration"%}</b> <span class="pull-right">{{request.session.template.name}}</span></p>
                             <hr>
-                            <h4>{% trans "Total"%}<p class="pull-right"><b>{{vm.price}} CHF</b></p></h4>
+                            <h4>{% trans "Total"%}<p class="pull-right"><b>{{vm.price}} CHF</b><span class="dcl-price-month"> /{% trans "Month" %}</span></p></h4>
                         {% endwith %}
                     </div>
                     <br/>
                     <form method="post">
                     {% csrf_token %}
-                    <div class=" content pull-right">
-                        <a href="{{next_url}}" ><button class="btn btn-info">{% trans "Place order"%}</button></a>
+                    <div class="col-md-8 col-xs-7 pull-left tbl-no-padding">
+                        <p class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month (incl. VAT) {% endblocktrans %}.</p>
+                    </div>
+                    <div class="col-md-4 col-xs-5 content tbl-no-padding">
+                        <a href="{{next_url}}" ><button class="btn btn-info pull-right">{% trans "Place order"%}</button></a>
                     </div>
                     </form>
                 </div>
diff --git a/hosting/static/hosting/css/landing-page.css b/hosting/static/hosting/css/landing-page.css
index 883d7bc2..d1dc657a 100644
--- a/hosting/static/hosting/css/landing-page.css
+++ b/hosting/static/hosting/css/landing-page.css
@@ -533,6 +533,11 @@ a.unlink:hover {
     padding-left: 5px;
 }
 
+.dcl-place-order-text{
+   font-size: 13px;
+   color: #808080;
+}
+
 .dcl-order-table-total .tbl-total {
     text-align: center;
     color: #000;