mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-31 21:28:11 +09:00 
			
		
		
		
	Replace unstyled meter with progress (#19968)
Replace the only `<meter>` element in use with a `<progress>` which is styled properly. Also slightly adjust colors on it for better contrast. Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
		| @@ -19,8 +19,8 @@ | ||||
| 			</div> | ||||
| 			<div class="diff-detail-actions df ac"> | ||||
| 				{{if and .PageIsPullFiles $.SignedUserID (not .IsArchived)}} | ||||
| 					<meter id="viewed-files-summary" value="{{.Diff.NumViewedFiles}}" max="{{.Diff.NumFiles}}"></meter> | ||||
| 					<label for="viewed-files-summary" id="viewed-files-summary-label" data-text-changed-template="{{.i18n.Tr "repo.pulls.viewed_files_label"}}"> | ||||
| 					<progress id="viewed-files-summary" class="mr-2" value="{{.Diff.NumViewedFiles}}" max="{{.Diff.NumFiles}}"></progress> | ||||
| 					<label for="viewed-files-summary" id="viewed-files-summary-label" class="mr-2" data-text-changed-template="{{.i18n.Tr "repo.pulls.viewed_files_label"}}"> | ||||
| 						{{.i18n.Tr "repo.pulls.viewed_files_label" .Diff.NumViewedFiles .Diff.NumFiles}} | ||||
| 					</label> | ||||
| 				{{end}} | ||||
|   | ||||
| @@ -9,8 +9,8 @@ const viewedCheckboxSelector = '.viewed-file-form'; // Selector under which all | ||||
| // Refreshes the summary of viewed files if present | ||||
| // The data used will be window.config.pageData.prReview.numberOf{Viewed}Files | ||||
| function refreshViewedFilesSummary() { | ||||
|   const viewedFilesMeter = document.getElementById('viewed-files-summary'); | ||||
|   viewedFilesMeter?.setAttribute('value', prReview.numberOfViewedFiles); | ||||
|   const viewedFilesProgress = document.getElementById('viewed-files-summary'); | ||||
|   viewedFilesProgress?.setAttribute('value', prReview.numberOfViewedFiles); | ||||
|   const summaryLabel = document.getElementById('viewed-files-summary-label'); | ||||
|   if (summaryLabel) summaryLabel.innerHTML = summaryLabel.getAttribute('data-text-changed-template') | ||||
|     .replace('%[1]d', prReview.numberOfViewedFiles) | ||||
|   | ||||
| @@ -211,19 +211,19 @@ details summary > * { | ||||
| } | ||||
|  | ||||
| progress { | ||||
|   background: var(--color-secondary); | ||||
|   background: var(--color-secondary-dark-1); | ||||
|   border-radius: 6px; | ||||
|   border: none; | ||||
|   overflow: hidden; | ||||
| } | ||||
| progress::-webkit-progress-bar { | ||||
|   background: var(--color-secondary); | ||||
|   background: var(--color-secondary-dark-1); | ||||
| } | ||||
| progress::-webkit-progress-value { | ||||
|   background-color: var(--color-secondary-dark-3); | ||||
|   background-color: var(--color-secondary-dark-4); | ||||
| } | ||||
| progress::-moz-progress-bar { | ||||
|   background: var(--color-secondary-dark-3); | ||||
|   background: var(--color-secondary-dark-4); | ||||
| } | ||||
|  | ||||
| * { | ||||
|   | ||||
| @@ -280,3 +280,8 @@ a.blob-excerpt:hover { | ||||
| .viewed-file-checked-form { | ||||
|   background-color: var(--color-primary-light-4); | ||||
| } | ||||
|  | ||||
| #viewed-files-summary { | ||||
|   width: 72px; | ||||
|   height: 10px; | ||||
| } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user