mirror of
				https://github.com/go-gitea/gitea
				synced 2025-10-31 11:28:24 +00:00 
			
		
		
		
	Fix Citation modal responsiveness and clipboard copy (#29799)
The modal was broken in two ways: - On small screens, the input box was partially hanging outside the modal. Fixed with flexbox and increased modal width. - The clipboard copy was not working because the modal had both `data-clipboard-text` and `data-clipboard-target`, while we only support one of those. Made a small tweak in clipboard as well so that it will still fall back to target if text is empty.
This commit is contained in:
		| @@ -6,6 +6,6 @@ BibTeX | ||||
| </button> | ||||
| <!-- the value will be updated by initCitationFileCopyContent, the code below is used to avoid UI flicking  --> | ||||
| <input id="citation-copy-content" value="" size="1" readonly> | ||||
| <button class="ui icon button" id="citation-clipboard-btn" data-tooltip-content="{{ctx.Locale.Tr "copy"}}" data-clipboard-text="" data-clipboard-target="#citation-copy-content"> | ||||
| <button class="ui icon button" id="citation-clipboard-btn" data-tooltip-content="{{ctx.Locale.Tr "copy"}}" data-clipboard-target="#citation-copy-content"> | ||||
| 	{{svg "octicon-copy"}} | ||||
| </button> | ||||
|   | ||||
| @@ -1,16 +1,14 @@ | ||||
| <div class="ui tiny modal" id="cite-repo-modal"> | ||||
| <div class="ui small modal" id="cite-repo-modal"> | ||||
| 	<div class="header"> | ||||
| 		{{ctx.Locale.Tr "repo.cite_this_repo"}} | ||||
| 	</div> | ||||
| 	<div class="content"> | ||||
| 		<div class="ui stackable secondary menu"> | ||||
| 			<div class="fitted item"> | ||||
| 				<div class="ui action input" id="citation-panel"> | ||||
| 					{{template "repo/cite/cite_buttons" .}} | ||||
| 					<a id="goto-citation-btn" class="ui basic jump icon button" href="{{$.RepoLink}}/src/{{$.BranchName}}/CITATION.cff" data-tooltip-content="{{ctx.Locale.Tr "repo.find_file.go_to_file"}}"> | ||||
| 						{{svg "octicon-file-moved"}} | ||||
| 					</a> | ||||
| 				</div> | ||||
| 			<div class="ui action input" id="citation-panel"> | ||||
| 				{{template "repo/cite/cite_buttons" .}} | ||||
| 				<a id="goto-citation-btn" class="ui basic jump icon button" href="{{$.RepoLink}}/src/{{$.BranchName}}/CITATION.cff" data-tooltip-content="{{ctx.Locale.Tr "repo.find_file.go_to_file"}}"> | ||||
| 					{{svg "octicon-file-moved"}} | ||||
| 				</a> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
|   | ||||
| @@ -2035,13 +2035,8 @@ | ||||
| } | ||||
|  | ||||
| #cite-repo-modal #citation-panel { | ||||
|   width: 500px; | ||||
| } | ||||
|  | ||||
| @media (max-width: 767.98px) { | ||||
|   #cite-repo-modal #citation-panel { | ||||
|     width: 100%; | ||||
|   } | ||||
|   display: flex; | ||||
|   width: 100%; | ||||
| } | ||||
|  | ||||
| #cite-repo-modal #citation-panel input { | ||||
| @@ -2061,6 +2056,7 @@ | ||||
|   padding: 5px 10px; | ||||
|   font-size: 1.2em; | ||||
|   line-height: 1.4; | ||||
|   flex: 1; | ||||
| } | ||||
|  | ||||
| #cite-repo-modal #citation-panel #citation-copy-apa, | ||||
|   | ||||
| @@ -15,10 +15,8 @@ export function initGlobalCopyToClipboardListener() { | ||||
|  | ||||
|     e.preventDefault(); | ||||
|  | ||||
|     let text; | ||||
|     if (target.hasAttribute('data-clipboard-text')) { | ||||
|       text = target.getAttribute('data-clipboard-text'); | ||||
|     } else { | ||||
|     let text = target.getAttribute('data-clipboard-text'); | ||||
|     if (!text) { | ||||
|       text = document.querySelector(target.getAttribute('data-clipboard-target'))?.value; | ||||
|     } | ||||
|  | ||||
|   | ||||
		Reference in New Issue
	
	Block a user