style: apply consistent code formatting and indentation to rules panel component

src/app/components/rules-panel/rules-panel.html

@@ -9,12 +9,20 @@
 
 	<div class="priority-statement">
 		<mat-icon color="primary">info</mat-icon>
-		<span>L'ordre des règles définit leur priorité d'exécution (de haut en bas). Glissez-déposez pour réorganiser.</span>
+		<span
+			>L'ordre des règles définit leur priorité d'exécution (de haut en bas). Glissez-déposez
+			pour réorganiser.</span
+		>
 	</div>
 
 	<div class="rules-list" cdkDropList (cdkDropListDropped)="drop($event)">
 		@for (rule of rules; track rule.id; let i = $index) {
-			<div class="rule-item" cdkDrag [cdkDragDisabled]="editingRuleId() === rule.id" [class.editing]="editingRuleId() === rule.id">
+			<div
+				class="rule-item"
+				cdkDrag
+				[cdkDragDisabled]="editingRuleId() === rule.id"
+				[class.editing]="editingRuleId() === rule.id"
+			>
 				@if (editingRuleId() !== rule.id) {
 					<div class="rule-drag-grip">
 						<mat-icon class="drag-handle-icon">drag_handle</mat-icon>
@@ -26,7 +34,10 @@
 								(change)="toggleRule(rule.id)"
 								color="primary"
 							>
-								<span class="rule-name"><span class="rule-number">{{ i + 1 }}.</span> {{ rule.name }}</span>
+								<span class="rule-name"
+									><span class="rule-number">{{ i + 1 }}.</span>
+									{{ rule.name }}</span
+								>
 							</mat-slide-toggle>
 							<div class="rule-actions">
 								<button mat-icon-button (click)="startEdit(rule, $event)">
@@ -64,9 +75,9 @@
 							} @else if (rule.type === RuleType.TIME_WINDOW) {
 								<span>
 									Placer <strong>{{ rule.placeDays }}</strong> jour(s)
-									<strong>{{ getDayTypeLabel(rule.placeType) }}</strong> entre
+									<strong>{{ getDayTypeLabel(rule.placeType) }}</strong> entre le
-									le <strong>{{ rule.startDate | date: 'dd/MM/yyyy' }}</strong> et
+									<strong>{{ rule.startDate | date: 'dd/MM/yyyy' }}</strong> et le
-									le <strong>{{ rule.endDate | date: 'dd/MM/yyyy' }}</strong
+									<strong>{{ rule.endDate | date: 'dd/MM/yyyy' }}</strong
 									>.
 								</span>
 							}

src/app/components/rules-panel/rules-panel.scss

@@ -31,10 +31,10 @@
 	border-radius: 8px;
 	transition: all 0.2s ease;
 	background: var(--mat-sys-surface-container);
-	
+
 	&:not(.editing) {
 		cursor: grab;
-		
+
 		&:active {
 			cursor: grabbing;
 		}
@@ -52,9 +52,10 @@
 .cdk-drag-preview {
 	box-sizing: border-box;
 	border-radius: 8px;
-	box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+	box-shadow:
-				0 8px 10px 1px rgba(0, 0, 0, 0.14),
+		0 5px 5px -3px rgba(0, 0, 0, 0.2),
-				0 3px 14px 2px rgba(0, 0, 0, 0.12);
+		0 8px 10px 1px rgba(0, 0, 0, 0.14),
+		0 3px 14px 2px rgba(0, 0, 0, 0.12);
 }
 
 .cdk-drag-placeholder {
@@ -146,7 +147,7 @@
 	font-size: 0.95rem;
 	line-height: 1.5;
 	padding-left: 48px; /* Align with toggle switch text */
-	
+
 	strong {
 		font-weight: 600;
 	}
@@ -205,7 +206,7 @@
 	flex-direction: column;
 	gap: 8px;
 	margin-top: 8px;
-	
+
 	&.hidden {
 		display: none;
 	}