feat: account dialog - Выйти beside the name, passkeys last after a line, the add button the field's height; a file pane's status says it is connected

internal/server/web/static/account.js

@@ -32,13 +32,8 @@
     '<div class="dlg-h"><strong style="flex:1">Аккаунт</strong>' +
     '<button type="button" class="btn ghost small icon close x" data-close title="Закрыть" aria-label="Закрыть">' + X + '</button></div>' +
     '<div class="dlg-b acct">' +
-    '  <div class="acct-who"><span class="acct-ava"></span><div><div class="acct-name"></div><div class="muted acct-mode"></div></div></div>' +
+    '  <div class="acct-who"><span class="acct-ava"></span><div class="acct-whotext"><div class="acct-name"></div><div class="muted acct-mode"></div></div>' +
-    '  <h3>Ключи доступа</h3>' +
+    '  <form method="post" action="/logout" class="acct-out"><input type="hidden" name="csrf"><button type="submit" class="btn ghost">Выйти</button></form></div>' +
-    '  <p class="muted acct-hint">Вход отпечатком, лицом, PIN-кодом устройства или аппаратным ключом. Ключей может быть несколько - например, телефон и ноутбук.</p>' +
-    '  <ul class="acct-keys"></ul>' +
-    '  <div class="acct-add"><input type="text" class="acct-keyname" maxlength="60" placeholder="название, например «телефон»">' +
-    '  <button type="button" class="acct-addbtn">Добавить ключ</button></div>' +
-    '  <p class="acct-msg"></p>' +
     '  <label class="acct-pw"><span><b>Вход по паролю</b><small class="muted acct-pwnote"></small></span>' +
     '  <input type="checkbox" class="sw" role="switch"></label>' +
     '  <label class="acct-pw acct-ai"><span><b>ИИ-ассистент</b><small class="muted">кнопка чата в правом нижнем углу</small></span>' +
@@ -61,7 +56,14 @@
     '  <option value="0">каждый раз</option><option value="5">5 минут</option><option value="15">15 минут</option>' +
     '  <option value="30">30 минут</option><option value="60">60 минут</option></select></label>' +
     '  <p class="acct-pinmsg" aria-live="polite"></p><p class="muted" style="font-size:12px;margin:8px 0 0">Спрашивается в каждой новой вкладке; при перезагрузке той же вкладки - нет.</p></details>' +
-    '  <form method="post" action="/logout" class="acct-out"><input type="hidden" name="csrf"><button type="submit" class="btn ghost">Выйти</button></form>' +
+    '  <div class="acct-keysec">' +
+    '  <h3>Ключи доступа</h3>' +
+    '  <p class="muted acct-hint">Вход отпечатком, лицом, PIN-кодом устройства или аппаратным ключом. Ключей может быть несколько - например, телефон и ноутбук.</p>' +
+    '  <ul class="acct-keys"></ul>' +
+    '  <div class="acct-add"><input type="text" class="acct-keyname" maxlength="60" placeholder="название, например «телефон»">' +
+    '  <button type="button" class="acct-addbtn">Добавить ключ</button></div>' +
+    '  <p class="acct-msg"></p>' +
+    '  </div>' +
     '</div>';
   document.body.appendChild(dlg);
   dlg.querySelector('.acct-out [name=csrf]').value = decodeURIComponent(csrf);

internal/server/web/static/app.css

@@ -209,7 +209,13 @@ input.sw:disabled { opacity: .45; cursor: not-allowed; }
 .acct-pingrace select { width: auto; flex: none; }
 .acct-pinmsg { margin: 8px 0 0; font-size: 13px; color: var(--ok, #3fb950); min-height: 0; }
 .acct-pinmsg.bad { color: var(--danger); }
-.acct-out { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; }
+.acct-out { margin: 0 0 0 auto; flex: none; }
+.acct-whotext { min-width: 0; }
+/* Ключи доступа below the rest, after a line. */
+.acct-keysec { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
+.acct-keysec h3 { margin-top: 0; }
+.acct-add input, .acct-add button { height: 40px; box-sizing: border-box; }
+.acct-add button { padding-top: 0; padding-bottom: 0; }
 /* Sign-in page. */
 .or { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; margin: 18px 0 4px; }
 .or::before, .or::after { content: ""; flex: 1; border-top: 1px solid var(--border); }

internal/server/web/static/filepane.js

@@ -208,7 +208,9 @@
       this.q('.fp-path').value = this.cwd;
       this.message('');
       this.render();
-      this.setState('ok', this.cwd);
+      // The status says whether it is connected, as a terminal's does; the
+      // folder is in the pane itself.
+      this.setState('ok', this.ssh ? 'SSH: ' + this.source.label + ':' + (this.ssh.port || 22) : 'подключено');
     }
     async go(path) {
       const r = await this.api('list', {path});