Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Bug - Password Generator - Inconsistent Demo Layout in Docs (HTML vs TSX Demos)

Offen
#11,633 3 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Anfängerfreundlichkeit
48/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
react, typescript
Bereich
documentation, frontend

Rechercherichtung

Beginne auf der Dokumentationsseite von React Password Generator und vergleiche die TSX InputGroup-Demo mit der HTML FormGroup-Demo. Untersuche anschließend das verlinkte Template des Dokumentations-Frameworks unter packages/documentation-framework/templates/mdx.js und überprüfe dann, dass die TSX-Demo dieselbe lesbare Breite und dasselbe Layout wie die HTML-Demo hat.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Stale

Describe the problem

In the docs for Password Generator, there is an issue with the layout of the demo.

The HTML demo uses a FormGroup component, which renders the demo at the correct width (with a max-width of 825px set in the docs framework).

The TSX demo uses the InputGroup component, which seems to be the new recommended React component for this functionality. However the InputGroup demo is rendered at a very small width, making the code editor and the demo code difficult to read:

Image Image

How do you reproduce the problem?

  1. Go to the React docs for Password Generator
  2. See the TSX demo using InputGroup, which is collapsed and has a narrow width.
  3. Compare to the HTML demo using FormGroup which has the proper layout.

Expected behavior

TSX demo for the Password Generator should be displayed with the same layout and width as the HTML demo.

Screenshots

See above

What is your environment?

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Chrome

Vorherrschende Sprache
TypeScript
Sterne
862
Forks
392
Ø Merge
4 T. 8 Std.
Gemergte PRs (30 T.)
9

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus patternfly/patternfly-react

Alle Issues in patternfly/patternfly-react

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.