Minor visual adjustment to make TopCustomers and ProductTop widge…

…ts the same styling
bymayo · Sep 10, 2019 · 427d587 · 427d587
1 parent 953bdcc
commit 427d587
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 7 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # Commerce Widgets Changelog
 
+## 2.0.19 - 2019-09-10
+
+### Changed
+- Minor visual adjustment to make `TopCustomers` and `ProductTop` widgets the same styling
+
 ## 2.0.18 - 2019-08-09
 
 ### Fixed

diff --git a/composer.json b/composer.json
@@ -2,7 +2,7 @@
     "name": "bymayo/commerce-widgets",
     "description": "Insightful dashboard widgets for your Craft Commerce 2 store.",
     "type": "craft-plugin",
-    "version": "2.0.18",
+    "version": "2.0.19",
     "keywords": [
         "craft",
         "cms",

diff --git a/src/templates/widgets/ProductsTop/body.twig b/src/templates/widgets/ProductsTop/body.twig
@@ -2,6 +2,8 @@
 
 {% block widget %}
 
+   {% set rankClasses = ['-first', '-second', '-third'] %}
+
    <table class="data fullwidth collapsible">
       <thead>
          <tr>
@@ -15,11 +17,13 @@
             {% set element = craft.products.id(product.id).status(null).one() %}
             <tr{% if loop.first %} class="rank-background -first"{% endif %}>
                <td class="rank-column">
-                  {% if loop.first %}
-                     <span class="rank -first">
+                  <span class="rank {{ rankClasses[loop.index0] is defined ? rankClasses[loop.index0] }}">
+                     {% if loop.first %}
                         <i class="fas fa-crown"></i>
-                     </span>
-                  {% endif %}
+                     {% else %}
+                        {{ loop.index}}
+                     {% endif %}
+                  </span>
                </td>
                <td>
                   <div class="element hasstatus">

diff --git a/src/templates/widgets/TopCustomers/body.twig b/src/templates/widgets/TopCustomers/body.twig
@@ -15,9 +15,15 @@
       <tbody>
          {% for customer in customers %}
             {% set userId = craft.commercewidgets.userIdByCustomerId(customer.customerId).userId %}
-            <tr>
+            <tr{% if loop.first %} class="rank-background -first"{% endif %}>
                <td class="rank-column">
-                  <span class="rank {{ rankClasses[loop.index0] is defined ? rankClasses[loop.index0] }}">{{ loop.index}}</span>
+                  <span class="rank {{ rankClasses[loop.index0] is defined ? rankClasses[loop.index0] }}">
+                     {% if loop.first %}
+                        <i class="fas fa-crown"></i>
+                     {% else %}
+                        {{ loop.index}}
+                     {% endif %}
+                  </span>
                </td>
                <td>
                   {% if userId|length %}