From 55889499df0527fd1ae957352a5b7a782b03b0f8 Mon Sep 17 00:00:00 2001
From: Arvind Tiwari <tiwariav@gmail.com>
Date: Sat, 12 May 2018 02:47:27 +0530
Subject: [PATCH] order detail style fix

---
 .../static/datacenterlight/css/hosting.css    | 16 +++++++
 .../datacenterlight/order_detail.html         | 45 ++++++++++---------
 hosting/static/hosting/css/order.css          | 16 +++++++
 hosting/templates/hosting/order_detail.html   | 45 ++++++++++---------
 4 files changed, 82 insertions(+), 40 deletions(-)

diff --git a/datacenterlight/static/datacenterlight/css/hosting.css b/datacenterlight/static/datacenterlight/css/hosting.css
index 047f4922..0f16ab77 100644
--- a/datacenterlight/static/datacenterlight/css/hosting.css
+++ b/datacenterlight/static/datacenterlight/css/hosting.css
@@ -518,6 +518,22 @@
   margin: 15px 0;
 }
 
+.order-detail-container .thin-hr {
+  margin: 10px 0;
+}
+
+.order-detail-container .subtotal-price {
+  font-size: 16px;
+}
+
+.order-detail-container .subtotal-price .text-primary {
+  font-size: 17px;
+}
+
+.order-detail-container .total-price {
+  font-size: 18px;
+}
+
 @media (max-width: 767px) {
   .order-detail-container {
     padding: 15px;
diff --git a/datacenterlight/templates/datacenterlight/order_detail.html b/datacenterlight/templates/datacenterlight/order_detail.html
index dfa6634e..5515435a 100644
--- a/datacenterlight/templates/datacenterlight/order_detail.html
+++ b/datacenterlight/templates/datacenterlight/order_detail.html
@@ -65,32 +65,37 @@
                             <span>{% trans "Disk space" %}: </span>
                             <strong class="pull-right">{{vm.disk_size|intcomma}} GB</strong>
                         </p>
-                        <hr>
-                        {% if vm.vat > 0 %}
-                            <p>
-                                <strong>{% trans "Subtotal" %}: </strong>
-                                <strong class="pull-right">{{vm.price|floatformat:2|intcomma}} CHF</strong>
-                            </p>
-                            <p>
-                                <span>{% trans "VAT" %} ({{ vm.vat_percent|floatformat:2|intcomma }}%): </span>
-                                <strong class="pull-right">{{vm.vat|floatformat:2|intcomma}} CHF</strong>
-                            </p>
+                        <hr class="thin-hr">
+                        {% if vm.vat > 0 or vm.discount.amount > 0 %}
+                            <div class="subtotal-price">
+                                {% if vm.vat > 0 %}
+                                    <p>
+                                        <strong class="text-lg">{% trans "Subtotal" %} </strong>
+                                        <strong class="pull-right">{{vm.price|floatformat:2|intcomma}} CHF</strong>
+                                    </p>
+                                    <p>
+                                        <small>{% trans "VAT" %} ({{ vm.vat_percent|floatformat:2|intcomma }}%) </small>
+                                        <strong class="pull-right">{{vm.vat|floatformat:2|intcomma}} CHF</strong>
+                                    </p>
+                                {% endif %}
+                                {% if vm.discount.amount > 0 %}
+                                    <p class="text-primary">
+                                        {%trans "Discount" as discount_name %}
+                                        <strong>{{ vm.discount.name|default:discount_name }} </strong>
+                                        <strong class="pull-right">- {{ vm.discount.amount }} CHF</strong>
+                                    </p>
+                                {% endif %}
+                            </div>
+                            <hr class="thin-hr">
                         {% endif %}
-                        {% if vm.discount.amount > 0 %}
-                            <p class="text-primary">
-                                {%trans "Discount" as discount_name %}
-                                <strong>{{ vm.discount.name|default:discount_name }}: </strong>
-                                <strong class="pull-right">- {{ vm.discount.amount }} CHF</strong>
-                            </p>
-                        {% endif %}
-                        <p>
-                            <strong>{% trans "Total" %}</strong>
+                        <p class="total-price">
+                            <strong>{% trans "Total" %} </strong>
                             <strong class="pull-right">{{vm.total_price|floatformat:2|intcomma}} CHF</strong>
                         </p>
                     </div>
                 </div>
             </div>
-            <hr>
+            <hr class="thin-hr">
         </div>
         <form id="virtual_machine_create_form" action="" method="POST">
             {% csrf_token %}
diff --git a/hosting/static/hosting/css/order.css b/hosting/static/hosting/css/order.css
index fa932798..8aafb8a8 100644
--- a/hosting/static/hosting/css/order.css
+++ b/hosting/static/hosting/css/order.css
@@ -63,6 +63,22 @@
     margin: 15px 0;
 }
 
+.order-detail-container .thin-hr {
+  margin: 10px 0;
+}
+
+.order-detail-container .subtotal-price {
+  font-size: 16px;
+}
+
+.order-detail-container .subtotal-price .text-primary {
+  font-size: 17px;
+}
+
+.order-detail-container .total-price {
+  font-size: 18px;
+}
+
 @media (max-width: 767px) {
     .order-confirm-btn {
         text-align: center;
diff --git a/hosting/templates/hosting/order_detail.html b/hosting/templates/hosting/order_detail.html
index 9dea5359..d84ed3d3 100644
--- a/hosting/templates/hosting/order_detail.html
+++ b/hosting/templates/hosting/order_detail.html
@@ -127,32 +127,37 @@
                             <span>{% trans "Disk space" %}: </span>
                             <strong class="pull-right">{{vm.disk_size}} GB</strong>
                         </p>
-                        <hr>
-                        {% if vm.vat > 0 %}
-                            <p>
-                                <strong>{% trans "Subtotal" %}: </strong>
-                                <strong class="pull-right">{{vm.price|floatformat:2|intcomma}} CHF</strong>
-                            </p>
-                            <p>
-                                <span>{% trans "VAT" %} ({{ vm.vat_percent|floatformat:2|intcomma }}%): </span>
-                                <strong class="pull-right">{{vm.vat|floatformat:2|intcomma}} CHF</strong>
-                            </p>
+                        <hr class="thin-hr">
+                        {% if vm.vat > 0 or vm.discount.amount > 0 %}
+                            <div class="subtotal-price">
+                                {% if vm.vat > 0 %}
+                                    <p>
+                                        <strong>{% trans "Subtotal" %} </strong>
+                                        <strong class="pull-right">{{vm.price|floatformat:2|intcomma}} CHF</strong>
+                                    </p>
+                                    <p>
+                                        <small>{% trans "VAT" %} ({{ vm.vat_percent|floatformat:2|intcomma }}%) </small>
+                                        <strong class="pull-right">{{vm.vat|floatformat:2|intcomma}} CHF</strong>
+                                    </p>
+                                {% endif %}
+                                {% if vm.discount.amount > 0 %}
+                                    <p class="text-primary">
+                                        {%trans "Discount" as discount_name %}
+                                        <strong>{{ vm.discount.name|default:discount_name }} </strong>
+                                        <strong class="pull-right">- {{ vm.discount.amount }} CHF</strong>
+                                    </p>
+                                {% endif %}
+                            </div>
+                            <hr class="thin-hr">
                         {% endif %}
-                        {% if vm.discount.amount > 0 %}
-                            <p class="text-primary">
-                                {%trans "Discount" as discount_name %}
-                                <strong>{{ vm.discount.name|default:discount_name }}: </strong>
-                                <strong class="pull-right">- {{ vm.discount.amount }} CHF</strong>
-                            </p>
-                        {% endif %}
-                        <p>
-                            <strong>{% trans "Total" %}</strong>
+                        <p class="total-price">
+                            <strong>{% trans "Total" %} </strong>
                             <strong class="pull-right">{% if vm.total_price %}{{vm.total_price|floatformat:2|intcomma}}{% else %}{{vm.price|floatformat:2|intcomma}}{% endif %} CHF</strong>
                         </p>
                     </div>
                 </div>
             </div>
-            <hr>
+            <hr class="thin-hr">
         </div>
         {% if not order %}
             {% block submit_btn %}