"Dynamic" line breaks in very long text

Abierto
  • ¿Algo no está bien?
#1,480 1 comentario 1 reacción 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
42/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
react, tailwindcss, typescript
Área
frontend

Línea de trabajo

Comienza por el renderizado de la etiqueta Sidebar.Collapse mostrado en el issue e inspecciona cómo sus clases de Tailwind CSS gestionan el texto largo. Se considera terminado cuando las etiquetas largas se ajustan en los espacios en blanco sin desbordarse ni romper el diseño de la barra lateral; verifica el comportamiento en la UI de la barra lateral correspondiente.

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

Descripción

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Summary

I am working on a project with Preact and shadcn-ui (TailwindCSS) but needed a sidebar navigation and thus came to this project here. I noticed, that very long texts do not get linebreaks. Here is an example:

image

The piece you see here is actually this:

          <Sidebar.Collapse label="Technischorganisatorische Maßnahmen">
            <Link to="#">Audits</Link>
            <Link to="#">DSFA / Datenschutzfolgeabschätzung</Link>
            <Link to="#">Audits</Link>
          </Sidebar.Collapse>

Hence, I would like to request a feature whereby long labels like this would get a linebreak separated by their whitespace.

Context

This is just a very simple CRUD application; a few tables and whatnot. But, my supervisor isn't exactly savy and I am the only one in this whole company with a proper development background. Due to my visual impairment however, I am much more of a TUI dude than GUI ;) Doing my best with what I have. I am sure this could be solved with some CSS, but I couldn't figure it out unfortunately...

Thank you and kind regards!

Lenguaje dominante
TypeScript
Estrellas
2.1k
Forks
502
Merge medio
19 h 16 min
PR fusionados (30 d)
2

Preparar el entorno

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 themesberg/flowbite-react

Todos los issues de themesberg/flowbite-react

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.