1
1
mirror of https://github.com/go-gitea/gitea synced 2025-07-26 12:18:36 +00:00

Improve mobile review ui (#31091)

Fixes: https://github.com/go-gitea/gitea/issues/31071

Not perfect but much better than before.

Before: Overflows, sticky not working, filename unreadable:

<img width="506" alt="Screenshot 2024-05-27 at 02 02 40"
src="https://github.com/go-gitea/gitea/assets/115237/a06b1edf-dece-4402-98c2-68670fca265f">

After:
<img width="457" alt="Screenshot 2024-05-27 at 01 59 06"
src="https://github.com/go-gitea/gitea/assets/115237/2a282c96-e719-4554-b418-81963ae6269c">
This commit is contained in:
silverwind
2024-05-28 15:41:37 +02:00
committed by GitHub
parent de4616690f
commit 1e3c4d8fc7
7 changed files with 69 additions and 112 deletions

View File

@@ -3,6 +3,7 @@
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
margin-right: 0 !important;
}
.ui.button.add-code-comment {
@@ -71,57 +72,10 @@
max-width: 820px;
}
@media (max-width: 767.98px) {
.comment-code-cloud {
max-width: none;
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 {
padding: 0;
}
@media (max-width: 767.98px) {
.comment-code-cloud .comments .comment .comment-header-right.actions .ui.basic.label {
display: none;
}
.comment-code-cloud .comments .comment .avatar {
width: auto;
float: none;
margin: 0 0.5rem 0 0;
flex-shrink: 0;
}
.comment-code-cloud .comments .comment .avatar ~ .content {
margin-left: 1em;
}
.comment-code-cloud .comments .comment img.avatar {
margin: 0 !important;
}
.comment-code-cloud .comments .comment .comment-content {
margin-left: 0 !important;
}
.comment-code-cloud .comments .comment .comment-container {
width: 100%;
}
.comment-code-cloud .comments .comment.code-comment {
padding: 0 0 0.5rem !important;
}
}
.comment-code-cloud .attached.tab {
border: 0;
padding: 0;
@@ -132,6 +86,13 @@
padding: 1px 8px 1px 12px;
}
@media (max-width: 767.98px) {
.comment-code-cloud .attached.header {
padding-top: 4px;
padding-bottom: 4px;
}
}
.comment-code-cloud .attached.header .text {
margin: 0;
}
@@ -179,14 +140,6 @@
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 {
margin: 0 0 0 3em;
}
@@ -273,11 +226,16 @@
align-items: center;
border: 1px solid transparent;
padding: 4px 8px;
margin: -8px 0; /* just like other buttons in the diff box header */
border-radius: var(--border-radius);
font-size: 0.857rem; /* just like .ui.tiny.button */
}
@media (max-width: 767.98px) {
.viewed-file-form {
margin-left: auto;
}
}
.viewed-file-form input {
margin-right: 4px;
}