Clean up diff header css and reduce global textarea min-height (#29232)
1. Tweak diff header and remove a numbe of unneeded CSS for it: Before: <img width="433" alt="Screenshot 2024-02-18 at 01 08 09" src="https://github.com/go-gitea/gitea/assets/115237/d8b377c0-57bc-44d5-bb57-a582c7d4b3b4"> After: <img width="463" alt="Screenshot 2024-02-18 at 01 07 56" src="https://github.com/go-gitea/gitea/assets/115237/d08c17e7-5b86-4d07-81da-6371f4754325"> 3. Reduce height of review textarea and also reduce fomantic's CSS from 12em to 8em. Now fits better on my screen: <img width="1352" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/5c658d13-295e-4929-94da-13ade888020d"> --------- Co-authored-by: delvh <dev.lh@web.de> (cherry picked from commit 39f8ab591c18a65cf783ecd17ddc1a5914ceff7a)
This commit is contained in:
parent
d611fe8d26
commit
aefc747ccb
5 changed files with 11 additions and 22 deletions
|
@ -184,7 +184,7 @@
|
|||
</div>
|
||||
</div>
|
||||
{{if .Commit.Signature}}
|
||||
<div class="ui bottom attached message gt-text-left gt-df gt-ac gt-sb commit-header-row gt-fw {{$class}}">
|
||||
<div class="ui bottom attached message gt-text-left gt-df gt-ac gt-sb commit-header-row gt-fw gt-mb-0 {{$class}}">
|
||||
<div class="gt-df gt-ac">
|
||||
{{if .Verification.Verified}}
|
||||
{{if ne .Verification.SigningUser.ID 0}}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{{$showFileTree := (and (not .DiffNotAvailable) (gt .Diff.NumFiles 1))}}
|
||||
<div>
|
||||
<div class="diff-detail-box diff-box">
|
||||
<div class="gt-df gt-ac gt-fw">
|
||||
<div class="gt-df gt-ac gt-fw gt-gap-3 gt-ml-1">
|
||||
{{if $showFileTree}}
|
||||
<button class="diff-toggle-file-tree-button not-mobile btn interact-fg" data-show-text="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}" data-hide-text="{{ctx.Locale.Tr "repo.diff.hide_file_tree"}}">
|
||||
{{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}}
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
--border-radius-circle: 50%;
|
||||
--opacity-disabled: 0.55;
|
||||
--height-loading: 16rem;
|
||||
--min-height-textarea: 132px; /* padding + 6 lines + border = calc(1.57142em + 6lh + 2px), but lh is not fully supported */
|
||||
--tab-size: 4;
|
||||
}
|
||||
|
||||
|
@ -492,6 +493,11 @@ ol.ui.list li,
|
|||
background: var(--color-active) !important;
|
||||
}
|
||||
|
||||
.ui.form textarea:not([rows]) {
|
||||
height: var(--min-height-textarea); /* override fomantic default 12em */
|
||||
min-height: var(--min-height-textarea); /* override fomantic default 8em */
|
||||
}
|
||||
|
||||
/* styles from removed fomantic transition module */
|
||||
.hidden.transition {
|
||||
visibility: hidden;
|
||||
|
|
|
@ -37,13 +37,12 @@
|
|||
.combo-markdown-editor textarea.markdown-text-editor {
|
||||
display: block;
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
max-height: calc(100vh - 200px);
|
||||
max-height: calc(100vh - var(--min-height-textarea));
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.combo-markdown-editor .CodeMirror-scroll {
|
||||
max-height: calc(100vh - 200px);
|
||||
max-height: calc(100vh - var(--min-height-textarea));
|
||||
}
|
||||
|
||||
/* use the same styles as markup/content.css */
|
||||
|
|
|
@ -1498,12 +1498,6 @@
|
|||
background: var(--color-body);
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
.repository .diff-detail-box {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.repository .diff-detail-box {
|
||||
flex-wrap: wrap;
|
||||
|
@ -1528,7 +1522,7 @@
|
|||
color: var(--color-red);
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
@media (max-width: 800px) {
|
||||
.repository .diff-detail-box .diff-detail-stats {
|
||||
display: none !important;
|
||||
}
|
||||
|
@ -1538,7 +1532,6 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.25em;
|
||||
flex-wrap: wrap;
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
|
@ -1548,15 +1541,6 @@
|
|||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.repository .diff-detail-box .diff-detail-actions {
|
||||
padding-top: 0.25rem;
|
||||
}
|
||||
.repository .diff-detail-box .diff-detail-actions .ui.button:not(.btn-submit) {
|
||||
padding: 0 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.repository .diff-detail-box span.status {
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
|
|
Loading…
Reference in a new issue