feat: version 2.7.2 -- tarjetas con icono en Contraseñas + fix borrado de password al editar

Listado de Contraseñas pasa de tabla a tarjetas: icono elegible (
catalogo fijo, sin servicios externos de favicon por privacidad) o
inicial del nombre como fallback, junto con nombre y enlace.

Fix real: editar una credencial sin revelar la contraseña antes la
dejaba vacia al guardar -- ahora se conserva la que ya estaba si no
se escribe una nueva.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Milton Gonzalez
2026-10-01 12:41:22 -05:00
parent 28e339f19a
commit 127ca2ba7e
11 changed files with 161 additions and 36 deletions
+31
View File
@@ -356,6 +356,37 @@ table.list-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.text-link { color: rgb(var(--accent)); text-decoration: none; }
.text-link:hover { text-decoration: underline; }
/* --- Contraseñas: tarjetas en vez de tabla --- */
.vault-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px;
}
.vault-card {
position: relative; background: rgb(var(--surface)); border: 1px solid rgb(var(--line));
border-radius: var(--r-lg); padding: 20px 14px 16px; cursor: pointer;
display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px;
transition: border-color .15s ease, transform .1s ease;
}
.vault-card:hover { border-color: rgb(var(--accent) / .5); }
.vault-card-menu { position: absolute; top: 6px; right: 6px; }
.vault-card-icon {
width: 48px; height: 48px; border-radius: 999px; background: rgb(var(--accent) / .15);
color: rgb(var(--accent)); display: flex; align-items: center; justify-content: center;
font-size: 1.1rem; font-weight: 700; flex: none;
}
.vault-card-title { font-size: .84rem; font-weight: 600; word-break: break-word; }
.vault-card-url {
font-size: .72rem; color: rgb(var(--muted)); max-width: 100%; overflow: hidden;
text-overflow: ellipsis; white-space: nowrap;
}
.vault-icon-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.vault-icon-option {
width: 36px; height: 36px; border-radius: 999px; border: 1px solid rgb(var(--line));
background: rgb(var(--field)); color: rgb(var(--body)); cursor: pointer;
display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .82rem;
}
.vault-icon-option:hover { border-color: rgb(var(--accent) / .6); }
.vault-icon-option.selected { border-color: rgb(var(--accent)); background: rgb(var(--accent) / .15); color: rgb(var(--accent)); }
/* --- DetailPopup (ver DetailPopup.jsx) ---
Al elegir un item de un listado, la lista queda inactiva detras del overlay y el popup
presenta la pantalla de info/edicion completa. Regla dura: NUNCA se cierra con clic afuera