Use flex classes in package settings (#26314)

Regression of #25790
Fixes #26310

---------

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

templates/org/team/members.tmpl

@@ -53,18 +53,24 @@
 				</div>
 				{{if and .Invites $.IsOrganizationOwner}}
 				<h4 class="ui top attached header">{{$.locale.Tr "org.teams.invite_team_member.list"}}</h4>
-				<div class="ui bottom attached table segment members">
+				<div class="ui attached segment">
+					<div class="flex-list">
 						{{range .Invites}}
-						<div class="item gt-df gt-ac gt-fw">
-							<span class="gt-f1">{{.Email}}</span>
+							<div class="flex-item flex-item-center">
+								<div class="flex-item-main">
+									{{.Email}}
+								</div>
+								<div class="flex-item-trailing">
 									<form action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/remove_invite" method="post">
 										{{$.CsrfTokenHtml}}
 										<input type="hidden" name="iid" value="{{.ID}}">
 										<button class="ui red button">{{$.locale.Tr "org.members.remove"}}</button>
 									</form>
 								</div>
+							</div>
 						{{end}}
 					</div>
+				</div>
 				{{end}}
 			</div>
 		</div>

templates/package/settings.tmpl

@@ -38,14 +38,15 @@
 		<h4 class="ui top attached error header">
 			{{.locale.Tr "repo.settings.danger_zone"}}
 		</h4>
-		<div class="ui attached error table danger segment">
-			<div class="item">
-				<div class="ui right">
-					<button class="ui basic red show-modal button" data-modal="#delete-package-modal">{{.locale.Tr "packages.settings.delete"}}</button>
+		<div class="ui attached error danger segment">
+			<div class="flex-list">
+				<div class="flex-item">
+					<div class="flex-item-main">
+						<div class="flex-item-title">{{.locale.Tr "packages.settings.delete"}}</div>
+						<div class="flex-item-body">{{.locale.Tr "packages.settings.delete.description"}}</div>
 					</div>
-				<div>
-					<h5>{{.locale.Tr "packages.settings.delete"}}</h5>
-					<p>{{.locale.Tr "packages.settings.delete.description"}}</p>
+					<div class="flex-item-trailing">
+						<button class="ui basic red show-modal button" data-modal="#delete-package-modal">{{.locale.Tr "packages.settings.delete"}}</button>
 					</div>
 					<div class="ui tiny modal" id="delete-package-modal">
 						<div class="header">
@@ -66,4 +67,5 @@
 			</div>
 		</div>
 	</div>
+</div>
 {{template "base/footer" .}}