Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

fix(ui): contener las capas de los popups dentro de sus esquinas

Open
#95 0 comments 0 reactions 1 assignee View on GitHub

Maintainers usually reply within 1 day

@egdev6 is already working on this.

Since Oct 12, 2026.

Assessment

This issue has not been assessed yet.

Description

status:approved type:bug
Pre-flight checks
  • I searched existing issues and found no duplicate.
  • I understand that this report enters review before implementation.

El asistente completó la búsqueda de issues abiertas/cerradas y contrastó el inventario y antecedentes. El mantenedor confirmó la revisión previa y aprobó la publicación de quorb-ui-ux-v1. Esto no asigna trabajo ni inicia implementación.

What happened?

El mantenedor reporta que las capas superiores de los popups de detalle sobresalen del contorno redondeado. La captura aportada muestra bandas/fondo rectangulares en ambas esquinas superiores del panel Claude.

La inspección de main 3da13d206418d6f9a91647f0a4ce127b3ed5364c identifica un conflicto coherente con el reporte: DetailPanel.tsx aplica overflow: visible inline y el tema tiene bandas sin radio y radios de distintas capas. Es evidencia estática, no reproducción del artefacto ni prueba de causa única.

Steps to reproduce
  1. Ejecutar Quorb en modo desarrollo sobre la rama main, como en el entorno reportado.
  2. Abrir un popup de detalle desde la tira; el ejemplo aportado es Claude.
  3. Observar las esquinas superiores y comparar el contorno exterior con las capas del encabezado/fondo.
  4. Registrar el caso mínimo en el entorno real antes de corregir; extender la comprobación a los demás paneles que compartan la estructura.

Estos pasos describen el escenario reportado; el asistente no los ha ejecutado.

Expected behavior

Encabezado y fondos respetan las esquinas y el contorno del popup.

Alcance y criterios de aceptación
  • Reproducir y registrar el artefacto en el entorno dev de escritorio, identificando las capas involucradas.
  • Unificar el contorno/radio de las capas afectadas y evitar fondos que sobresalgan en las esquinas.
  • No cortar contenido, iconos, acciones, indicadores de foco ni sombras exteriores intencionadas al introducir clipping.
  • Conservar el ajuste de altura sin scroll y la medición/geometría integrados en #70 / PR #71.
  • Validar paneles de varios proveedores y tamaños/escalados pertinentes; evidencia visual antes/después.
  • Checks focales y regresión visual con estilos reales; ejecución desktop final explícita, sin afirmar reproducción Windows desde Chromium.
Orientación y antecedentes

Entradas: src/DetailPanel.tsx, estructura de tarjetas/paneles, src/theme.css y src/styles.css. Referencia técnica: DetailPanel en main inspeccionado. No imponer overflow: hidden global sin validar medición, foco y sombras.

La búsqueda identifica #70 como antecedente de altura, no duplicado del clipping de esquinas. No reabrir ni cambiar #70. La unidad de paleta comparte theme.css: coordinar entregas sin dependencia funcional artificial.

Coordinación, validación y límites

Parte de la propuesta aprobada quorb-ui-ux-v1, milestone «Coherencia visual y personalización». Trabajo por el flujo habitual; no se incorpora automáticamente a ODD ni altera prioridades de #45. Sin assignee ni nueva etiqueta status:approved. Antes de empezar revisar responsables, comentarios y PR, y coordinar las superficies compartidas.

Tests y documentación con cada unidad. Checks de implementación previstos, no ejecutados durante planificación: npm test, npm run typecheck, npm run build y cargo test en src-tauri cuando cambie comportamiento Rust; además prueba real de escritorio en modo desarrollo. No acreditar comportamiento Windows/WebView2 desde tests de lógica o fixtures de navegador. No se publica una versión ni se modifica el código al crear esta issue.

No editar directamente el DS vendorizado src/ds/egdev/* (ver su README); usar extensión de la app o coordinar el cambio upstream. Sin rediseño general, migración de cuentas, cambios de credenciales, firma, releases o nuevas versiones prometidas.

Environment
Quorb: modo desarrollo, rama main (reportado por el mantenedor).
SO y versión exactos: no facilitados.
SHA exacto del checkout del usuario: no facilitado.
Referencia inspeccionada por el asistente: main 3da13d206418d6f9a91647f0a4ce127b3ed5364c, versión 0.6.0.
Evidencia: captura del popup Claude; sin reproducción ejecutada por el asistente.
Affected area

Application behavior

Agent or client (for MCP or headless incidents)

No response

Shell (for MCP or headless incidents)

No response

Dominant language
TypeScript
Stars
10
Forks
2
Avg merge
2h 45m
Merged PRs (30d)
75

Getting set up

This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from egdev6/quorb

All issues in egdev6/quorb

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.