Improve QR code display

- Pretty little glyphicon button!

InvenTree/part/templates/part/detail.html

@@ -23,7 +23,6 @@
                   {% else %}
                   <li><a href="#" id='activate-part' title='Activate part'>Activate</a></li>
                   {% endif %}
-                  <li><a href='#' id='show-qr-code' title='Generate QR Code'>Show QR Code</a></li>
                 </ul>
             </div>
         </h3>
@@ -126,15 +125,6 @@
 
 {% block js_ready %}
     {{ block.super }}
-
-    $("#show-qr-code").click(function() {
-        launchModalForm(
-            "{% url 'part-qr' part.id %}",
-            {
-                no_post: true,
-            }
-        );
-    });
     
     $("#duplicate-part").click(function() {
         launchModalForm(

InvenTree/part/templates/part/part_base.html

@@ -21,20 +21,31 @@
         {% endif %}/>
       </div>
     <div class="media-body">
-        <h4>{{ part.name }}{% if part.active == False %} <i>- INACTIVE</i>{% endif %}</h4>
+        <h4>
+            {{ part.name }}
+        </h4>   
         <p><i>{{ part.description }}</i></p>
-        {% if part.IPN %}
+        <p>
-        <tr>
+            <div class='btn-group'>
-            <td>IPN</td>
+                <button type='button' class='btn btn-default btn-glyph' id='show-qr-code' title='Show QR code'><span class='glyphicon glyphicon-qrcode'></span></button>
-            <td>{{ part.IPN }}</td>
+            </div>
-        </tr>
+        </p>
-        {% endif %}
+        <table class='table table-condensed'>
-        {% if part.URL %}
+            {% if part.IPN %}
-        <tr>
+            <tr>
-            <td>URL</td>
+                <td>IPN</td>
-            <td><a href="{{ part.URL }}">{{ part.URL }}</a></td>
+                <td>{{ part.IPN }}</td>
-        </tr>
+            </tr>
-        {% endif %}
+            {% endif %}
+            {% if part.URL %}
+            <tr>
+                <td>URL</td>
+                <td><a href="{{ part.URL }}">{{ part.URL }}</a></td>
+            </tr>
+            {% endif %}
+            <tr>
+            </tr>
+        </table>
     </div>
     </div>
 </div>
@@ -82,6 +93,15 @@
 
 {% block js_ready %}
 {{ block.super }}
+    $("#show-qr-code").click(function() {
+        launchModalForm(
+            "{% url 'part-qr' part.id %}",
+            {
+                no_post: true,
+            }
+        );
+    });
+
     $("#part-thumb").click(function() {
         launchModalForm(
                         "{% url 'part-image' part.id %}",

InvenTree/static/css/inventree.css

@@ -2,6 +2,17 @@
     float: left;
 }
 
+.glyphicon {
+    font-size: 20px;
+}
+
+.btn-glyph {
+    padding-left: 6px;
+    padding-right: 6px;
+    padding-top: 3px;
+    padding-bottom: 2px;
+}
+
 .badge {
     float: right;
     background-color: #777;

InvenTree/stock/templates/stock/item.html

@@ -6,6 +6,11 @@
 <div class='col-sm-6'>
     <h3>Stock Item Details</h3>
     <p><i>{{ item.quantity }} &times {{ item.part.name }}</i></p>
+    <p>
+        <div class='btn-group'>
+            <button type='button' class='btn btn-default btn-glyph' id='show-qr-code' title='Show QR code'><span class='glyphicon glyphicon-qrcode'></span></button>
+        </div>
+    </p>
 </div>
 <div class='col-sm-6'>
     <h3>
@@ -23,9 +28,6 @@
           <li><a href='#' id='stock-stocktake' title='Count stock'>Stocktake</a></li>
           {% endif %}
           <li><a href="#" id='stock-delete' title='Delete stock item'>Delete stock item</a></li>
-          <hr>
-          <li><a href="#" id='item-qr-code' title='Generate QR code'>Show QR code</a></li>
-        </ul>
     </div>
     </div>
     </h3>
@@ -145,7 +147,7 @@
                         });
     });
 
-    $("#item-qr-code").click(function() {
+    $("#show-qr-code").click(function() {
         launchModalForm("{% url 'stock-item-qr' item.id %}",
         {
             no_post: true,

InvenTree/stock/templates/stock/location.html

@@ -7,6 +7,11 @@
     {% if location %}
     <h3>{{ location.name }}</h3>
     <p>{{ location.description }}</p>
+    <p>
+        <div class='btn-group'>
+            <button type='button' class='btn btn-default btn-glyph' id='show-qr-code' title='Show QR code'><span class='glyphicon glyphicon-qrcode'></span></button>
+        </div>
+    </p>
     {% else %}
     <h3>Stock</h3>
     <p>All stock items</p>
@@ -23,8 +28,6 @@
         <ul class="dropdown-menu">
           <li><a href="#" id='location-edit' title='Edit stock location'>Edit</a></li>
           <li><a href="#" id='location-delete' title='Delete stock location'>Delete</a></li>
-          <hr>
-          <li><a href="#" id='location-qr-code' title='Generate QR code'>Show QR code</a></li>
         </ul>
     </div>
     {% endif %}
@@ -101,7 +104,7 @@
         return false;
     });
 
-    $('#location-qr-code').click(function() {
+    $('#show-qr-code').click(function() {
         launchModalForm("{% url 'stock-location-qr' location.id %}",
         {
             no_post: true,