mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-26 12:27:06 +00:00 
			
		
		
		
	Diff box fixes (#15214)
- Fix misaligned "Show Outdated" buttons via flexbox - Add hover effect to "Show Outdated" buttons - Remove overreaching margin from selector .diff-file-box and handle cases individually. Fixes: https://github.com/go-gitea/gitea/issues/15097 Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: 6543 <6543@obermui.de> Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
		| @@ -43,7 +43,7 @@ | ||||
| 		</ol> | ||||
| 		{{range $i, $file := .Diff.Files}} | ||||
| 			{{if $file.IsIncomplete}} | ||||
| 				<div class="diff-file-box diff-box file-content"> | ||||
| 				<div class="diff-file-box diff-box file-content mt-3"> | ||||
| 					<h4 class="ui top attached normal header rounded"> | ||||
| 						<a role="button" class="fold-file muted mr-2"> | ||||
| 							{{svg "octicon-chevron-down" 18}} | ||||
| @@ -70,7 +70,7 @@ | ||||
| 					</h4> | ||||
| 				</div> | ||||
| 			{{else}} | ||||
| 				<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}" id="diff-{{.Index}}"> | ||||
| 				<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} mt-3" id="diff-{{.Index}}"> | ||||
| 					<h4 class="diff-file-header sticky-2nd-row ui top attached normal header df ac sb"> | ||||
| 						<div class="df ac"> | ||||
| 							{{$isImage := false}} | ||||
| @@ -145,7 +145,7 @@ | ||||
| 		{{end}} | ||||
|  | ||||
| 		{{if .Diff.IsIncomplete}} | ||||
| 			<div class="diff-file-box diff-box file-content"> | ||||
| 			<div class="diff-file-box diff-box file-content mt-3"> | ||||
| 				<h4 class="ui top attached normal header"> | ||||
| 					{{$.i18n.Tr "repo.diff.too_many_files"}} | ||||
| 				</h4> | ||||
|   | ||||
| @@ -3,16 +3,20 @@ | ||||
| {{$isNotPending := (not (eq (index .comments 0).Review.Type 0))}} | ||||
| <div class="conversation-holder" data-path="{{(index .comments 0).TreePath}}" data-side="{{if lt (index .comments 0).Line 0}}left{{else}}right{{end}}" data-idx="{{(index .comments 0).UnsignedLine}}"> | ||||
| 	{{if $resolved}} | ||||
| 		<div class="ui attached header resolved-placeholder"> | ||||
| 			<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span> | ||||
| 			<button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button show-outdated"> | ||||
| 				{{svg "octicon-unfold"}} | ||||
| 				{{$.i18n.Tr "repo.issues.review.show_resolved"}} | ||||
| 			</button> | ||||
| 			<button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="hide ui tiny right labeled button hide-outdated"> | ||||
| 				{{svg "octicon-fold"}} | ||||
| 				{{$.i18n.Tr "repo.issues.review.hide_resolved"}} | ||||
| 			</button> | ||||
| 		<div class="ui attached header resolved-placeholder df ac sb"> | ||||
| 			<div class="ui grey text"> | ||||
| 				<b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}} | ||||
| 			</div> | ||||
| 			<div> | ||||
| 				<button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button show-outdated df ac"> | ||||
| 					{{svg "octicon-unfold" 16 "mr-3"}} | ||||
| 					{{$.i18n.Tr "repo.issues.review.show_resolved"}} | ||||
| 				</button> | ||||
| 				<button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="hide ui tiny right labeled button hide-outdated df ac"> | ||||
| 					{{svg "octicon-fold" 16 "mr-3"}} | ||||
| 					{{$.i18n.Tr "repo.issues.review.hide_resolved"}} | ||||
| 				</button> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	{{end}} | ||||
| 	<div id="code-comments-{{(index  .comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}"> | ||||
|   | ||||
| @@ -459,35 +459,39 @@ | ||||
| 				{{ range $filename, $lines := .Review.CodeComments}} | ||||
| 					{{range $line, $comms := $lines}} | ||||
| 							<div class="ui segments"> | ||||
| 								<div class="ui segment py-3"> | ||||
| 								<div class="ui segment py-3 df ac sb"> | ||||
| 									{{$invalid := (index $comms 0).Invalidated}} | ||||
| 									{{$resolved := (index $comms 0).IsResolved}} | ||||
| 									{{$resolveDoer := (index $comms 0).ResolveDoer}} | ||||
| 									{{$isNotPending := (not (eq (index $comms 0).Review.Type 0))}} | ||||
| 								{{if or $invalid $resolved}} | ||||
| 									<button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if not $resolved}}hide {{end}}ui compact right labeled button show-outdated"> | ||||
| 										{{svg "octicon-unfold"}} | ||||
| 										{{if $resolved}} | ||||
| 											{{$.i18n.Tr "repo.issues.review.show_resolved"}} | ||||
| 										{{else}} | ||||
| 											{{$.i18n.Tr "repo.issues.review.show_outdated"}} | ||||
| 									<div class="df ac"> | ||||
| 										<a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment ml-3">{{$filename}}</a> | ||||
| 										{{if $invalid }} | ||||
| 											<span class="ui label basic small ml-3"> | ||||
| 												{{$.i18n.Tr "repo.issues.review.outdated"}} | ||||
| 											</span> | ||||
| 										{{end}} | ||||
| 									</button> | ||||
| 									<button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if $resolved}}hide {{end}}ui compact right labeled button hide-outdated"> | ||||
| 										{{svg "octicon-fold"}} | ||||
| 										{{if $resolved}} | ||||
| 											{{$.i18n.Tr "repo.issues.review.hide_resolved"}} | ||||
| 										{{else}} | ||||
| 											{{$.i18n.Tr "repo.issues.review.hide_outdated"}} | ||||
| 									</div> | ||||
| 									<div> | ||||
| 										{{if or $invalid $resolved}} | ||||
| 											<button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if not $resolved}}hide {{end}}ui compact right labeled button show-outdated df ac"> | ||||
| 												{{svg "octicon-unfold" 16 "mr-3"}} | ||||
| 												{{if $resolved}} | ||||
| 													{{$.i18n.Tr "repo.issues.review.show_resolved"}} | ||||
| 												{{else}} | ||||
| 													{{$.i18n.Tr "repo.issues.review.show_outdated"}} | ||||
| 												{{end}} | ||||
| 											</button> | ||||
| 											<button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if $resolved}}hide {{end}}ui compact right labeled button hide-outdated df ac"> | ||||
| 												{{svg "octicon-fold" 16 "mr-3"}} | ||||
| 												{{if $resolved}} | ||||
| 													{{$.i18n.Tr "repo.issues.review.hide_resolved"}} | ||||
| 												{{else}} | ||||
| 													{{$.i18n.Tr "repo.issues.review.hide_outdated"}} | ||||
| 												{{end}} | ||||
| 											</button> | ||||
| 										{{end}} | ||||
| 									</button> | ||||
| 								{{end}} | ||||
| 								<a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment">{{$filename}}</a> | ||||
| 								{{if $invalid }} | ||||
| 									<span class="ui label basic small yellow"> | ||||
| 										{{$.i18n.Tr "repo.issues.review.outdated"}} | ||||
| 									</span> | ||||
| 								{{end}} | ||||
| 									</div> | ||||
| 								</div> | ||||
| 								{{$diff := (CommentMustAsDiff (index $comms 0))}} | ||||
| 								{{if $diff}} | ||||
|   | ||||
| @@ -1107,15 +1107,6 @@ | ||||
|  | ||||
|         .segments { | ||||
|           box-shadow: none; | ||||
|  | ||||
|           .show-outdated, | ||||
|           .hide-outdated { | ||||
|             display: block; | ||||
|           } | ||||
|  | ||||
|           .label { | ||||
|             margin-left: 6px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
| @@ -1635,9 +1626,6 @@ | ||||
|   } | ||||
|  | ||||
|   .diff-file-box { | ||||
|     margin-top: 1rem; | ||||
|     margin-bottom: 1rem; | ||||
|  | ||||
|     .header { | ||||
|       background-color: var(--color-box-header); | ||||
|     } | ||||
|   | ||||
| @@ -35,11 +35,15 @@ | ||||
|   &:not(.top) { | ||||
|     margin-bottom: .5em; | ||||
|   } | ||||
| } | ||||
|  | ||||
|   .show-outdated, | ||||
|   .hide-outdated { | ||||
|     display: block; | ||||
|     margin-left: auto; | ||||
| .show-outdated, | ||||
| .hide-outdated { | ||||
|   display: block !important; | ||||
|   user-select: none !important; | ||||
|  | ||||
|   &:hover { | ||||
|     text-decoration: underline; | ||||
|   } | ||||
| } | ||||
|  | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 silverwind
					silverwind