Merge pull request 'OZG-4706 OZG-4758 Rearrange Az/Nr' (#384) from...

Merge pull request 'OZG-4706 OZG-4758 Rearrange Az/Nr' (#384) from OZG-4706-Anordnung-Vorgangname into master

Reviewed-on: https://git.ozg-sh.de/ozgcloud-app/alfa/pulls/384

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-detail-header/vorgang-detail-header.component.html

@@ -30,13 +30,13 @@
 
 <div class="initial-date" data-test-id="created-at">{{ vorgangWithEingang.createdAt | date : 'EEEE, d. LLLL y, H:mm'}}</div>
 
+<alfa-vorgang-nummer class="vorgang-nummer big" [vorgang]="vorgangWithEingang"></alfa-vorgang-nummer>
+
 <div class="aktenzeichen">
 	<mat-icon svgIcon="az"></mat-icon>
 	<alfa-aktenzeichen-editable class="aktenzeichen-editable" [vorgang]="vorgangWithEingang"></alfa-aktenzeichen-editable>
 </div>
 
-<alfa-vorgang-nummer class="vorgang-nummer big" [vorgang]="vorgangWithEingang"></alfa-vorgang-nummer>
-
 <h2 data-test-id="name" class="name">{{ vorgangWithEingang.name }}</h2>
 
 <alfa-user-profile-in-vorgang-container *ngIf="vorgangWithEingang | hasLink: linkRel.ASSIGN" data-test-id="vorgang-header-user-icon"

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-detail-header/vorgang-detail-header.component.scss

@@ -33,16 +33,16 @@
 	grid-template-columns: 8% 80% 12%;
 	grid-template-areas:
 		"status-dot status-text initial-date"
-		". aktenzeichen aktenzeichen"
 		". vorgang-nummer vorgang-nummer"
+		". aktenzeichen aktenzeichen"
 		". name user";
 
 	@include media('>desktop') {
 		grid-template-columns: 5% 20% 52% 23%;
 		grid-template-areas:
 			"status-dot status-text name initial-date"
-			". aktenzeichen aktenzeichen aktenzeichen"
-			". vorgang-nummer vorgang-nummer user";
+			". vorgang-nummer vorgang-nummer vorgang-nummer"
+			". aktenzeichen aktenzeichen user";
 
 		.name {
 			margin-right: 5rem;
@@ -59,7 +59,7 @@
 		grid-template-columns: 4% 13% 34% 34% 15%;
 		grid-template-areas:
 			"status-dot status-text name name initial-date"
-			". aktenzeichen aktenzeichen vorgang-nummer user";
+			". vorgang-nummer vorgang-nummer aktenzeichen user";
 
 		.aktenzeichen, .vorgang-nummer, .user {
 			align-self: center;
@@ -124,6 +124,7 @@ mat-icon {
 
 .vorgang-nummer {
 	grid-area: vorgang-nummer;
+	margin-left: -2px;
 }
 
 .name {

alfa-client/libs/vorgang-shared-ui/src/lib/vorgang-search-container/vorgang-search/vorgang-search-autocomplete-options-content/vorgang-search-autocomplete-options-content.component.html

@@ -30,12 +30,12 @@
 		<span data-test-id="preview-list-item-created-at">{{ vorgang.createdAt | formatToPrettyDate }}</span>
 	</div>
 </div>
+<div class="line full-width">
+	<alfa-vorgang-nummer [vorgang]="vorgang"></alfa-vorgang-nummer>
+</div>
 <div class="line full-width">
 	<div class="aktenzeichen" data-test-id="preview-list-item-vorgang-aktenzeichen">
 		<mat-icon svgIcon="az"></mat-icon>
 		<span alfa-aktenzeichen [vorgang]="vorgang"></span>
 	</div>
 </div>
\ No newline at end of file
-<div class="line full-width">
-	<alfa-vorgang-nummer [vorgang]="vorgang"></alfa-vorgang-nummer>
-</div>
\ No newline at end of file

alfa-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html

@@ -41,11 +41,6 @@
 		class="postfach-icon">
 	</ozgcloud-postfach-icon>
 
-	<div class="aktenzeichen">
-		<mat-icon svgIcon="az"></mat-icon>
-		<span class="ellipsis" alfa-aktenzeichen [vorgang]="vorgang"></span>
-	</div>
-
 	<alfa-vorgang-created-at class="eingang" [vorgang]="vorgang"></alfa-vorgang-created-at>
 
 	<div class="name">
@@ -54,6 +49,11 @@
 
 	<alfa-vorgang-nummer class="vorgang-nummer" [vorgang]="vorgang"></alfa-vorgang-nummer>
 
+	<div class="aktenzeichen">
+		<mat-icon svgIcon="az"></mat-icon>
+		<span class="ellipsis" alfa-aktenzeichen [vorgang]="vorgang"></span>
+	</div>
+
 	<alfa-vorgang-next-frist-button *ngIf="vorgang | hasLink: vorgangLinkRel.WIEDERVORLAGEN" [vorgang]="vorgang"
 		class="wiedervorlagen"></alfa-vorgang-next-frist-button>
 

alfa-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.scss

@@ -31,7 +31,7 @@
 	grid-template-areas:
 		"status postfach-icon wiedervorlagen eingang"
 		"name name name name"
-		"aktenzeichen aktenzeichen vorgang-nummer user-icon";
+		"vorgang-nummer vorgang-nummer aktenzeichen user-icon";
 	row-gap: 8px;
 	align-items: center;
 	padding: 16px 24px;
@@ -78,8 +78,8 @@
 	@include media('>desktop') {
 		grid-template-columns: 23% 25% 30% 12% 10%;
 		grid-template-areas:
-			"status postfach-icon aktenzeichen eingang user-icon"
-			"name name vorgang-nummer wiedervorlagen user-icon";
+			"status postfach-icon vorgang-nummer eingang user-icon"
+			"name name aktenzeichen wiedervorlagen user-icon";
 		padding: 16px 24px;
 
 		.eingang {
@@ -90,7 +90,7 @@
 	@include media('>xxlDesktop') {
 		grid-template-columns: 15% 8% 16% 16% 20% 10% 12% 3%;
 		grid-template-areas:
-			"status postfach-icon aktenzeichen vorgang-nummer name wiedervorlagen eingang user-icon";
+			"status postfach-icon name vorgang-nummer aktenzeichen wiedervorlagen eingang user-icon";
 
 		.name {
 			margin-right: 24px;