mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-29 10:57:44 +09:00 
			
		
		
		
	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>
This commit is contained in:
		| @@ -184,7 +184,7 @@ | |||||||
| 				</div> | 				</div> | ||||||
| 		</div> | 		</div> | ||||||
| 		{{if .Commit.Signature}} | 		{{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"> | 				<div class="gt-df gt-ac"> | ||||||
| 					{{if .Verification.Verified}} | 					{{if .Verification.Verified}} | ||||||
| 						{{if ne .Verification.SigningUser.ID 0}} | 						{{if ne .Verification.SigningUser.ID 0}} | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| {{$showFileTree := (and (not .DiffNotAvailable) (gt .Diff.NumFiles 1))}} | {{$showFileTree := (and (not .DiffNotAvailable) (gt .Diff.NumFiles 1))}} | ||||||
| <div> | <div> | ||||||
| 	<div class="diff-detail-box diff-box"> | 	<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}} | 			{{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"}}"> | 				<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 */}} | 					{{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}} | ||||||
|   | |||||||
| @@ -21,6 +21,7 @@ | |||||||
|   --border-radius-circle: 50%; |   --border-radius-circle: 50%; | ||||||
|   --opacity-disabled: 0.55; |   --opacity-disabled: 0.55; | ||||||
|   --height-loading: 16rem; |   --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; |   --tab-size: 4; | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -492,6 +493,11 @@ ol.ui.list li, | |||||||
|   background: var(--color-active) !important; |   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 */ | /* styles from removed fomantic transition module */ | ||||||
| .hidden.transition { | .hidden.transition { | ||||||
|   visibility: hidden; |   visibility: hidden; | ||||||
|   | |||||||
| @@ -37,13 +37,12 @@ | |||||||
| .combo-markdown-editor textarea.markdown-text-editor { | .combo-markdown-editor textarea.markdown-text-editor { | ||||||
|   display: block; |   display: block; | ||||||
|   width: 100%; |   width: 100%; | ||||||
|   min-height: 200px; |   max-height: calc(100vh - var(--min-height-textarea)); | ||||||
|   max-height: calc(100vh - 200px); |  | ||||||
|   resize: vertical; |   resize: vertical; | ||||||
| } | } | ||||||
|  |  | ||||||
| .combo-markdown-editor .CodeMirror-scroll { | .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 */ | /* use the same styles as markup/content.css */ | ||||||
|   | |||||||
| @@ -1498,12 +1498,6 @@ | |||||||
|   background: var(--color-body); |   background: var(--color-body); | ||||||
| } | } | ||||||
|  |  | ||||||
| @media (max-width: 991.98px) { |  | ||||||
|   .repository .diff-detail-box { |  | ||||||
|     flex-direction: row; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| @media (max-width: 480px) { | @media (max-width: 480px) { | ||||||
|   .repository .diff-detail-box { |   .repository .diff-detail-box { | ||||||
|     flex-wrap: wrap; |     flex-wrap: wrap; | ||||||
| @@ -1528,7 +1522,7 @@ | |||||||
|   color: var(--color-red); |   color: var(--color-red); | ||||||
| } | } | ||||||
|  |  | ||||||
| @media (max-width: 991.98px) { | @media (max-width: 800px) { | ||||||
|   .repository .diff-detail-box .diff-detail-stats { |   .repository .diff-detail-box .diff-detail-stats { | ||||||
|     display: none !important; |     display: none !important; | ||||||
|   } |   } | ||||||
| @@ -1538,7 +1532,6 @@ | |||||||
|   display: flex; |   display: flex; | ||||||
|   align-items: center; |   align-items: center; | ||||||
|   gap: 0.25em; |   gap: 0.25em; | ||||||
|   flex-wrap: wrap; |  | ||||||
|   justify-content: end; |   justify-content: end; | ||||||
| } | } | ||||||
|  |  | ||||||
| @@ -1548,15 +1541,6 @@ | |||||||
|   margin-right: 0 !important; |   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 { | .repository .diff-detail-box span.status { | ||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   width: 12px; |   width: 12px; | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user