Enbiggen a whole lotta buttons

This commit is contained in:
Oliver Walters 2020-04-23 19:41:14 +10:00
parent 426aa9258c
commit 7f020cbbf6
11 changed files with 89 additions and 89 deletions

View File

@ -111,24 +111,20 @@
color: rgb(13, 245, 25); color: rgb(13, 245, 25);
} }
.glyphicon-ok { .icon-red {
color: #5C5; color: #c55;
} }
.glyphicon-ok-circle { .icon-green {
color: #5c5;
}
.icon-blue {
color: #55c; color: #55c;
} }
.glyphicon-remove { .icon-yellow {
color: #C55; color: #CC2;
}
.glyphicon-trash {
color: #C55;
}
.glyphicon-plus {
color: #5C5;
} }
/* CSS overrides for treeview */ /* CSS overrides for treeview */
@ -330,11 +326,15 @@
padding-bottom: 2px; padding-bottom: 2px;
} }
.btn-large { .action-buttons .btn {
font-size: 150%; font-size: 175%;
align-content: center; align-content: center;
vertical-align: middle; vertical-align: middle;
} padding-left: 6px;
padding-right: 6px;
padding-top: 3px;
padding-bottom: 2px;
};
.badge { .badge {
float: right; float: right;

View File

@ -50,7 +50,7 @@ function toggleStar(options) {
{ {
method: 'POST', method: 'POST',
success: function(response, status) { success: function(response, status) {
$(options.button).removeClass('glyphicon-star-empty').addClass('glyphicon-star'); $(options.button).addClass('icon-yellow');
}, },
} }
); );
@ -64,7 +64,7 @@ function toggleStar(options) {
{ {
method: 'DELETE', method: 'DELETE',
success: function(response, status) { success: function(response, status) {
$(options.button).removeClass('glyphicon-star').addClass('glyphicon-star-empty'); $(options.button).removeClass('icon-yellow');
}, },
} }
); );

View File

@ -22,21 +22,21 @@ src="{% static 'img/blank_image.png' %}"
<hr> <hr>
<h4>{{ build.quantity }} x {{ build.part.full_name }}</h4> <h4>{{ build.quantity }} x {{ build.part.full_name }}</h4>
<div class='btn-row'> <div class='btn-row'>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button type='button' class='btn btn-default btn-glyph' id='build-edit' title='Edit Build'> <button type='button' class='btn btn-default' id='build-edit' title='Edit Build'>
<span class='glyphicon glyphicon-edit'/> <span class='fas fa-edit icon-green'/>
</button> </button>
{% if build.is_active %} {% if build.is_active %}
<button type='button' class='btn btn-default btn-glyph' id='build-complete' title="Complete Build"> <button type='button' class='btn btn-default' id='build-complete' title="Complete Build">
<span class='glyphicon glyphicon-send'/> <span class='fas fa-paper-plane'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='build-cancel' title='Cancel Build'> <button type='button' class='btn btn-default btn-glyph' id='build-cancel' title='Cancel Build'>
<span class='glyphicon glyphicon-remove'/> <span class='fas fa-times-circle icon-red'/>
</button> </button>
{% endif %} {% endif %}
{% if build.status == BuildStatus.CANCELLED %} {% if build.status == BuildStatus.CANCELLED %}
<button type='button' class='btn btn-default btn-glyph' id='build-delete' title='Delete Build'> <button type='button' class='btn btn-default btn-glyph' id='build-delete' title='Delete Build'>
<span class='glyphicon glyphicon-trash'/> <span class='fas fa-trash-alt icon-red'/>
</button> </button>
{% endif %} {% endif %}
</div> </div>

View File

@ -23,17 +23,17 @@ InvenTree | {% trans "Company" %} - {{ company.name }}
<hr> <hr>
<h4>{{ company.name }}</h4> <h4>{{ company.name }}</h4>
<p>{{ company.description }}</p> <p>{{ company.description }}</p>
<div class='btn-group'> <div class='btn-group action-buttons'>
{% if company.is_supplier %} {% if company.is_supplier %}
<button type='button' class='btn btn-default btn-glyph' id='company-order-2' title='Create purchase order'> <button type='button' class='btn btn-default' id='company-order-2' title='Create purchase order'>
<span class='glyphicon glyphicon-shopping-cart'/> <span class='fas fa-shopping-cart'/>
</button> </button>
{% endif %} {% endif %}
<button type='button' class='btn btn-default btn-glyph' id='company-edit' title='Edit company information'> <button type='button' class='btn btn-default' id='company-edit' title='Edit company information'>
<span class='glyphicon glyphicon-edit'/> <span class='fas fa-edit icon-green'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='company-delete' title='Delete company'> <button type='button' class='btn btn-default' id='company-delete' title='Delete company'>
<span class='glyphicon glyphicon-trash'/> <span class='fas fa-trash-alt icon-red'/>
</button> </button>
</div> </div>
{% endblock %} {% endblock %}

View File

@ -26,27 +26,27 @@ src="{% static 'img/blank_image.png' %}"
<p>{{ order.description }}</p> <p>{{ order.description }}</p>
<p> <p>
<div class='btn-row'> <div class='btn-row'>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button type='button' class='btn btn-default btn-glyph btn-large' id='edit-order' title='Edit order information'> <button type='button' class='btn btn-default' id='edit-order' title='Edit order information'>
<span class='fas fa-edit'></span> <span class='fas fa-edit'></span>
</button> </button>
<button type='button' class='btn btn-default btn-glyph btn-large' id='export-order' title='Export order to file'> <button type='button' class='btn btn-default' id='export-order' title='Export order to file'>
<span class='fas fa-file-download'></span> <span class='fas fa-file-download'></span>
</button> </button>
{% if order.status == OrderStatus.PENDING and order.lines.count > 0 %} {% if order.status == OrderStatus.PENDING and order.lines.count > 0 %}
<button type='button' class='btn btn-default btn-glyph btn-large' id='place-order' title='Place order'> <button type='button' class='btn btn-default' id='place-order' title='Place order'>
<span class='fas fa-paper-plane'></span> <span class='fas fa-paper-plane'></span>
</button> </button>
{% elif order.status == OrderStatus.PLACED %} {% elif order.status == OrderStatus.PLACED %}
<button type='button' class='btn btn-default btn-glyph btn-large' id='receive-order' title='Receive items'> <button type='button' class='btn btn-default' id='receive-order' title='Receive items'>
<span class='fas fa-clipboard-check'></span> <span class='fas fa-clipboard-check'></span>
</button> </button>
<button type='button' class='btn btn-default btn-glyph btn-large' id='complete-order' title='Mark order as complete'> <button type='button' class='btn btn-default' id='complete-order' title='Mark order as complete'>
<span class='fas fa-check-circle'></span> <span class='fas fa-check-circle'></span>
</button> </button>
{% endif %} {% endif %}
{% if order.status == OrderStatus.PENDING or order.status == OrderStatus.PLACED %} {% if order.status == OrderStatus.PENDING or order.status == OrderStatus.PLACED %}
<button type='button' class='btn btn-default btn-glyph btn-large' id='cancel-order' title='Cancel order'> <button type='button' class='btn btn-default' id='cancel-order' title='Cancel order'>
<span class='fas fa-times-circle'></span> <span class='fas fa-times-circle'></span>
</button> </button>
{% endif %} {% endif %}

View File

@ -33,11 +33,11 @@ src="{% static 'img/blank_image.png' %}"
<h4>{{ order }}</h4> <h4>{{ order }}</h4>
<p>{{ order.description }}</p> <p>{{ order.description }}</p>
<div class='btn-row'> <div class='btn-row'>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button type='button' class='btn btn-default btn-glyph btn-large' id='edit-order' title='Edit order information'> <button type='button' class='btn btn-default' id='edit-order' title='Edit order information'>
<span class='fas fa-edit'></span> <span class='fas fa-edit'></span>
</button> </button>
<button type='button' class='btn btn-default btn-glyph btn-large' id='packing-list' title='{% trans "Packing List" %}'> <button type='button' class='btn btn-default' id='packing-list' title='{% trans "Packing List" %}'>
<span class='fas fa-clipboard-list'></span> <span class='fas fa-clipboard-list'></span>
</button> </button>
</div> </div>

View File

@ -14,16 +14,16 @@
<p>{% trans "All parts" %}</p> <p>{% trans "All parts" %}</p>
{% endif %} {% endif %}
<p> <p>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button class='btn btn-default btn-glyph' id='cat-create' title='Create new part category'> <button class='btn btn-default' id='cat-create' title='Create new part category'>
<span class='glyphicon glyphicon-plus'/> <span class='fas fa-plus-circle icon-green'/>
</button> </button>
{% if category %} {% if category %}
<button class='btn btn-default btn-glyph' id='cat-edit' title='Edit part category'> <button class='btn btn-default' id='cat-edit' title='Edit part category'>
<span class='glyphicon glyphicon-edit'/> <span class='fas fa-edit icon-blue'/>
</button> </button>
<button class='btn btn-default btn-glyph' id='cat-delete' title='Delete part category'> <button class='btn btn-default' id='cat-delete' title='Delete part category'>
<span class='glyphicon glyphicon-trash'/> <span class='fas fa-trash-alt icon-red'/>
</button> </button>
{% endif %} {% endif %}
</div> </div>

View File

@ -34,37 +34,37 @@
<p><i>{{ part.description }}</i></p> <p><i>{{ part.description }}</i></p>
<p> <p>
<div class='btn-row'> <div class='btn-row'>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button type='button' class='btn btn-default btn-glyph' id='toggle-starred' title='{% trans "Star this part" %}'> <button type='button' class='btn btn-default' id='toggle-starred' title='{% trans "Star this part" %}'>
<span id='part-star-icon' class='starred-part glyphicon {% if starred %}glyphicon-star{% else %}glyphicon-star-empty{% endif %}'/> <span id='part-star-icon' class='fas fa-star {% if starred %}icon-yellow{% endif %}'/>
</button> </button>
{% if part.is_template == False %} {% if part.is_template == False %}
{% include "qr_button.html" %} {% include "qr_button.html" %}
{% if part.active %} {% if part.active %}
<button type='button' class='btn btn-default btn-glyph' id='price-button' title='{% trans "Show pricing information" %}'> <button type='button' class='btn btn-default' id='price-button' title='{% trans "Show pricing information" %}'>
<span id='part-price-icon' class='part-price glyphicon glyphicon-usd'/> <span id='part-price-icon' class='fas fa-dollar-sign'/>
</button> </button>
{% if not part.virtual %} {% if not part.virtual %}
<button type='button' class='btn btn-default btn-glyph' id='part-count' title='Count part stock'> <button type='button' class='btn btn-default' id='part-count' title='Count part stock'>
<span class='glyphicon glyphicon-ok-circle'/> <span class='fas fa-clipboard-list'/>
</button> </button>
{% endif %} {% endif %}
{% if part.purchaseable %} {% if part.purchaseable %}
<button type='button' class='btn btn-default btn-glyph' id='part-order' title='Order part'> <button type='button' class='btn btn-default' id='part-order' title='Order part'>
<span id='part-order-icon' class='part-order glyphicon glyphicon-shopping-cart'/> <span id='part-order-icon' class='fas fa-shopping-cart'/>
</button> </button>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% endif %} {% endif %}
<button type='button' class='btn btn-default btn-glyph' id='part-duplicate' title='Duplicate part'> <button type='button' class='btn btn-default' id='part-duplicate' title='Duplicate part'>
<span id='part-duplicate-icon' class='part-duplicate glyphicon glyphicon-duplicate'/> <span id='part-duplicate-icon' class='fas fa-copy'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='part-edit' title='Edit part'> <button type='button' class='btn btn-default' id='part-edit' title='Edit part'>
<span id='part-edit-icon' class='glyphicon glyphicon-edit'/> <span id='part-edit-icon' class='fas fa-edit icon-blue'/>
</button> </button>
{% if not part.active %} {% if not part.active %}
<button type='button' class='btn btn-default btn-glyph' id='part-delete' title='Delete part'> <button type='button' class='btn btn-default' id='part-delete' title='Delete part'>
<span id='part-delete-icon' class='glyphicon glyphicon-trash'/> <span id='part-delete-icon' class='fas fa-trash-alt icon-red'/>
</button> </button>
{% endif %} {% endif %}
</div> </div>

View File

@ -63,38 +63,38 @@ InvenTree | {% trans "Stock Item" %} - {{ item }}
{% endif %} {% endif %}
</h4> </h4>
<div class='btn-group'> <div class='btn-group action-buttons'>
{% include "qr_button.html" %} {% include "qr_button.html" %}
{% if item.in_stock %} {% if item.in_stock %}
{% if not item.serialized %} {% if not item.serialized %}
<button type='button' class='btn btn-default btn-glyph' id='stock-add' title='Add to stock'> <button type='button' class='btn btn-default' id='stock-add' title='Add to stock'>
<span class='glyphicon glyphicon-plus-sign' style='color: #1a1;'/> <span class='fas fa-plus-circle' style='color: #1a1;'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='stock-remove' title='Take from stock'> <button type='button' class='btn btn-default' id='stock-remove' title='Take from stock'>
<span class='glyphicon glyphicon-minus-sign' style='color: #a11;'/> <span class='fas fa-minus-circle' style='color: #a11;'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='stock-count' title='Count stock'> <button type='button' class='btn btn-default' id='stock-count' title='Count stock'>
<span class='glyphicon glyphicon-ok-circle'/> <span class='fas fa-clipboard-list'/>
</button> </button>
{% if item.part.trackable %} {% if item.part.trackable %}
<button type='button' class='btn btn-default btn-glyph' id='stock-serialize' title='Serialize stock'> <button type='button' class='btn btn-default' id='stock-serialize' title='Serialize stock'>
<span class='glyphicon glyphicon-th-list'/> <span class='fas fa-hashtag'/>
</button> </button>
{% endif %} {% endif %}
{% endif %} {% endif %}
<button type='button' class='btn btn-default btn-glyph' id='stock-move' title='Transfer stock'> <button type='button' class='btn btn-default' id='stock-move' title='Transfer stock'>
<span class='glyphicon glyphicon-transfer' style='color: #11a;'/> <span class='fas fa-exchange-alt icon-blue'/>
</button> </button>
<button type='button' class='btn btn-default btn-glyph' id='stock-duplicate' title='Duplicate stock item'> <button type='button' class='btn btn-default' id='stock-duplicate' title='Duplicate stock item'>
<span class='glyphicon glyphicon-duplicate'/> <span class='fas fa-copy'/>
</button> </button>
{% endif %} {% endif %}
<button type='button' class='btn btn-default btn-glyph' id='stock-edit' title='Edit stock item'> <button type='button' class='btn btn-default' id='stock-edit' title='Edit stock item'>
<span class='glyphicon glyphicon-edit'/> <span class='fas fa-edit'/>
</button> </button>
{% if item.can_delete %} {% if item.can_delete %}
<button type='button' class='btn btn-default btn-glyph' id='stock-delete' title='Edit stock item'> <button type='button' class='btn btn-default' id='stock-delete' title='Edit stock item'>
<span class='glyphicon glyphicon-trash'/> <span class='fas fa-trash-alt icon-red'/>
</button> </button>
{% endif %} {% endif %}
</div> </div>

View File

@ -13,20 +13,20 @@
<p>All stock items</p> <p>All stock items</p>
{% endif %} {% endif %}
<p> <p>
<div class='btn-group'> <div class='btn-group action-buttons'>
<button class='btn btn-default btn-glyph' id='location-create' title='Create new stock location'> <button class='btn btn-default' id='location-create' title='Create new stock location'>
<span class='glyphicon glyphicon-plus'/> <span class='fas fa-plus-circle icon-green'/>
</button> </button>
{% if location %} {% if location %}
{% include "qr_button.html" %} {% include "qr_button.html" %}
<button class='btn btn-default btn-glyph' id='location-count' title='Count stock items'> <button class='btn btn-default' id='location-count' title='Count stock items'>
<span class='glyphicon glyphicon-ok-circle'/> <span class='fas fa-clipboard-list'/>
</button> </button>
<button class='btn btn-default btn-glyph' id='location-edit' title='Edit stock location'> <button class='btn btn-default btn-glyph' id='location-edit' title='Edit stock location'>
<span class='glyphicon glyphicon-edit'/> <span class='fas fa-edit icon-blue'/>
</button> </button>
<button class='btn btn-default btn-glyph' id='location-delete' title='Delete stock location'> <button class='btn btn-default btn-glyph' id='location-delete' title='Delete stock location'>
<span class='glyphicon glyphicon-trash'/> <span class='glyphicon glyphicon-trash icon-red'/>
</button> </button>
{% endif %} {% endif %}
</div> </div>

View File

@ -1 +1 @@
<button type='button' class='btn btn-default btn-glyph' id='show-qr-code' title='Show QR code'><span class='glyphicon glyphicon-qrcode'></span></button> <button type='button' class='btn btn-default' id='show-qr-code' title='Show QR code'><span class='fas fa-qrcode'></span></button>