Minor UI fix.

- keep .staytop/.staybot sticky
- .fnd inheritance
This commit is contained in:
Blaz Kristan 2022-04-17 12:01:44 +02:00
parent 1663601dcb
commit 3081802b1c
3 changed files with 1364 additions and 1364 deletions

View File

@ -349,7 +349,7 @@ button {
.staytop, .staybot { .staytop, .staybot {
display: block; display: block;
position: -webkit-sticky; position: -webkit-sticky;
position: sticky; position: sticky !important;
top: 0; top: 0;
z-index: 2; z-index: 2;
margin: 0 auto auto; margin: 0 auto auto;
@ -1177,7 +1177,7 @@ textarea {
position: relative; position: relative;
} }
input[type="text"].fnd { .fnd input[type="text"] {
display: block; display: block;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
@ -1189,12 +1189,12 @@ input[type="text"].fnd {
border: 1px solid var(--c-3); border: 1px solid var(--c-3);
} }
input[type="text"].fnd:focus { .fnd input[type="text"]:focus {
background-color: var(--c-4); background-color: var(--c-4);
} }
input[type="text"].fnd:not(:placeholder-shown), .fnd input[type="text"]:not(:placeholder-shown),
input[type="text"].fnd:hover { .fnd input[type="text"]:hover {
background-color: var(--c-3); background-color: var(--c-3);
} }

View File

@ -164,7 +164,7 @@
<p class="labels" id="pall"><i class="icons sel-icon" onclick="tglHex()">&#xe2b3;</i> Color palette</p> <p class="labels" id="pall"><i class="icons sel-icon" onclick="tglHex()">&#xe2b3;</i> Color palette</p>
<div id="palw" class="il"> <div id="palw" class="il">
<div class="staytop fnd"> <div class="staytop fnd">
<input type="text" class="fnd" placeholder="Search" oninput="search(this,'pallist')" onfocus="search(this,'pallist')" /> <input type="text" placeholder="Search" oninput="search(this,'pallist')" onfocus="search(this,'pallist')" />
<i class="icons clear-icon" onclick="clean(this)">&#xe38f;</i> <i class="icons clear-icon" onclick="clean(this)">&#xe38f;</i>
<i class="icons search-icon">&#xe0a1;</i> <i class="icons search-icon">&#xe0a1;</i>
</div> </div>
@ -186,7 +186,7 @@
<div id="fx"> <div id="fx">
<p class="labels hd" id="modeLabel">Effect mode</p> <p class="labels hd" id="modeLabel">Effect mode</p>
<div class="staytop fnd" id="fxFind"> <div class="staytop fnd" id="fxFind">
<input type="text" class="fnd" placeholder="Search" oninput="search(this,'fxlist')" onfocus="search(this,'fxlist')" /> <input type="text" placeholder="Search" oninput="search(this,'fxlist')" onfocus="search(this,'fxlist')" />
<i class="icons clear-icon" onclick="clean(this);">&#xe38f;</i> <i class="icons clear-icon" onclick="clean(this);">&#xe38f;</i>
<i class="icons search-icon">&#xe0a1;</i> <i class="icons search-icon">&#xe0a1;</i>
</div> </div>
@ -268,7 +268,7 @@
</div> </div>
<p class="labels hd">Presets</p> <p class="labels hd">Presets</p>
<div class="staytop fnd" id="psFind"> <div class="staytop fnd" id="psFind">
<input type="text" class="fnd" placeholder="Search" oninput="search(this,'pcont')" onfocus="search(this,'pcont')" /> <input type="text" placeholder="Search" oninput="search(this,'pcont')" onfocus="search(this,'pcont')" />
<i class="icons clear-icon" onclick="clean(this);">&#xe38f;</i> <i class="icons clear-icon" onclick="clean(this);">&#xe38f;</i>
<i class="icons search-icon">&#xe0a1;</i> <i class="icons search-icon">&#xe0a1;</i>
</div> </div>

File diff suppressed because it is too large Load Diff