feat: the folder properties button sits inside the path field
This commit is contained in:
1 parent
65359f5497
commit
21436d5c73
1 file changed
+10
-3
@@ -17,6 +17,11 @@
|
|||||||
background:#0c0f13; border:1px solid var(--border); border-radius:8px; padding:8px 12px;
|
background:#0c0f13; border:1px solid var(--border); border-radius:8px; padding:8px 12px;
|
||||||
flex:1; min-width:200px; height:34px; box-sizing:border-box; }
|
flex:1; min-width:200px; height:34px; box-sizing:border-box; }
|
||||||
input.fm-path:focus { outline:none; border-color:var(--accent); color:var(--text); }
|
input.fm-path:focus { outline:none; border-color:var(--accent); color:var(--text); }
|
||||||
|
/* The path field, with the folder's properties button inside it on the right. */
|
||||||
|
.fm-pathbox { position:relative; flex:1; min-width:200px; display:flex; }
|
||||||
|
.fm-pathbox input.fm-path { width:100%; min-width:0; padding-right:40px; }
|
||||||
|
.fm-bar .fm-pathbox .btn.sq { position:absolute; right:3px; top:3px; width:28px; height:28px; border:1px solid transparent; }
|
||||||
|
.fm-bar .fm-pathbox .btn.sq:hover { border-color:var(--border); background:#151a21; }
|
||||||
.spinner { width:16px; height:16px; border:2px solid var(--border); border-top-color:var(--accent);
|
.spinner { width:16px; height:16px; border:2px solid var(--border); border-top-color:var(--accent);
|
||||||
border-radius:50%; animation:spin .7s linear infinite; display:none; }
|
border-radius:50%; animation:spin .7s linear infinite; display:none; }
|
||||||
@keyframes spin { to { transform:rotate(360deg); } }
|
@keyframes spin { to { transform:rotate(360deg); } }
|
||||||
@@ -59,7 +64,7 @@
|
|||||||
table.fm .c-act { width:1%; }
|
table.fm .c-act { width:1%; }
|
||||||
table.fm td, table.fm th { padding:7px 4px; }
|
table.fm td, table.fm th { padding:7px 4px; }
|
||||||
.ic { margin-right:4px; }
|
.ic { margin-right:4px; }
|
||||||
.fm-bar input.fm-path { flex:1 1 100%; order:-1; }
|
.fm-bar .fm-pathbox { flex:1 1 100%; order:-1; }
|
||||||
}
|
}
|
||||||
dialog { background:var(--panel); color:var(--text); border:1px solid var(--border);
|
dialog { background:var(--panel); color:var(--text); border:1px solid var(--border);
|
||||||
border-radius:12px; padding:0; max-width:900px; width:92vw; }
|
border-radius:12px; padding:0; max-width:900px; width:92vw; }
|
||||||
@@ -215,9 +220,11 @@
|
|||||||
<div class="wrap" style="max-width:1100px">
|
<div class="wrap" style="max-width:1100px">
|
||||||
<div class="fm-bar">
|
<div class="fm-bar">
|
||||||
<button class="btn ghost small" id="up">↑ Вверх</button>
|
<button class="btn ghost small" id="up">↑ Вверх</button>
|
||||||
<input class="fm-path" id="path" value="/" spellcheck="false" autocapitalize="off" autocomplete="off">
|
<div class="fm-pathbox">
|
||||||
|
<input class="fm-path" id="path" value="/" spellcheck="false" autocapitalize="off" autocomplete="off">
|
||||||
|
<button class="btn ghost small icon sq" id="dirprops" title="Свойства папки" aria-label="Свойства папки"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M21 4h-7M10 4H3M21 12h-9M8 12H3M21 20h-5M12 20H3M14 2v4M8 10v4M16 18v4"/></svg></button>
|
||||||
|
</div>
|
||||||
<button type="button" class="busy" id="busy" title=""><span class="spinner" id="spin"></span><span id="uppct"></span></button>
|
<button type="button" class="busy" id="busy" title=""><span class="spinner" id="spin"></span><span id="uppct"></span></button>
|
||||||
<button class="btn ghost small icon sq" id="dirprops" title="Свойства папки" aria-label="Свойства папки"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M21 4h-7M10 4H3M21 12h-9M8 12H3M21 20h-5M12 20H3M14 2v4M8 10v4M16 18v4"/></svg></button>
|
|
||||||
<button class="btn ghost small" id="refresh">Обновить</button>
|
<button class="btn ghost small" id="refresh">Обновить</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="fm-bar">
|
<div class="fm-bar">
|
||||||
|
|||||||
Reference in new issue
Block a user