Filter draft for history

This commit is contained in:
2021-04-15 11:57:06 +02:00
parent dd80840c67
commit cced38ceac
4 changed files with 86 additions and 28 deletions

View File

@@ -209,6 +209,11 @@
justify-content: space-between; justify-content: space-between;
} }
.display-space-evenly {
display: flex;
justify-content: space-evenly;
}
.content p { .content p {
margin: 0; margin: 0;
padding: 0; padding: 0;
@@ -292,6 +297,10 @@
width: 50%; width: 50%;
} }
.tree-fourth-width {
width: 75%;
}
.half-width.with-padding { .half-width.with-padding {
width: 45%; width: 45%;
} }

View File

@@ -105,20 +105,40 @@
</div> </div>
<!-- history --> <!-- history -->
<div id="history" class="medium-vertical-margin tabcontent"> <div id="history" class="medium-vertical-margin tabcontent">
<table class="table-default"> <div class="block-display max-width">
<tr class="bottom-border"> <div class="display-space-between max-width small-vertical-margin">
<th>Timestamp</th> <div class="three-fourth-width display-space-evenly">
<th>Type</th> <div class="block-display half-width with-padding">
</tr> <label for="historyFrom" class="block-label">From</label>
<tr class="even"> <input id="historyFrom" type="date" class="bordered-field max-width with-padding">
<td>2021-01-01T10:57:26</td> <input id="historyTimeFrom" type="time" class="small-vertical-margin bordered-field max-width with-padding">
<td>Client request</td> </div>
</tr> <div class="block-display half-width with-padding">
<tr> <label for="historyTo" class="block-label">To</label>
<td>2021-01-01T10:57:26</td> <input id="historyTo" type="date" class="bordered-field max-width with-padding">
<td>Client request</td> <input id="historyTimeTo" type="time" class="small-vertical-margin bordered-field max-width with-padding">
</tr> </div>
</table> </div>
<button class="quater-width action-button active small-margins">Search</button>
</div>
<div class="max-width centered-content large-vertical-margin">
<table class="table-default">
<tr class="bottom-border">
<th>Timestamp</th>
<th>Type</th>
</tr>
<tr class="even">
<td>2021-01-01T10:57:26</td>
<td>Client request</td>
</tr>
<tr>
<td>2021-01-01T10:57:26</td>
<td>Client request</td>
</tr>
</table>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -209,6 +209,11 @@
justify-content: space-between; justify-content: space-between;
} }
.display-space-evenly {
display: flex;
justify-content: space-evenly;
}
.content p { .content p {
margin: 0; margin: 0;
padding: 0; padding: 0;
@@ -292,6 +297,10 @@
width: 50%; width: 50%;
} }
.tree-fourth-width {
width: 75%;
}
.half-width.with-padding { .half-width.with-padding {
width: 45%; width: 45%;
} }

View File

@@ -105,20 +105,40 @@
</div> </div>
<!-- history --> <!-- history -->
<div id="history" class="medium-vertical-margin tabcontent"> <div id="history" class="medium-vertical-margin tabcontent">
<table class="table-default"> <div class="block-display max-width">
<tr class="bottom-border"> <div class="display-space-between max-width small-vertical-margin">
<th>Timestamp</th> <div class="three-fourth-width display-space-evenly">
<th>Type</th> <div class="block-display half-width with-padding">
</tr> <label for="historyFrom" class="block-label">From</label>
<tr class="even"> <input id="historyFrom" type="date" class="bordered-field max-width with-padding">
<td>2021-01-01T10:57:26</td> <input id="historyTimeFrom" type="time" class="small-vertical-margin bordered-field max-width with-padding">
<td>Client request</td> </div>
</tr> <div class="block-display half-width with-padding">
<tr> <label for="historyTo" class="block-label">To</label>
<td>2021-01-01T10:57:26</td> <input id="historyTo" type="date" class="bordered-field max-width with-padding">
<td>Client request</td> <input id="historyTimeTo" type="time" class="small-vertical-margin bordered-field max-width with-padding">
</tr> </div>
</table> </div>
<button class="quater-width action-button active small-margins">Search</button>
</div>
<div class="max-width centered-content large-vertical-margin">
<table class="table-default">
<tr class="bottom-border">
<th>Timestamp</th>
<th>Type</th>
</tr>
<tr class="even">
<td>2021-01-01T10:57:26</td>
<td>Client request</td>
</tr>
<tr>
<td>2021-01-01T10:57:26</td>
<td>Client request</td>
</tr>
</table>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>