Clean up polluted styles and remove dead CSS code (#24497)
Follow #24393 The funny history: * At the beginning, `.ui.message` was polluted by `text-align: center` * Then people do `<div class="ui ... message text left">` * But `.ui.left` is polluted by `float: left` * Then people do `#xxx .ui.message { width: 100% !important;}` The code just becomes more and more hacky. After removing the pollution, everything becomes clear and straight. And, this PR also does: 1. Remove the `package.css`, its styles could be provided by `top aligned` 2. Remove `#avatar-arrow`, dead code Screenshot:   Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
		
							parent
							
								
									e9b39250b2
								
							
						
					
					
						commit
						48e3e38ee0
					
				|  | @ -1,20 +1,20 @@ | |||
| {{if .Flash.ErrorMsg}} | ||||
| 	<div class="ui negative message flash-error"> | ||||
| 	<div class="ui negative message flash-message flash-error"> | ||||
| 		<p>{{.Flash.ErrorMsg | Str2html}}</p> | ||||
| 	</div> | ||||
| {{end}} | ||||
| {{if .Flash.SuccessMsg}} | ||||
| 	<div class="ui positive message flash-success"> | ||||
| 	<div class="ui positive message flash-message flash-success"> | ||||
| 		<p>{{.Flash.SuccessMsg | Str2html}}</p> | ||||
| 	</div> | ||||
| {{end}} | ||||
| {{if .Flash.InfoMsg}} | ||||
| 	<div class="ui info message flash-info"> | ||||
| 	<div class="ui info message flash-message flash-info"> | ||||
| 		<p>{{.Flash.InfoMsg | Str2html}}</p> | ||||
| 	</div> | ||||
| {{end}} | ||||
| {{if .Flash.WarningMsg}} | ||||
| 	<div class="ui warning message flash-warning"> | ||||
| 	<div class="ui warning message flash-message flash-warning"> | ||||
| 		<p>{{.Flash.WarningMsg | Str2html}}</p> | ||||
| 	</div> | ||||
| {{end}} | ||||
|  |  | |||
|  | @ -69,7 +69,7 @@ | |||
| 	{{if .PackageDescriptor.Metadata.Labels}} | ||||
| 		<h4 class="ui top attached header">{{.locale.Tr "packages.container.labels"}}</h4> | ||||
| 		<div class="ui attached segment"> | ||||
| 			<table class="ui very basic compact table container-labels"> | ||||
| 			<table class="ui very basic compact table"> | ||||
| 				<thead> | ||||
| 					<tr> | ||||
| 						<th>{{.locale.Tr "packages.container.labels.key"}}</th> | ||||
|  | @ -79,8 +79,8 @@ | |||
| 				<tbody> | ||||
| 					{{range $key, $value := .PackageDescriptor.Metadata.Labels}} | ||||
| 						<tr> | ||||
| 							<td>{{$key}}</td> | ||||
| 							<td>{{$value}}</td> | ||||
| 							<td class="top aligned">{{$key}}</td> | ||||
| 							<td class="gt-word-break">{{$value}}</td> | ||||
| 						</tr> | ||||
| 					{{end}} | ||||
| 				</tbody> | ||||
|  |  | |||
|  | @ -51,7 +51,7 @@ | |||
| 						{{.locale.Tr "packages.settings.delete"}} | ||||
| 					</div> | ||||
| 					<div class="content"> | ||||
| 						<div class="ui warning message text left gt-word-break"> | ||||
| 						<div class="ui warning message gt-word-break"> | ||||
| 							{{.locale.Tr "packages.settings.delete.notice" .PackageDescriptor.Package.Name .PackageDescriptor.Version.Version}} | ||||
| 						</div> | ||||
| 						<form class="ui form" action="{{.Link}}" method="post"> | ||||
|  |  | |||
|  | @ -47,7 +47,7 @@ | |||
| 										{{$.locale.Tr "repo.issues.dismiss_review"}} | ||||
| 									</div> | ||||
| 									<div class="content"> | ||||
| 										<div class="ui warning message text left"> | ||||
| 										<div class="ui warning message"> | ||||
| 											{{$.locale.Tr "repo.issues.dismiss_review_warning"}} | ||||
| 										</div> | ||||
| 										<form class="ui form dismiss-review-form" id="dismiss-review-{{.Review.ID}}" action="{{$.RepoLink}}/issues/dismiss_review" method="post"> | ||||
|  |  | |||
|  | @ -560,7 +560,7 @@ | |||
| 					{{end}} | ||||
| 				</div> | ||||
| 				<div class="content"> | ||||
| 					<div class="ui warning message text left"> | ||||
| 					<div class="ui warning message"> | ||||
| 						{{if .Issue.IsLocked}} | ||||
| 							{{.locale.Tr "repo.issues.unlock.notice_1"}}<br> | ||||
| 							{{.locale.Tr "repo.issues.unlock.notice_2"}}<br> | ||||
|  |  | |||
|  | @ -50,7 +50,7 @@ | |||
| 		{{.locale.Tr "repo.settings.delete"}} | ||||
| 	</div> | ||||
| 	<div class="content"> | ||||
| 		<div class="ui warning message text left"> | ||||
| 		<div class="ui warning message"> | ||||
| 			{{.locale.Tr "repo.settings.delete_notices_1" | Safe}}<br> | ||||
| 			{{.locale.Tr "repo.settings.delete_notices_2" .Repository.FullName | Safe}} | ||||
| 			{{if .Repository.NumForks}}<br> | ||||
|  |  | |||
|  | @ -803,7 +803,7 @@ | |||
| 				{{.locale.Tr "repo.settings.convert"}} | ||||
| 			</div> | ||||
| 			<div class="content"> | ||||
| 				<div class="ui warning message text left"> | ||||
| 				<div class="ui warning message"> | ||||
| 					{{.locale.Tr "repo.settings.convert_notices_1"}} | ||||
| 				</div> | ||||
| 				<form class="ui form" action="{{.Link}}" method="post"> | ||||
|  | @ -834,7 +834,7 @@ | |||
| 				{{.locale.Tr "repo.settings.convert_fork"}} | ||||
| 			</div> | ||||
| 			<div class="content"> | ||||
| 				<div class="ui warning message text left"> | ||||
| 				<div class="ui warning message"> | ||||
| 					{{.locale.Tr "repo.settings.convert_fork_notices_1"}} | ||||
| 				</div> | ||||
| 				<form class="ui form" action="{{.Link}}" method="post"> | ||||
|  | @ -864,7 +864,7 @@ | |||
| 			{{.locale.Tr "repo.settings.transfer"}} | ||||
| 		</div> | ||||
| 		<div class="content"> | ||||
| 			<div class="ui warning message text left"> | ||||
| 			<div class="ui warning message"> | ||||
| 				{{.locale.Tr "repo.settings.transfer_notices_1"}} <br> | ||||
| 				{{.locale.Tr "repo.settings.transfer_notices_2"}} <br> | ||||
| 				{{.locale.Tr "repo.settings.transfer_notices_3"}} | ||||
|  | @ -900,7 +900,7 @@ | |||
| 			{{.locale.Tr "repo.settings.delete"}} | ||||
| 		</div> | ||||
| 		<div class="content"> | ||||
| 			<div class="ui warning message text left"> | ||||
| 			<div class="ui warning message"> | ||||
| 				{{.locale.Tr "repo.settings.delete_notices_1" | Safe}}<br> | ||||
| 				{{.locale.Tr "repo.settings.delete_notices_2" .Repository.FullName | Safe}} | ||||
| 				{{if .Repository.NumForks}}<br> | ||||
|  | @ -935,7 +935,7 @@ | |||
| 			{{.locale.Tr "repo.settings.wiki_delete"}} | ||||
| 		</div> | ||||
| 		<div class="content"> | ||||
| 			<div class="ui warning message text left"> | ||||
| 			<div class="ui warning message"> | ||||
| 				{{.locale.Tr "repo.settings.delete_notices_1" | Safe}}<br> | ||||
| 				{{.locale.Tr "repo.settings.wiki_delete_notices_1" .Repository.Name | Safe}} | ||||
| 			</div> | ||||
|  |  | |||
|  | @ -1556,7 +1556,7 @@ img.ui.avatar, | |||
|   vertical-align: middle; | ||||
| } | ||||
| 
 | ||||
| .ui .message { | ||||
| .ui .message.flash-message { | ||||
|   text-align: center; | ||||
| } | ||||
| 
 | ||||
|  |  | |||
|  | @ -41,6 +41,5 @@ | |||
| @import "./admin.css"; | ||||
| @import "./explore.css"; | ||||
| @import "./review.css"; | ||||
| @import "./package.css"; | ||||
| @import "./runner.css"; | ||||
| @import "./helpers.css"; | ||||
|  |  | |||
|  | @ -1,7 +0,0 @@ | |||
| .container-labels td:nth-child(1) { | ||||
|   vertical-align: top; | ||||
| } | ||||
| 
 | ||||
| .container-labels td:nth-child(2) { | ||||
|   overflow-wrap: anywhere; | ||||
| } | ||||
|  | @ -2600,39 +2600,6 @@ | |||
|   height: 15px; | ||||
| } | ||||
| 
 | ||||
| #avatar-arrow::before, | ||||
| #avatar-arrow::after { | ||||
|   right: 100%; | ||||
|   top: 20px; | ||||
|   border: solid transparent; | ||||
|   content: " "; | ||||
|   height: 0; | ||||
|   width: 0; | ||||
|   position: absolute; | ||||
|   pointer-events: none; | ||||
| } | ||||
| 
 | ||||
| #avatar-arrow::before { | ||||
|   border-right-color: var(--color-secondary); | ||||
|   border-width: 9px; | ||||
|   margin-top: -9px; | ||||
| } | ||||
| 
 | ||||
| #avatar-arrow::after { | ||||
|   border-right-color: var(--color-box-header); | ||||
|   border-width: 8px; | ||||
|   margin-top: -8px; | ||||
| } | ||||
| 
 | ||||
| #transfer-repo-modal .ui.message, | ||||
| #delete-repo-modal .ui.message, | ||||
| #delete-wiki-modal .ui.message, | ||||
| #convert-fork-repo-modal .ui.message, | ||||
| #convert-mirror-repo-modal .ui.message, | ||||
| #fork-repo-modal .ui.message { | ||||
|   width: 100% !important; | ||||
| } | ||||
| 
 | ||||
| .tab-size-1 { | ||||
|   tab-size: 1 !important; | ||||
|   -moz-tab-size: 1 !important; | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue