diff --git a/src/app/components/contacts/contact-edit/contact-edit.component.ts b/src/app/components/contacts/contact-edit/contact-edit.component.ts
index 9e7e2eb..429f309 100644
--- a/src/app/components/contacts/contact-edit/contact-edit.component.ts
+++ b/src/app/components/contacts/contact-edit/contact-edit.component.ts
@@ -2,12 +2,12 @@ import { Component, Input } from '@angular/core';
import { ContactFormComponent } from '../contact-form/contact-form.component';
import { CommonModule } from '@angular/common';
import { UserService } from '../../../services/user.service';
-import { BtnBackComponent } from '../../../shared/components/buttons/btn-back/btn-back.component';
+import { BtnCloseComponent } from '../../../shared/components/buttons/btn-close/btn-close.component';
@Component({
selector: 'app-contact-edit',
standalone: true,
- imports: [CommonModule, ContactFormComponent, BtnBackComponent],
+ imports: [CommonModule, ContactFormComponent, BtnCloseComponent],
templateUrl: './contact-edit.component.html',
styleUrl: './contact-edit.component.scss',
})
diff --git a/src/app/shared/components/buttons/btn-close/btn-close.component.html b/src/app/shared/components/buttons/btn-close/btn-close.component.html
new file mode 100644
index 0000000..d9fb310
--- /dev/null
+++ b/src/app/shared/components/buttons/btn-close/btn-close.component.html
@@ -0,0 +1,3 @@
+;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [BtnCloseComponent]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(BtnCloseComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/buttons/btn-close/btn-close.component.ts b/src/app/shared/components/buttons/btn-close/btn-close.component.ts
new file mode 100644
index 0000000..4d41723
--- /dev/null
+++ b/src/app/shared/components/buttons/btn-close/btn-close.component.ts
@@ -0,0 +1,20 @@
+import { Component, Input } from '@angular/core';
+import { SharedService } from '../../../../services/shared.service';
+
+@Component({
+ selector: 'app-btn-close',
+ standalone: true,
+ imports: [],
+ templateUrl: './btn-close.component.html',
+ styleUrl: './btn-close.component.scss',
+})
+export class BtnCloseComponent {
+ @Input() dialogClose!: string | boolean;
+
+ constructor(private sharedService: SharedService) {}
+
+ closeClicked() {
+ this.sharedService.isAnyDialogOpen = false;
+ this.dialogClose = false;
+ }
+}
diff --git a/src/assets/img/close.svg b/src/assets/img/close.svg
new file mode 100644
index 0000000..5a60c58
--- /dev/null
+++ b/src/assets/img/close.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
+
+
diff --git a/src/app/shared/components/buttons/btn-close/btn-close.component.scss b/src/app/shared/components/buttons/btn-close/btn-close.component.scss
new file mode 100644
index 0000000..c79bfc8
--- /dev/null
+++ b/src/app/shared/components/buttons/btn-close/btn-close.component.scss
@@ -0,0 +1,22 @@
+.btn {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 40px;
+ height: 40px;
+ cursor: pointer;
+ img {
+ width: 32px;
+ height: 32px;
+ filter: brightness(0) saturate(100%) invert(56%) sepia(64%) saturate(570%)
+ hue-rotate(154deg) brightness(92%) contrast(92%);
+ }
+ &:hover {
+ background-color: var(--light-gray);
+ border-radius: 100%;
+ scale: 1.1;
+ img {
+ scale: 1.1;
+ }
+ }
+}
diff --git a/src/app/shared/components/buttons/btn-close/btn-close.component.spec.ts b/src/app/shared/components/buttons/btn-close/btn-close.component.spec.ts
new file mode 100644
index 0000000..083a879
--- /dev/null
+++ b/src/app/shared/components/buttons/btn-close/btn-close.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BtnCloseComponent } from './btn-close.component';
+
+describe('BtnCloseComponent', () => {
+ let component: BtnCloseComponent;
+ let fixture: ComponentFixture