no card added

hosting/locale/de/LC_MESSAGES/django.po

@@ -8,7 +8,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2017-09-02 03:08+0530\n"
+"POT-Creation-Date: 2017-09-05 00:59+0530\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -371,21 +371,17 @@ msgstr "KARTE ENTFERNEN"
 msgid "EDIT CARD"
 msgstr "BEARBEITEN"
 
-msgid "Add a new Card."
+msgid "No Credit Cards Added"
-msgstr "Neue Kreditkarte hinzufügen."
+msgstr "Es wurde keine Kreditkarte hinzugefügt"
 
 msgid ""
-"Please fill in your credit card information below. We are using <a href="
+"We are using <a href=\"https://stripe.com\">Stripe</a> for payment and do "
-"\"https://stripe.com\" target=\"_blank\">Stripe</a> for payment and do not "
+"not store your information in our database."
-"store your information in our database."
 msgstr ""
-"Bitte füll Deine Kreditkarteninformationen unten aus. Wir nutzen <a href="
+"Wir nutzen <a href="
 "\"https://stripe.com\" target=\"_blank\">Stripe</a> für die Bezahlung und "
 "speichern keine Informationen in unserer Datenbank."
 
-msgid "You are not making any payment here."
-msgstr "Es wird noch keine Bezahlung vorgenommen"
-
 msgid "Add your public SSH key"
 msgstr "Füge deinen öffentlichen SSH-Key hinzu"
 
@@ -543,6 +539,12 @@ msgid ""
 "contact Data Center Light Support."
 msgstr "Kontaktiere den Data Center Light Support."
 
+#~ msgid "Add a new Card."
+#~ msgstr "Neue Kreditkarte hinzufügen."
+
+#~ msgid "You are not making any payment here."
+#~ msgstr "Es wird noch keine Bezahlung vorgenommen"
+
 #~ msgid "Your SSH Keys"
 #~ msgstr "Deine SSH Keys"
 

hosting/static/hosting/css/commons.css

@@ -337,3 +337,22 @@
 .btn-wide {
 	min-width: 100px;
 }
+
+.no-cards {
+  text-align: center;
+  color: #999;
+  padding: 15px;
+  background: rgba(0,0,0,0.02);
+  display: flex;
+  flex-direction: column;
+  height: 230px;
+  justify-content: center;
+}
+
+.no-cards h4 {
+  font-size: 24px;
+}
+
+.no-cards a {
+  color: #7ca3d0;
+}

hosting/templates/hosting/dashboard.html

@@ -32,7 +32,7 @@
                         <img class="svg-img" src="{% static 'hosting/img/billing.svg' %}">
                     </div>
                 </a>
-                <a href="" class="hosting-dashboard-item">
+                <a href="{% url 'hosting:settings' %}" class="hosting-dashboard-item">
                     <h2>{% trans "My Settings" %}</h2>
                     <div class="hosting-dashboard-image">
                         <img class="svg-img" src="{% static 'hosting/img/dashboard_settings.svg' %}">

hosting/templates/hosting/settings.html

@@ -29,7 +29,6 @@
                 <div class="col-sm-7 col-md-6 creditcard-box dcl-creditcard">
                     <h3>{%trans "Credit Card"%}</h3>
                     <hr>
-                    <div>
                     <div>
                         {% if credit_card_data.last4 %}
                             <div class="credit-card-details">
@@ -48,6 +47,12 @@
                                 </div>
                             </div>
                         {% else %}
+                            <div class="no-cards">
+                                <h4>{% trans "No Credit Cards Added" %}</h4>
+                                <p>{% blocktrans %}We are using <a href="https://stripe.com">Stripe</a> for payment and do not store your information in our database.{% endblocktrans %}</p>
+                            </div>
+
+                            {% comment %}
                                 <h4>{% trans "Add a new Card." %}</h4>
                                 <p style="margin-bottom: 15px;">
                                     {% blocktrans %}Please fill in your credit card information below. We are using <a href="https://stripe.com" target="_blank">Stripe</a> for payment and do not store your information in our database.{% endblocktrans %}
@@ -108,14 +113,15 @@
                                         <p class="payment-errors"></p>
                                     </div>
                                 </form>
+                            {% endcomment %}
                         {% endif %}
                     </div>
                 </div>
             </div>
         </div>
     </div>
-    </div>
 
+    {% comment %}
     <!-- stripe key data -->
     {% if stripe_key %}
         {% get_current_language as LANGUAGE_CODE %}
@@ -137,4 +143,5 @@
             })();
         </script>
     {%endif%}
+    {% endcomment %}
 {%endblock%}