+
+ Przewidywalne
minimalne koszta:
+ @if(costData !== null) {
+
+ Koszta: {{costData.cost_of_trial}} zł
+ Czas: {{costData.time_of_trial }} miesięcy
+
+ }
+
+
+
+
Chcesz znacznie zredukować koszta?
+
+
+
+
+
\ No newline at end of file
diff --git a/arai-frontend/src/app/cost-view/cost-view.component.scss b/arai-frontend/src/app/cost-view/cost-view.component.scss
new file mode 100644
index 0000000..2de4eb7
--- /dev/null
+++ b/arai-frontend/src/app/cost-view/cost-view.component.scss
@@ -0,0 +1,51 @@
+.legal-costs {
+ font-family: 'Times New Roman', serif;
+ color: #2a2a2a;
+ background-color: #f5f5f5;
+ padding: 20px;
+ border: 1px solid #ddd;
+ border-radius: 5px;
+ font-size: 16px;
+ width: 300px;
+ margin: 0 auto;
+}
+
+.main {
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.legal-costs .cost-details {
+ margin-top: 10px;
+ padding: 10px;
+ background-color: #fff;
+ border-left: 5px solid #004085;
+ font-size: 24px;
+}
+
+.legal-costs .cost-details span {
+ font-weight: bold;
+}
+
+.legal-costs .cost-details .cost {
+ color: #007bff;
+}
+
+.legal-costs .cost-details .time {
+ color: #28a745;
+}
+
+.bait {
+ text-align: center;
+}
+
+.find-mediator {
+ width: 100%;
+}
+
+.center-button {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
diff --git a/arai-frontend/src/app/cost-view/cost-view.component.spec.ts b/arai-frontend/src/app/cost-view/cost-view.component.spec.ts
new file mode 100644
index 0000000..065e4fb
--- /dev/null
+++ b/arai-frontend/src/app/cost-view/cost-view.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CostViewComponent } from './cost-view.component';
+
+describe('CostViewComponent', () => {
+ let component: CostViewComponent;
+ let fixture: ComponentFixture