feat: send screen

client/src/app/screens/screen-send/screen-send.html

@@ -0,0 +1,57 @@
+<div class="container py-5">
+  <div class="row justify-content-center">
+    <div class="col-lg-6 col-md-8">
+      <div class="card shadow-sm">
+        <div class="card-header bg-primary text-white">
+          <h3 class="mb-0">Send Money</h3>
+        </div>
+        <div class="card-body p-4">
+          <!-- Amount Input (Centered Large Field) -->
+          <div class="text-center mb-4">
+            <label class="form-label h5">Amount</label>
+            <div class="input-group input-group-lg mb-3">
+              <span class="input-group-text">$</span>
+              <input
+                type="number"
+                class="form-control text-center fs-2"
+                placeholder="0.00"
+                [(ngModel)]="amount"
+              />
+            </div>
+          </div>
+
+          <!-- Recipient Field -->
+          <div class="mb-3">
+            <label class="form-label">To</label>
+            <div class="input-group">
+              <span class="input-group-text">@</span>
+              <input
+                type="text"
+                class="form-control"
+                placeholder="Email or phone number"
+                [(ngModel)]="recipient"
+              />
+            </div>
+          </div>
+
+          <!-- Note Field -->
+          <div class="mb-4">
+            <label class="form-label">Note (Optional)</label>
+            <textarea class="form-control" rows="2" [(ngModel)]="note"></textarea>
+          </div>
+
+          <!-- Action Buttons -->
+          <div class="d-grid gap-2">
+            <button class="btn btn-primary btn-lg" (click)="sendMoney()">
+              Send Money
+            </button>
+            <button class="btn btn-outline-secondary btn-lg" (click)="cancel()">
+              Cancel
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+

client/src/app/screens/screen-send/screen-send.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ScreenSend } from './screen-send';
+
+describe('ScreenSend', () => {
+  let component: ScreenSend;
+  let fixture: ComponentFixture<ScreenSend>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ScreenSend],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ScreenSend);
+    component = fixture.componentInstance;
+    await fixture.whenStable();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

client/src/app/screens/screen-send/screen-send.ts

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+
+@Component({
+  selector: 'app-screen-send',
+  imports: [FormsModule],
+  templateUrl: './screen-send.html',
+  styleUrl: './screen-send.less',
+})
+export class ScreenSend {
+  amount: number = 0;
+  recipient: string = '';
+  note: string = '';
+
+  sendMoney() {
+    console.log('Sending:', this.amount, 'to', this.recipient);
+    // Add your logic here (e.g., API call)
+  }
+
+  cancel() {
+    this.amount = 0;
+    this.recipient = '';
+    this.note = '';
+  }
+}