[rentals] Make locker grid display box sizes more reactive

This commit is contained in:
Adam Goldsmith 2022-03-15 22:17:53 -04:00
parent 87df8d460c
commit 88368466e8

View File

@ -31,7 +31,6 @@
background-color: hsl(24, 100%, 25%); background-color: hsl(24, 100%, 25%);
border: 0.2rem solid black; border: 0.2rem solid black;
border-radius: 0.5rem; border-radius: 0.5rem;
width: 7rem;
aspect-ratio: 1; aspect-ratio: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -50,7 +49,7 @@
<div class="lockers"> <div class="lockers">
{% for unit, lockers in units.items %} {% for unit, lockers in units.items %}
<div class="locker" <div class="locker"
style="grid-template-columns: repeat({{ unit.columns }}, min-content);"> style="grid-template-columns: repeat({{ unit.columns }}, minmax(7rem, 8.5rem));">
{% for locker_form in lockers %} {% for locker_form in lockers %}
<div class="dropdown" <div class="dropdown"
style="grid-row-start: {{ locker_form.instance.row|add:"1" }}; grid-column-start: {{ locker_form.instance.column|add:" style="grid-row-start: {{ locker_form.instance.row|add:"1" }}; grid-column-start: {{ locker_form.instance.column|add:"
@ -65,7 +64,7 @@
<div class="locker-status text-wrap"> <div class="locker-status text-wrap">
{% if locker_form.instance.renter is not None %} {% if locker_form.instance.renter is not None %}
{% if perms.rentals.view_lockerinfo %} {% if perms.rentals.view_lockerinfo %}
{{ locker_form.instance.renter|truncatechars:15 }} {{ locker_form.instance.renter }}
{% else %} {% else %}
Occupied Occupied
{% endif %} {% endif %}