mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-31 00:02:59 -04:00 
			
		
		
		
	Fix PR/Issue titles on mobile (#13292)
* Start fixing Issue & PR title on mobile Signed-off-by: kolaente <k@knt.li> * Make sure the save & cancel buttons float right Signed-off-by: kolaente <k@knt.li> * Fix edit buttons and title input on mobile Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
		
							parent
							
								
									4099e4f1b6
								
							
						
					
					
						commit
						f24392391e
					
				| @ -1,19 +1,21 @@ | ||||
| <div class="sixteen wide column title"> | ||||
| 	<div class="ui grid"> | ||||
| 		<h1 class="twelve wide column"> | ||||
| 	<div class="issue-title" id="issue-title-wrapper"> | ||||
| 		{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} | ||||
|   		<div class="edit-button"> | ||||
|   			<div id="edit-title" class="ui basic green not-in-edit button">{{.i18n.Tr "repo.issues.edit"}}</div> | ||||
|   		</div> | ||||
| 		{{end}} | ||||
| 		<h1> | ||||
| 			<span class="index">#{{.Issue.Index}}</span> <span id="issue-title">{{RenderEmoji .Issue.Title}}</span> | ||||
| 			<div id="edit-title-input" class="ui input" style="display: none"> | ||||
| 				<input value="{{.Issue.Title}}" maxlength="255"> | ||||
| 			</div> | ||||
| 		</h1> | ||||
| 		{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} | ||||
| 			<div class="four wide column"> | ||||
| 				<div class="edit-zone text right"> | ||||
| 					<div id="edit-title" class="ui basic green not-in-edit button">{{.i18n.Tr "repo.issues.edit"}}</div> | ||||
| 					<div id="cancel-edit-title" class="ui basic blue in-edit button" style="display: none">{{.i18n.Tr "repo.issues.cancel"}}</div> | ||||
| 					<div id="save-edit-title" class="ui green in-edit button" style="display: none" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{.i18n.Tr "repo.issues.save"}}</div> | ||||
| 				</div> | ||||
| 			</div> | ||||
|   		<div class="edit-buttons"> | ||||
| 				<div id="cancel-edit-title" class="ui basic blue in-edit button" style="display: none">{{.i18n.Tr "repo.issues.cancel"}}</div> | ||||
| 				<div id="save-edit-title" class="ui green in-edit button" style="display: none" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{.i18n.Tr "repo.issues.save"}}</div> | ||||
|   		</div> | ||||
| 		{{end}} | ||||
| 	</div> | ||||
| 	{{if .HasMerged}} | ||||
|  | ||||
| @ -792,6 +792,7 @@ async function initRepository() { | ||||
|       $('#pull-desc').toggle(); | ||||
|       $('#pull-desc-edit').toggle(); | ||||
|       $('.in-edit').toggle(); | ||||
|       $('#issue-title-wrapper').toggleClass('edit-active'); | ||||
|       $editInput.focus(); | ||||
|       return false; | ||||
|     }; | ||||
|  | ||||
| @ -632,36 +632,86 @@ | ||||
|     .title { | ||||
|       padding-bottom: 0 !important; | ||||
| 
 | ||||
|       h1 { | ||||
|         font-weight: 300; | ||||
|         font-size: 2.3rem; | ||||
|         margin-bottom: 5px; | ||||
|       .issue-title { | ||||
|         margin-bottom: .5rem; | ||||
| 
 | ||||
|         .ui.input { | ||||
|           font-size: .5em; | ||||
|           vertical-align: top; | ||||
|           width: 50%; | ||||
|           min-width: 600px; | ||||
|         &.edit-active { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
| 
 | ||||
|           input { | ||||
|             font-size: 1.5em; | ||||
|             padding: 6px 10px; | ||||
|           h1 { | ||||
|             display: flex; | ||||
|             width: 100%; | ||||
|           } | ||||
| 
 | ||||
|           @media only screen and (max-width: 768px) { | ||||
|             flex-direction: column; | ||||
| 
 | ||||
|             h1 { | ||||
|               margin-right: 0; | ||||
|               margin-bottom: 1rem; | ||||
|               padding-right: 0; | ||||
| 
 | ||||
|               .ui.input input { | ||||
|                 width: calc(100% - 2rem); | ||||
|               } | ||||
|             } | ||||
| 
 | ||||
|             .edit-buttons { | ||||
|               padding-bottom: 1rem; | ||||
|               width: 100%; | ||||
| 
 | ||||
|               .button { | ||||
|                 width: 100%; | ||||
|                 margin-right: .5rem; | ||||
| 
 | ||||
|                 &:last-child { | ||||
|                   margin-right: 0; | ||||
|                 } | ||||
|               } | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       .index { | ||||
|         font-weight: 300; | ||||
|         color: #aaaaaa; | ||||
|         letter-spacing: -1px; | ||||
|       } | ||||
|         h1 { | ||||
|           font-weight: 300; | ||||
|           font-size: 2.3rem; | ||||
|           margin: 0; | ||||
|           padding-right: .5rem; | ||||
| 
 | ||||
|       .label { | ||||
|         margin-right: 10px; | ||||
|       } | ||||
|           .ui.input { | ||||
|             font-size: .5em; | ||||
|             width: 100%; | ||||
| 
 | ||||
|       .edit-zone { | ||||
|         margin-top: 10px; | ||||
|             input { | ||||
|               font-size: 1.5em; | ||||
|               padding: 6px 1rem; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
| 
 | ||||
|         .edit-button { | ||||
|           float: right; | ||||
|           padding-left: 1rem; | ||||
|         } | ||||
| 
 | ||||
|         .edit-buttons { | ||||
|           display: flex; | ||||
|         } | ||||
| 
 | ||||
|         .index { | ||||
|           font-weight: 300; | ||||
|           color: #aaaaaa; | ||||
|           letter-spacing: -1px; | ||||
|         } | ||||
| 
 | ||||
|         .label { | ||||
|           margin-right: 10px; | ||||
|         } | ||||
| 
 | ||||
|         .edit-zone { | ||||
|           margin-top: 10px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user