Improved styling of the parts info page

This commit is contained in:
Jan Böhmer 2023-02-05 20:50:19 +01:00
parent f351d65065
commit 13de2afc28
6 changed files with 43 additions and 14 deletions

View file

@ -168,6 +168,14 @@
{% endif %} {% endif %}
{% endmacro %} {% endmacro %}
{% macro entity_last_modified(entity, datetime_format = "short") %}
{{ _self.date_user_combination(entity, true, datetime_format) }}
{% endmacro %}
{% macro entity_created_at(entity, datetime_format = "short") %}
{{ _self.date_user_combination(entity, false, datetime_format) }}
{% endmacro %}
{% macro user_icon(user) %} {% macro user_icon(user) %}
<img src="{{ avatar_helper.avatarSmURL(user) }}" class="avatar-xs" alt="User avatar" {{ stimulus_controller('elements/hoverpic') }} data-thumbnail="{{ avatar_helper.avatarMdURL(user) }}"> <img src="{{ avatar_helper.avatarSmURL(user) }}" class="avatar-xs" alt="User avatar" {{ stimulus_controller('elements/hoverpic') }} data-thumbnail="{{ avatar_helper.avatarMdURL(user) }}">
{% endmacro %} {% endmacro %}

View file

@ -1,3 +1,5 @@
{% import "helper.twig" as helper %}
<table class="table table-striped table-sm table-hover table-responsive-sm"> <table class="table table-striped table-sm table-hover table-responsive-sm">
<thead> <thead>
<tr> <tr>
@ -72,8 +74,9 @@
</button> </button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1"> <div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
<span class="text-muted dropdown-item-text" ><i class="fas fa-lightbulb fa-fw"></i> <b>ID:</b> {{ attachment.iD }}</span> <span class="text-muted dropdown-item-text" ><i class="fas fa-lightbulb fa-fw"></i> <b>ID:</b> {{ attachment.iD }}</span>
<span class="text-muted dropdown-item-text" ><i class="fas fa-calendar fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ attachment.addedDate | format_datetime("short")}}</span> <span class="text-muted dropdown-item-text" ><i class="fas fa-history fa-fw"></i> <b>{% trans %}lastModified{% endtrans %}:</b> {{ helper.entity_last_modified(attachment) }}</span>
<span class="text-muted dropdown-item-text" ><i class="fas fa-history fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ attachment.addedDate | format_datetime("short")}}</span> <span class="text-muted dropdown-item-text" ><i class="fas fa-calendar-plus fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ helper.entity_created_at(attachment) }}</span>
</div> </div>
</div> </div>
</div></td> </div></td>

View file

@ -1,3 +1,5 @@
{% import "helper.twig" as helper %}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-header table-hover"> <table class="table table-striped table-header table-hover">
<thead> <thead>
@ -64,15 +66,13 @@
</td> </td>
<td> {# Action for order information #} <td> {# Action for order information #}
<div class="btn-group"> <div class="btn-group">
<button type="button" class="btn btn-info btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Action <i class="fa-solid fa-lightbulb fa-fw"></i>
</button> </button>
<div class="dropdown-menu"> <div class="dropdown-menu">
<span class="text-muted dropdown-item-text" ><i class="fas fa-lightbulb fa-fw"></i> <b>ID:</b> {{ order.iD }}</span> <span class="text-muted dropdown-item-text" ><i class="fas fa-lightbulb fa-fw"></i> <b>ID:</b> {{ order.iD }}</span>
<span class="text-muted dropdown-item-text" ><i class="fas fa-history fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ order.addedDate | format_datetime("short")}}</span> <span class="text-muted dropdown-item-text" ><i class="fas fa-history fa-fw"></i> <b>{% trans %}lastModified{% endtrans %}:</b> {{ helper.entity_last_modified(order) }}</span>
<div class="dropdown-divider"></div> <span class="text-muted dropdown-item-text" ><i class="fas fa-calendar-plus fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ helper.entity_created_at(order) }}</span>
<a class="dropdown-item" href="#"><i class="fas fa-edit fa-fw"></i> {% trans %}edit.caption_short{% endtrans %}</a>
<a class="dropdown-item" href="#"><i class="fas fa-trash fa-fw"></i> {% trans %}delete.caption{% endtrans %}</a>
</div> </div>
</div> </div>
</td> </td>

View file

@ -13,6 +13,7 @@
<th></th> {# Tags row #} <th></th> {# Tags row #}
<th></th> <th></th>
<th></th> {# Button row #} <th></th> {# Button row #}
<th></th>
</tr> </tr>
</thead> </thead>
@ -63,21 +64,21 @@
</td> </td>
<td> <td>
<div class="btn-group" role="group"> <div class="btn-group" role="group">
<button type="button" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal" <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal"
data-action="withdraw" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}" data-action="withdraw" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}"
title="{% trans %}part.info.withdraw_modal.title.withdraw{% endtrans %}" title="{% trans %}part.info.withdraw_modal.title.withdraw{% endtrans %}"
{% if not is_granted('withdraw', lot) or not withdraw_add_helper.canWithdraw(lot) %}disabled{% endif %} {% if not is_granted('withdraw', lot) or not withdraw_add_helper.canWithdraw(lot) %}disabled{% endif %}
> >
<i class="fa-solid fa-minus fa-fw"></i> <i class="fa-solid fa-minus fa-fw"></i>
</button> </button>
<button type="button" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal" <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal"
data-action="add" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}" data-action="add" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}"
title="{% trans %}part.info.withdraw_modal.title.add{% endtrans %}" title="{% trans %}part.info.withdraw_modal.title.add{% endtrans %}"
{% if not is_granted('add', lot) or not withdraw_add_helper.canAdd(lot) %}disabled{% endif %} {% if not is_granted('add', lot) or not withdraw_add_helper.canAdd(lot) %}disabled{% endif %}
> >
<i class="fa-solid fa-plus fa-fw"></i> <i class="fa-solid fa-plus fa-fw"></i>
</button> </button>
<button type="button" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal" <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#withdraw-modal"
data-action="move" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}" data-action="move" data-lot-id="{{ lot.id }}" data-lot-amount="{{ lot.amount }}"
title="{% trans %}part.info.withdraw_modal.title.move{% endtrans %}" title="{% trans %}part.info.withdraw_modal.title.move{% endtrans %}"
{% if not is_granted('move', lot) or not withdraw_add_helper.canWithdraw(lot) or part.partLots.count == 1 %}disabled{% endif %} {% if not is_granted('move', lot) or not withdraw_add_helper.canWithdraw(lot) or part.partLots.count == 1 %}disabled{% endif %}
@ -89,6 +90,23 @@
<td> <td>
{{ dropdown.profile_dropdown('part_lot', lot.id, false) }} {{ dropdown.profile_dropdown('part_lot', lot.id, false) }}
</td> </td>
<td>
<td> {# Action for order information #}
<div class="btn-group">
<button type="button" class="btn btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-lightbulb fa-fw"></i>
</button>
<div class="dropdown-menu">
<span class="text-muted dropdown-item-text" ><i class="fas fa-lightbulb fa-fw"></i> <b>{% trans %}id.label{% endtrans %}:</b> {{ lot.iD }}</span>
<span class="text-muted dropdown-item-text" ><i class="fas fa-history fa-fw"></i> <b>{% trans %}lastModified{% endtrans %}:</b> {{ helper.entity_last_modified(lot) }}</span>
<span class="text-muted dropdown-item-text" ><i class="fas fa-calendar-plus fa-fw"></i> <b>{% trans %}createdAt{% endtrans %}:</b> {{ helper.entity_created_at(lot) }}</span>
{% if lot.comment is not empty %}
<span class="text-muted dropdown-item-text" ><i class="fas fa-sticky-note fa-fw"></i> <b>{% trans %}part_lot.edit.comment{% endtrans %}:</b> {{ lot.comment }}</span>
{% endif %}
</div>
</div>
</td>
</td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>

View file

@ -10,11 +10,11 @@
<div class="mb-3"> <div class="mb-3">
<span class="text-muted" title="{% trans %}lastModified{% endtrans %}"> <span class="text-muted" title="{% trans %}lastModified{% endtrans %}">
<i class="fas fa-history fa-fw"></i> {{ helper.date_user_combination(part, true) }} <i class="fas fa-history fa-fw"></i> {{ helper.entity_last_modified(part) }}
</span> </span>
<br> <br>
<span class="text-muted mt-1" title="{% trans %}createdAt{% endtrans %}"> <span class="text-muted mt-1" title="{% trans %}createdAt{% endtrans %}">
<i class="fas fa-calendar-plus fa-fw"></i> {{ helper.date_user_combination(part, false) }} <i class="fas fa-calendar-plus fa-fw"></i> {{ helper.entity_created_at(part) }}
</span> </span>
</div> </div>

View file

@ -55,7 +55,7 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" id="comment-tab" data-bs-toggle="tab" <a class="nav-link" id="comment-tab" data-bs-toggle="tab"
href="#comment" role="tab"> href="#comment" role="tab">
<i class="fas fa-comment-alt fa-fw"></i> <i class="fas fa-sticky-note fa-fw"></i>
{% trans %}comment.label{% endtrans %} {% trans %}comment.label{% endtrans %}
</a> </a>
</li> </li>