bijoe: improve style of data tables
This commit is contained in:
parent
6d7041c376
commit
3bc9af648b
|
@ -15,8 +15,29 @@ input[type=date] {
|
|||
select {
|
||||
width: 100%;
|
||||
}
|
||||
table {
|
||||
|
||||
table.bijoe-table {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
padding-left: 2em;
|
||||
width: 80%;
|
||||
height: 70vh;
|
||||
}
|
||||
|
||||
table.bijoe-table thead {
|
||||
flex: 0 0 auto;
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
}
|
||||
table.bijoe-table tr {
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
table.bijoe-table tbody {
|
||||
flex: 1 1 auto;
|
||||
display: block;
|
||||
overflow-y: auto;
|
||||
}
|
||||
input[type=submit] {
|
||||
float: right;
|
||||
|
@ -24,13 +45,9 @@ input[type=submit] {
|
|||
position: relative;
|
||||
}
|
||||
.filter { display: inline-block; }
|
||||
td {
|
||||
width: 10em;
|
||||
}
|
||||
th {
|
||||
text-overflow: ellipsis;
|
||||
text-align: left;
|
||||
width: 30px;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
@ -89,13 +106,13 @@ th {
|
|||
{% endfor %}
|
||||
</form>
|
||||
{% if data %}
|
||||
<table>
|
||||
<table class="bijoe-table">
|
||||
<thead>
|
||||
{% for dimension in drilldown %}
|
||||
<th>{{ dimension.label.capitalize }}</th>
|
||||
<th><span>{{ dimension.label.capitalize }}</span></th>
|
||||
{% endfor %}
|
||||
{% for measure in measures %}
|
||||
<th>{{ measure.label.capitalize }}</th>
|
||||
<th><span>{{ measure.label.capitalize }}</span></th>
|
||||
{% endfor %}
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
Reference in New Issue