Skip to content

El boton de guardar el nombre deja de aplastar al campo #48

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ErickUser1 merged 1 commit into from
Aug 22, 2026
Merged

El boton de guardar el nombre deja de aplastar al campo #48

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,3 +50,4 @@ ESTADO.md
# trabajo local, no documentacion del proyecto: lo que un contribuidor
# necesita esta en README, CONTRIBUTING, E2E y ROADMAP.
CLAUDE.md
.gstack/
2 changes: 1 addition & 1 deletion web/src/CuentaPanel.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,7 @@ export function CuentaPanel(props: {
}}
/>
<button
className="key-guardar"
className="perfil-guardar"
disabled={guardando || !nombre.trim() || nombre.trim() === props.usuario.nombre}
onClick={() => void guardarNombre()}
>
Expand Down
21 changes: 17 additions & 4 deletions web/src/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2225,9 +2225,9 @@ img.av {
}

/* El input se lleva el espacio y el botón solo lo que ocupa su texto.
Sin el `width: auto` gana el `width: 100%` que `.name-input` trae de la
pantalla de entrada, y el flex acaba repartiendo al revés: el botón enorme y
el input de 40px. */
Dos cosas peleaban aquí: `.name-input` trae `width: 100%` de la pantalla de
entrada, y `.key-panel .key-guardar` pone el botón al 100% porque ahí es el
único de su fila. Por eso el botón NO usa esa clase: tiene la suya. */
.perfil-nombre .name-input {
flex: 1;
min-width: 0;
Expand All @@ -2236,8 +2236,21 @@ img.av {
padding: 8px 10px;
}

.perfil-nombre .key-guardar {
.perfil-guardar {
flex-shrink: 0;
border: 0;
border-radius: 4px;
background: var(--ambar);
color: #3d2a12;
font-family: inherit;
font-size: 11px;
font-weight: 700;
padding: 9px 14px;
cursor: pointer;
}
.perfil-guardar:disabled {
opacity: 0.4;
cursor: default;
}

.key-error {
Expand Down
Loading