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:
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user