Make the items show in a grid
This commit is contained in:
@@ -5,12 +5,48 @@ body {
|
||||
color: rgb(240, 240, 240);
|
||||
}
|
||||
|
||||
.stash-tab {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
grid-gap: 10px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (max-width: 1600px) {
|
||||
.stash-tab {
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.stash-tab {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.stash-tab {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
.stash-tab input[type="checkbox"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item .name {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: block;
|
||||
background-color: #444;
|
||||
border: solid #555;
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked + label {
|
||||
background-color: #343;
|
||||
border: solid #464;
|
||||
}
|
||||
|
||||
.color-rare {
|
||||
@@ -28,3 +64,4 @@ body {
|
||||
.color-runeword {
|
||||
color: rgb(199, 179, 119);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="item">
|
||||
<input type="checkbox" name="{{tabloop.index0}}_{{itemloop.index0}}" value="remove" /> ({{tabloop.index0}}, {{itemloop.index0}})
|
||||
<input type="checkbox" id="{{tabloop.index0}}_{{itemloop.index0}}" name="{{tabloop.index0}}_{{itemloop.index0}}" value="remove" />
|
||||
<label class="item" for="{{tabloop.index0}}_{{itemloop.index0}}">
|
||||
<ul>
|
||||
<li class="name color-{{item.color}}">{{item.name}}</li>
|
||||
{% if item.quality and item.quality >= 5 %}
|
||||
@@ -11,4 +11,4 @@
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
@@ -8,14 +8,14 @@
|
||||
<body>
|
||||
<form action="/stash/{{stash_name}}/store" method="POST">
|
||||
{% for tab in stash.tabs %}
|
||||
<div>
|
||||
{% set tabloop = loop %}
|
||||
<h2>Tab {{tabloop.index}}</h2>
|
||||
{% for item in tab.items %}
|
||||
{% set itemloop = loop %}
|
||||
{% include "item.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="stash-tab">
|
||||
{% for item in tab.items %}
|
||||
{% set itemloop = loop %}
|
||||
{% include "item.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<input type="submit" value="Remove items">
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user