fix: rename custom flex classes to app prefix for consistency

pavankjadda · pavankjadda · commit 9a13ecc03859 · 2025-06-11T23:43:28.000-04:00
diff --git a/projects/ng-kit-demo/src/app/progress-state-demo/progress-state-demo.component.html b/projects/ng-kit-demo/src/app/progress-state-demo/progress-state-demo.component.html
@@ -1,4 +1,4 @@
-<div class="custom-flex-justify-center">
+<div class="app-flex-justify-center">
 	<save-primary-button
 		(click)="setLoading()"
 		(keydown)="setLoading()"
diff --git a/projects/ng-kit-demo/src/styles.scss b/projects/ng-kit-demo/src/styles.scss
@@ -21,37 +21,37 @@ body {
 }
 
 // Places item in the middle of the box
-.custom-flex-center {
+.app-flex-center {
 	display: flex;
 	align-items: center;
 }
 
 // Places item in the center of the box
-.custom-flex-justify-center {
+.app-flex-justify-center {
 	display: flex;
 	justify-content: center;
 }
 
 // Places item in the left of the box
-.custom-flex-justify-left {
+.app-flex-justify-left {
 	display: flex;
 	justify-content: flex-start;
 }
 
 // Places item in the right of the box
-.custom-flex-justify-right {
+.app-flex-justify-right {
 	display: flex;
 	justify-content: flex-end;
 }
 
 // Places items at the start of the item
-.custom-flex-align-items-start {
+.app-flex-align-items-start {
 	display: flex;
 	align-items: flex-start;
 }
 
 // Places items at the start of the item
-.custom-flex-align-items-center {
+.app-flex-align-items-center {
 	display: flex;
 	align-items: center;
 }
diff --git a/projects/ng-kit/src/assets/general.scss b/projects/ng-kit/src/assets/general.scss
@@ -30,37 +30,37 @@ a:hover {
 }
 
 // Places item in the middle of the box
-.custom-flex-center {
+.app-flex-center {
 	display: flex;
 	align-items: center;
 }
 
 // Places item in the center of the box
-.custom-flex-justify-center {
+.app-flex-justify-center {
 	display: flex;
 	justify-content: center;
 }
 
 // Places item in the left of the box
-.custom-flex-justify-left {
+.app-flex-justify-left {
 	display: flex;
 	justify-content: flex-start;
 }
 
 // Places item in the right of the box
-.custom-flex-justify-right {
+.app-flex-justify-right {
 	display: flex;
 	justify-content: flex-end;
 }
 
 // Places items at the start of the item
-.custom-flex-align-items-start {
+.app-flex-align-items-start {
 	display: flex;
 	align-items: flex-start;
 }
 
 // Places items at the start of the item
-.custom-flex-align-items-center {
+.app-flex-align-items-center {
 	display: flex;
 	align-items: center;
 }
diff --git a/projects/ng-kit/src/lib/components/snack-bar/error-snack-bar/error-snack-bar.component.ts b/projects/ng-kit/src/lib/components/snack-bar/error-snack-bar/error-snack-bar.component.ts
@@ -8,7 +8,7 @@ import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar'
 	selector: 'app-error-snack-bar',
 	imports: [MatIconModule, MatButtonModule],
 	template: `
-		<div class="custom-flex-center error-snackbar">
+		<div class="app-flex-center error-snackbar">
 			<mat-icon style="font-size:1.3rem">error</mat-icon>
 			<label>{{ data.message }}</label>
 			<button style="margin-left: auto" (click)="close()" mat-icon-button>
diff --git a/projects/ng-kit/src/lib/components/snack-bar/success-snack-bar/success-snack-bar.component.ts b/projects/ng-kit/src/lib/components/snack-bar/success-snack-bar/success-snack-bar.component.ts
@@ -7,7 +7,7 @@ import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar'
 	selector: 'app-success-snack-bar',
 	imports: [MatButtonModule, MatIconModule],
 	template: `
-		<div class="custom-flex-center success-snackbar">
+		<div class="app-flex-center success-snackbar">
 			<mat-icon style="font-size:1.3rem">check_circle</mat-icon>
 			<label>{{ data.message }}</label>
 			<button style="margin-left: auto" (click)="close()" mat-icon-button>

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-<div class="custom-flex-justify-center">`
	`1`	`+<div class="app-flex-justify-center">`
`2`	`2`	`<save-primary-button`
`3`	`3`	`(click)="setLoading()"`
`4`	`4`	`(keydown)="setLoading()"`
Original file line number	Diff line number	Diff line change
`@@ -21,37 +21,37 @@ body {`
`21`	`21`	`}`
`22`	`22`
`23`	`23`	`// Places item in the middle of the box`
`24`		`-.custom-flex-center {`
	`24`	`+.app-flex-center {`
`25`	`25`	`display: flex;`
`26`	`26`	`align-items: center;`
`27`	`27`	`}`
`28`	`28`
`29`	`29`	`// Places item in the center of the box`
`30`		`-.custom-flex-justify-center {`
	`30`	`+.app-flex-justify-center {`
`31`	`31`	`display: flex;`
`32`	`32`	`justify-content: center;`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`// Places item in the left of the box`
`36`		`-.custom-flex-justify-left {`
	`36`	`+.app-flex-justify-left {`
`37`	`37`	`display: flex;`
`38`	`38`	`justify-content: flex-start;`
`39`	`39`	`}`
`40`	`40`
`41`	`41`	`// Places item in the right of the box`
`42`		`-.custom-flex-justify-right {`
	`42`	`+.app-flex-justify-right {`
`43`	`43`	`display: flex;`
`44`	`44`	`justify-content: flex-end;`
`45`	`45`	`}`
`46`	`46`
`47`	`47`	`// Places items at the start of the item`
`48`		`-.custom-flex-align-items-start {`
	`48`	`+.app-flex-align-items-start {`
`49`	`49`	`display: flex;`
`50`	`50`	`align-items: flex-start;`
`51`	`51`	`}`
`52`	`52`
`53`	`53`	`// Places items at the start of the item`
`54`		`-.custom-flex-align-items-center {`
	`54`	`+.app-flex-align-items-center {`
`55`	`55`	`display: flex;`
`56`	`56`	`align-items: center;`
`57`	`57`	`}`
Original file line number	Diff line number	Diff line change
`@@ -30,37 +30,37 @@ a:hover {`
`30`	`30`	`}`
`31`	`31`
`32`	`32`	`// Places item in the middle of the box`
`33`		`-.custom-flex-center {`
	`33`	`+.app-flex-center {`
`34`	`34`	`display: flex;`
`35`	`35`	`align-items: center;`
`36`	`36`	`}`
`37`	`37`
`38`	`38`	`// Places item in the center of the box`
`39`		`-.custom-flex-justify-center {`
	`39`	`+.app-flex-justify-center {`
`40`	`40`	`display: flex;`
`41`	`41`	`justify-content: center;`
`42`	`42`	`}`
`43`	`43`
`44`	`44`	`// Places item in the left of the box`
`45`		`-.custom-flex-justify-left {`
	`45`	`+.app-flex-justify-left {`
`46`	`46`	`display: flex;`
`47`	`47`	`justify-content: flex-start;`
`48`	`48`	`}`
`49`	`49`
`50`	`50`	`// Places item in the right of the box`
`51`		`-.custom-flex-justify-right {`
	`51`	`+.app-flex-justify-right {`
`52`	`52`	`display: flex;`
`53`	`53`	`justify-content: flex-end;`
`54`	`54`	`}`
`55`	`55`
`56`	`56`	`// Places items at the start of the item`
`57`		`-.custom-flex-align-items-start {`
	`57`	`+.app-flex-align-items-start {`
`58`	`58`	`display: flex;`
`59`	`59`	`align-items: flex-start;`
`60`	`60`	`}`
`61`	`61`
`62`	`62`	`// Places items at the start of the item`
`63`		`-.custom-flex-align-items-center {`
	`63`	`+.app-flex-align-items-center {`
`64`	`64`	`display: flex;`
`65`	`65`	`align-items: center;`
`66`	`66`	`}`