Commit graph

3 commits

Author SHA1 Message Date
0ko
79c47c2e50 feat(ui): improve modal width rules (#10246)
Followup to https://codeberg.org/forgejo/forgejo/pulls/9636, https://codeberg.org/forgejo/forgejo/pulls/8859#issuecomment-6651595.

1. Due to lack of `min-width`, currently the new consistent dialogs can get disproportionally small to the screen. This PR adds a min-width of 400px. No deep consideration went into choosing this particular width.
    * To make the test not depend on modals we have in the UI with some arbitrary widths a devtest page was added instead
2. Use more horizontal space on narrow screens

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/10246
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
2025-11-28 19:38:50 +01:00
Gusted
2a3d852e46 feat: convert create/rename branch and create tag to native dialog (#9760)
Followup to https://codeberg.org/forgejo/forgejo/pulls/8859, https://codeberg.org/forgejo/forgejo/pulls/9636.

Convert the create branch and rename branch modals in the branch list to native dialogs and convert the create branch and create tag in the commit view to native dialogs.

The dialogs in the commit view have been simplified and no longer uses javascript to construct the data in the dialog (thus would be eligible for nojs modals).

The dialogs have footer styled actions.

The rename branch modal now has a 'branch name' label to indicate the field is required.

E2E testing is added.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/9760
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
2025-10-30 21:06:14 +01:00
Gusted
aa345c9e0c feat: first native dialog for modal (#8859)
- The current implementation for modals is provided by fomantic UI.
- This patch introduces a new implementation that relies on the `<dialog>` element to provide modal, whereby the heavy lifting is done by the browser.
- This implementation is considerably simpler, accessible (although untested) and lightweight. It is capable of replacing fomantic UI's modal implementation + our dimmer implementation (~2k lines of code and CSS).[^1] As a first step the empty content modal is migrated.
- This brings in the CSS needed to display `<dialog>` and a helper function that hides some boilerplate code that's needed to show `<dialog>` as a modal.
- Add a E2E test that shows the modal's cancel and approve button works.

[^1]: The heavy work has already been done by me in a local branch, but reviewing that gigantic patch in one PR is not doable.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8859
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
2025-09-20 20:09:17 +02:00