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:


![image](https://user-images.githubusercontent.com/2114189/235862130-a9eb5d8f-7d01-457c-99f7-21d0abc3075e.png)


![image](https://user-images.githubusercontent.com/2114189/235862222-139709a7-95c2-4f89-a40f-100b2d76d9bb.png)

Co-authored-by: Giteabot <teabot@gitea.io>

templates/repo/issue/view_content/pull.tmpl

@@ -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">

templates/repo/issue/view_content/sidebar.tmpl

@@ -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>