serv/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2024-12-27 22:23:50 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

fix(ui): put buttons in a single row on mobile

Browse source
This commit is contained in:
0ko 2024-11-21 22:46:06 +05:00
parent 8f0de303f3
commit 787e3163f8
5 changed files with 17 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
templates/repo/issue/view_content.tmpl
View file

@ -90,7 +90,7 @@
{{template "repo/issue/comment_tab" .}} {{template "repo/issue/comment_tab" .}}
{{.CsrfTokenHtml}} {{.CsrfTokenHtml}}
<div class="field footer"> <div class="field footer">
<div class="text right"> <div class="right button-sequence">
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .DisableStatusChange)}} {{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .DisableStatusChange)}}
{{if .Issue.IsClosed}} {{if .Issue.IsClosed}}
<button id="status-button" class="ui primary basic button" data-status="{{ctx.Locale.Tr "repo.issues.reopen_issue"}}" data-status-and-comment="{{ctx.Locale.Tr "repo.issues.reopen_comment_issue"}}" name="status" value="reopen"> <button id="status-button" class="ui primary basic button" data-status="{{ctx.Locale.Tr "repo.issues.reopen_issue"}}" data-status-and-comment="{{ctx.Locale.Tr "repo.issues.reopen_comment_issue"}}" name="status" value="reopen">

4
templates/repo/issue/view_content/conversation.tmpl
View file

@ -106,7 +106,7 @@
</div> </div>
{{end}} {{end}}
</div> </div>
<div class="code-comment-buttons tw-flex tw-items-center tw-flex-wrap tw-mt-2 tw-mb-1 tw-mx-2"> <div class="tw-flex tw-items-center tw-flex-wrap tw-mt-2 tw-mb-1 tw-mx-2">
<div class="tw-flex-1"> <div class="tw-flex-1">
{{if $resolved}} {{if $resolved}}
<div class="ui grey text"> <div class="ui grey text">
@ -115,7 +115,7 @@
</div> </div>
{{end}} {{end}}
</div> </div>
<div class="code-comment-buttons-buttons button-row"> <div class="right button-sequence">
{{if and $.CanMarkConversation $isNotPending}} {{if and $.CanMarkConversation $isNotPending}}
<button class="ui tiny basic button resolve-conversation" data-origin="timeline" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index .comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation"> <button class="ui tiny basic button resolve-conversation" data-origin="timeline" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index .comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
{{if $resolved}} {{if $resolved}}

14
web_src/css/base.css
View file

@ -250,6 +250,20 @@ h1.error-code {
gap: 0.5rem; gap: 0.5rem;
} }
.button-sequence {
display: flex;
flex-flow: wrap;
gap: 0.5em;
}
.button-sequence.right {
justify-content: end;
}
.button-sequence .ui.button {
margin: 0 !important;
}
.button-row .ui.button { .button-row .ui.button {
margin-right: 0; margin-right: 0;
} }

10
web_src/css/repo.css
View file

@ -925,16 +925,6 @@ td .commit-summary {
border-radius: var(--border-radius); border-radius: var(--border-radius);
} }
@media (max-width: 767.98px) {
.repository.view.issue .comment-list .comment .content .form .button {
width: 100%;
margin: 0;
}
.repository.view.issue .comment-list .comment .content .form .button:not(:last-child) {
margin-bottom: 1rem;
}
}
.repository.view.issue .comment-list .comment .merge-section { .repository.view.issue .comment-list .comment .merge-section {
background-color: var(--color-box-body); background-color: var(--color-box-body);
} }

21
web_src/css/review.css
View file

@ -76,19 +76,6 @@
max-width: none; max-width: none;
padding: 0.75rem !important; padding: 0.75rem !important;
} }
.comment-code-cloud .code-comment-buttons {
margin: 0.5rem 0 0.25rem !important;
}
.comment-code-cloud .code-comment-buttons .code-comment-buttons-buttons {
width: 100%;
}
.comment-code-cloud .ui.buttons {
width: 100%;
margin: 0 !important;
}
.comment-code-cloud .ui.buttons .button {
flex: 1;
}
} }
.comment-code-cloud .comments .comment { .comment-code-cloud .comments .comment {
@ -183,14 +170,6 @@
display: block; display: block;
} }
@media (max-width: 767.98px) {
.comment-code-cloud .button {
width: 100%;
margin: 0 !important;
margin-bottom: 0.75rem !important;
}
}
.diff-file-body .comment-form { .diff-file-body .comment-form {
margin: 0 0 0 3em; margin: 0 0 0 3em;
} }