Mirror/CyberChef
1
0
Fork 0
mirror of https://github.com/gchq/CyberChef.git synced 2024-11-16 17:08:31 +01:00
Code Issues Projects Releases Packages Wiki Activity

Improve UI for searching for input tabs

Browse source
This commit is contained in:
j433866 2019-05-10 13:48:03 +01:00
parent 2c02900edf
commit e34d521dcc
2 changed files with 47 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/web/html/index.html
View file

@ -769,24 +769,27 @@
</div> </div>
<div class="modal-body" id="input-tab-body"> <div class="modal-body" id="input-tab-body">
<h6>Load Status</h6> <h6>Load Status</h6>
<div class="checkbox .input-find-option"> <ul id="input-find-options">
<label for="input-show-pending"> <li class="checkbox .input-find-option">
<input type="checkbox" id="input-show-pending" checked=""> <label for="input-show-pending">
Pending <input type="checkbox" id="input-show-pending" checked="">
</label> Pending
</div> </label>
<div class="checkbox .input-find-option"> </li>
<label for="input-show-loading"> <li class="checkbox .input-find-option">
<input type="checkbox" id="input-show-loading" checked=""> <label for="input-show-loading">
Loading <input type="checkbox" id="input-show-loading" checked="">
</label> Loading
</div> </label>
<div class="checkbox .input-find-option"> </li>
<label for="input-show-loaded"> <li class="checkbox .input-find-option">
<input type="checkbox" id="input-show-loaded" checked=""> <label for="input-show-loaded">
Loaded <input type="checkbox" id="input-show-loaded" checked="">
</label> Loaded
</div> </label>
</li>
</ul>
<br>
<div class="form-group .input-find-option"> <div class="form-group .input-find-option">
<label for="input-filename-filter" class="bmd-label-floating">Filename</label> <label for="input-filename-filter" class="bmd-label-floating">Filename</label>
<input type="text" class="form-control" id="input-filename-filter"> <input type="text" class="form-control" id="input-filename-filter">

30
src/web/stylesheets/layout/_io.css
View file

@ -296,9 +296,26 @@
fill: var(--primary-font-colour); fill: var(--primary-font-colour);
} }
#input-find-options {
list-style: none;
width: 100%;
}
#input-find-options li {
display: flex;
flex-direction: row;
float: left;
padding: 10px;
width: auto;
text-align: center;
vertical-align: middle;
}
#input-search-results { #input-search-results {
list-style: none; list-style: none;
width: fit-content; width: 75%;
min-width: 200px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
@ -309,12 +326,17 @@
padding-top: 10px; padding-top: 10px;
padding-bottom: 10px; padding-bottom: 10px;
text-align: center; text-align: center;
transition: 0.25s ease all;
width: 100%; width: 100%;
background: var(--secondary-background-colour); color: var(--op-list-operation-font-colour);
background-color: var(--op-list-operation-bg-colour);
border-bottom: 2px solid var(--op-list-operation-border-colour);
}
#input-search-results li:first-of-type {
border-top: 2px solid var(--op-list-operation-border-colour);
} }
#input-search-results li:hover { #input-search-results li:hover {
cursor: pointer; cursor: pointer;
background: var(--primary-background-colour); filter: brightness(98%);
} }