Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

[Insight extractor] Feature: Collapsible Sidebar with Expand Icon

Abierto
  • ¿Algo no está bien?
#372 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
45/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
typescript
Área
frontend

Línea de trabajo

El issue no menciona archivos ni pruebas. Empieza localizando los componentes de la barra lateral y de la navegación superior, y después sigue su estado de colapso y su comportamiento de diseño. Se considera terminado cuando la barra lateral se oculta y se restaura por completo, la navegación muestra el icono de expandir solo mientras está colapsada, el contenido cambia de tamaño sin superposiciones y el comportamiento funciona en distintos tamaños de pantalla.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Bug
Image Image

Description
When the user clicks the collapse button on the sidebar, the entire sidebar should be hidden. Currently, only part of the sidebar is hidden. Once collapsed, an expand icon should appear in the top navigation bar to allow the user to restore the sidebar.

Requirements

Collapse Behavior

Clicking the collapse button hides the sidebar completely (not partially).

The main content area should automatically expand to use the freed space.

Expand Behavior

When the sidebar is collapsed, an expand icon appears in the top navigation bar.

Clicking this expand icon restores the sidebar to its full width.

UI/UX

Collapse button: positioned inside the sidebar (top-left-corner).

Expand button: positioned inside the top navigation bar (left side).

Image

Use consistent icons (e.g., left/right chevrons) to indicate collapse/expand actions.

Smooth transition animation (e.g., slide in/out or width transition) preferred.

Acceptance Criteria

✅ Sidebar fully disappears when collapse button is clicked.

✅ Top navigation bar shows expand icon when sidebar is collapsed.

✅ Clicking expand icon restores sidebar to full width.

✅ No layout overlap — main content expands/shrinks correctly.

✅ Behavior works across all screen sizes.

Lenguaje dominante
TypeScript
Estrellas
21
Forks
18
Sin PR fusionados en 30 d

Preparar el entorno

  • Incluye un Dockerfile o un archivo de Docker Compose
  • Tiene una plantilla de pull request
  • Sin guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de CodeForPhilly/balancer-main

Todos los issues de CodeForPhilly/balancer-main

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.