User page - service section design changes-update

weblate_web/static/style-rtl.css

@@ -3075,6 +3075,7 @@ input.button.make-payment {
 
 .form-line:last-child {
   border-bottom: none;
+  border-top: 1px solid #e9eaec;
 }
 
 .form-line > div {
@@ -4460,13 +4461,20 @@ input.fullwidth {
 }
 
 .inner-content-child1 {
-  width: 64.84%;
+  width: 77.84%;
 }
 
 .inner-content-child2 {
-  width: 35.16%;
+  width: auto;
 }
 
+.inner-content-child2 img{
+  max-height: 267px;
+  max-width: 192px;
+  float: left;
+}
+
+
 /* User.html CSS(Custom Styles and Custom Margin and Paddings) */
 
 .stylep {
@@ -4481,12 +4489,10 @@ input.fullwidth {
   padding-bottom: 20px;
 }
 
-.style4 {
-  width: 167px !important;
-}
-
 .style3 {
   width: unset !important;
+  margin-left: 0px !important;
+
 }
 
 .style3 span {
@@ -4499,11 +4505,24 @@ input.fullwidth {
   border: none;
 }
 
-.subscription-note{
-  font-size: 16px; 
-  color: #BFC3C7;
- }
-
- .subscription-note span{
-   color:#2C3548 !important;
- }
+.subscription-note {
+  font-size: 16px;
+  color: #bfc3c7;
+}
+
+.subscription-note span {
+  color: #2c3548 !important;
+}
+
+.style7 t{
+  font-size: 18px;
+  line-height: 30px;
+  padding-left: 55px !important;
+  padding-right: 0px !important;
+  font-weight: 400 !important;
+  letter-spacing: 0;
+}
+
+.style7{
+  height: 86px;
+}

weblate_web/static/style.css

@@ -3075,6 +3075,8 @@ input.button.make-payment {
 
 .form-line:last-child {
   border-bottom: none;
+  border-top: 1px solid #e9eaec;
+
 }
 
 .form-line > div {
@@ -4450,11 +4452,17 @@ input.fullwidth {
 }
 
 .inner-content-child1 {
-  width: 64.84%;
+  width: 77.84%;
 }
 
 .inner-content-child2 {
-  width: 35.16%;
+  width: auto;
+}
+
+.inner-content-child2 img{
+  max-height: 267px;
+  max-width: 192px;
+  float: right;
 }
 
 /* User.html CSS(Custom Styles and Custom Margin and Paddings) */
@@ -4471,12 +4479,9 @@ input.fullwidth {
   padding-bottom: 20px;
 }
 
-.style4 {
-  width: 167px !important;
-}
-
 .style3 {
   width: unset !important;
+  margin-right: 0px !important;
 }
 
 .style3 span {
@@ -4489,11 +4494,24 @@ input.fullwidth {
   border: none;
 }
 
-.subscription-note{
- font-size: 16px; 
- color: #BFC3C7;
+.subscription-note {
+  font-size: 16px;
+  color: #bfc3c7;
+}
+
+.subscription-note span {
+  color: #2c3548 !important;
+}
+
+.style7 t{
+  font-size: 18px;
+  line-height: 30px;
+  padding-left: 0px !important;
+  padding-right: 55px;
+  font-weight: 400 !important;
+  letter-spacing: 0;
 }
 
-.subscription-note span{
-  color:#2C3548 !important;
+.style7{
+  height: 86px;
 }

weblate_web/templates/snippets/payment.html

@@ -6,13 +6,12 @@
 
 <div class="payment-listing">
     <div class="float-right payment-font-size">
-        {{ payment.get_amount_display|intcomma }} {{ payment.get_currency_display }}<span>{% if payment.invoice %}
+        {{ payment.get_amount_display|intcomma }} {{ payment.get_currency_display }}<span>
+            {% if payment.invoice %}
             <div class="float-right payment-font-size">
-
-                    <a href="{% url 'user-invoice' pk=payment.pk %}" class="link">{{ payment.invoice_filename }} <span><img src="{% static "img/dowload.png" %}" alt=">" /></span></a>
-
+                <a href="{% url 'user-invoice' pk=payment.pk %}" class="link">{{ payment.invoice_filename }}<span><img src="{% static "img/dowload.png" %}" alt=">" /></span></a>
             </div>
-        {% elif payment.state != 5 %}
+            {% elif payment.state != 5 %}
             <div class="float-right">
                 {% if payment.is_waiting_for_user %}
                     <a class="link" href="{{ payment.get_absolute_url }}">{{ payment.get_state_display }}</a>
@@ -22,7 +21,7 @@
                     {{ payment.get_state_display }}
                 {% endif %}
             </div>
-        {% endif %}</span>
+            {% endif %}</span>
     </div>
     {{ payment.description }} <em>—</em><span> {% if payment.end|days_diff_from_today < 365 %}
         <t>{% trans "monthly" %}</t>

weblate_web/templates/snippets/service.html

@@ -69,7 +69,7 @@
                         <a class="button med3 inline" data-clipboard-text="{{ service.secret }}">{% trans "Copy" %}</a>
                         <form class="form-inline" method="post" action="{% url "service-token" pk=service.pk %}">
                         {% csrf_token %}
-                        <input type="submit" class="button med4 inline border rev" value="{% trans "Refresh code" %}">
+                        <input type="submit" class="button med4 inline border rev" value="{% trans "Refresh token" %}">
                         </form>
                     </div>
                     <div class="clear"></div>
@@ -105,7 +105,7 @@
                     <div class="form-line style6">
                         <div class="line-left">{% trans "Subscription" %}</div>
                         <div class="line-right">
-                            <p>{{ subscription.get_package_display }} <em>—</em> 
+                            <p>{{ subscription.get_package_display }} <em>—</em>
                                 {% with days_from_today=subscription.expires|days_diff_from_today %}
                                 {% if days_from_today < 365 %}
                                 <span>{% trans "monthly" %}</span>
@@ -131,28 +131,21 @@
                                 </span>
                             </t>
                             <br>
-                            <v class="subscription-note">Note:
+                            {% if service.note %}
+                            <v class="subscription-note">{% trans "Note" %}:
                                 <span>
-                                    {% if service.note %}
                                     {{ service.note }}
-                                    {% endif %}
-
                                 </span>
                             </v>
+                            {% endif %}
 
                             {% if service.status == "shared" %}
                             <a class="button small inline" href="https://hosted.weblate.org/create/billing/?billing={{ service.hosted_billing }}&amp;upgrade=1">{% trans "Change plan" %}</a>
                             {% endif %}
                         </div>
                         <div class="clear"></div>
                     </div>
-                    {% if subscription.get_repeat %}
-                    <div class="form-line style6">
-                        <div class="line-left">{% trans "Validity" %}</div>
-                        <div class="line-right">{% blocktrans with created=subscription.created|date:"d M Y" expires=subscription.expires|date:"d M Y" context "Date range" %}{{ created }}–{{ expires }}{% endblocktrans %}</div>
-                        <div class="clear"></div>
-                    </div>
-                    {% endif %}
+
                     {% if subscription.get_repeat %}
                     <div class="form-line style6">
                         <div class="line-left">{% trans "Billing" %}</div>

weblate_web/templates/user.html

@@ -20,8 +20,8 @@ <h1 class="section-title min-m">{% trans "User profile" %}</h1>
             <div class="updated-service-title">
                 <h1>{% trans "My services" %}<span><a href="https://hosted.weblate.org/accounts/profile/">{% trans "See user profile " %}<img src="{% static "img/ArrowR.png" %}" alt=">" /></a></span></h1>
             </div>
-                {% for service in services %}
-                {% include "snippets/service.html" %}
+            {% for service in services %}
+            {% include "snippets/service.html" %}
             {% endfor %}
             {% endif %}
             {% endwith %}
@@ -39,13 +39,13 @@ <h1>{% trans "My donations" %}</h1>
                     <div class="inner-content-child1">
                 {% if donation.link_url %}
                 <div class="form-line style2">
-                    <div class="line-left style4">{% trans "Link" %}</div>
+                    <div class="line-left">{% trans "Link" %}</div>
                     <div class="line-right style3">{{ donation.link_url }}</div>
                     <div class="clear"></div>
                 </div>
                 {% endif %}
                 <div class="form-line style2">
-                    <div class="line-left style4">{% trans "Active" %}</div>
+                    <div class="line-left">{% trans "Active" %}</div>
                     <div class="line-right style3">{{ donation.expires|date:"d M Y"  }}<em>—</em><span>{{ donation.created|date:"d M Y"  }}</span>
                         {% with days_from_today_donation=donation.expires|days_diff_from_today %}
                         {% if days_from_today_donation < 30 %}
@@ -64,7 +64,7 @@ <h1>{% trans "My donations" %}</h1>
                     <div class="clear"></div>
                 </div>
                 <div class="form-line style2">
-                    <div class="line-left style4"></div>
+                    <div class="line-left"></div>
 
                     <div class="line-right style3">
                         {% if not donation.active %}
@@ -87,22 +87,19 @@ <h1>{% trans "My donations" %}</h1>
                     </div>
                     <div class="clear"></div>
                 </div>
-                <div class="form-line style2">
-                    <div class="line-left style4">{% trans "Payments" %}</div>
-                    <div class="line-right style3">
-                    {% for payment in donation.list_payments %}
-                    {% include "snippets/payment.html" %}
-                    {% endfor %}
-                    </div>
-
-                <div class="payment-pick">
-                </div>
-                    </div>
                     </div>
             <div class="inner-content-child2">
                 <img src="{% static "img/donations-picture.png" %}" alt="Puppy">
             </div>
             </div>
+            <div class="form-line style2 style7">
+                <div class="line-left">{% trans "Payments" %}</div>
+                <div class="line-right ">
+                {% for payment in donation.list_payments %}
+                {% include "snippets/payment.html" %}
+                {% endfor %}
+                </div>
+                </div>
             </div>
             {% empty %}