mirror of
https://codeberg.org/forgejo/forgejo
synced 2025-10-21 09:20:55 +02:00
aa345c9e0c
- 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>
59 lines
2.4 KiB
Go HTML Template
59 lines
2.4 KiB
Go HTML Template
{{template "base/head" .}}
|
|
<div role="main" aria-label="{{.Title}}" class="page-content repository file editor edit">
|
|
{{template "repo/header" .}}
|
|
<div class="ui container">
|
|
{{template "base/alert" .}}
|
|
<form class="ui edit form" method="post" action="{{.RepoLink}}/_diffpatch/{{.BranchName | PathEscapeSegments}}">
|
|
{{.CsrfTokenHtml}}
|
|
<input type="hidden" name="last_commit" value="{{.last_commit}}">
|
|
<input type="hidden" name="page_has_posted" value="{{.PageHasPosted}}">
|
|
<div class="repo-editor-header">
|
|
<div class="ui breadcrumb field {{if .Err_TreePath}}error{{end}}">
|
|
{{ctx.Locale.Tr "repo.editor.patching"}}
|
|
<a class="section" href="{{$.RepoLink}}">{{.Repository.FullName}}</a>
|
|
<div class="breadcrumb-divider">:</div>
|
|
<a class="section" href="{{$.BranchLink}}">{{.BranchName}}</a>
|
|
<span>{{ctx.Locale.Tr "repo.editor.or"}} <a href="{{$.BranchLink}}">{{ctx.Locale.Tr "repo.editor.cancel_lower"}}</a></span>
|
|
<input type="hidden" id="tree_path" name="tree_path" value="patch" required>
|
|
<input id="file-name" maxlength="500" type="hidden" value="diff.patch">
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<div class="ui top attached tabular menu" data-write="write">
|
|
<a class="active item" data-tab="write">{{svg "octicon-code" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.editor.new_patch"}}</a>
|
|
</div>
|
|
<div class="ui bottom attached active tab segment" data-tab="write">
|
|
<textarea id="edit_area" name="content" class="tw-hidden" data-id="repo-{{.Repository.Name}}-patch"
|
|
data-context="{{.RepoLink}}"
|
|
data-line-wrap-extensions="{{.LineWrapExtensions}}">
|
|
{{.FileContent}}</textarea>
|
|
<div class="editor-loading is-loading"></div>
|
|
</div>
|
|
</div>
|
|
{{template "repo/editor/commit_form" .}}
|
|
</form>
|
|
</div>
|
|
|
|
<dialog id="edit-empty-content-modal">
|
|
<article>
|
|
<header>
|
|
{{svg "octicon-file"}}
|
|
{{ctx.Locale.Tr "repo.editor.commit_empty_file_header"}}
|
|
</header>
|
|
<div class="content">
|
|
<p>{{ctx.Locale.Tr "repo.editor.commit_empty_file_text"}}</p>
|
|
</div>
|
|
<div class="actions">
|
|
<button class="ui cancel button">
|
|
{{svg "octicon-x"}}
|
|
{{ctx.Locale.Tr "repo.editor.cancel"}}
|
|
</button>
|
|
<button class="ui primary ok button">
|
|
{{svg "fontawesome-save"}}
|
|
{{ctx.Locale.Tr "repo.editor.commit_changes"}}
|
|
</button>
|
|
</div>
|
|
</article>
|
|
</dialog>
|
|
</div>
|
|
{{template "base/footer" .}}
|