diff --git a/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.css b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.css new file mode 100644 index 0000000..2707d28 --- /dev/null +++ b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.css @@ -0,0 +1,9 @@ +:host { + align-items: center; + display: flex; + height: 100%; +} +p { + margin: 0 0; + font-weight: 500; +} \ No newline at end of file diff --git a/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.html b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.html new file mode 100644 index 0000000..2e9d141 --- /dev/null +++ b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.html @@ -0,0 +1,5 @@ +{{amount()|currency:currencyCode():'symbol-narrow'}} diff --git a/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.spec.ts b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.spec.ts new file mode 100644 index 0000000..20aa193 --- /dev/null +++ b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MoneyTextComponent } from './money-text.component'; + +describe('MoneyTextComponent', () => { + let component: MoneyTextComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [MoneyTextComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(MoneyTextComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.ts b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.ts new file mode 100644 index 0000000..0c2e02a --- /dev/null +++ b/projects/my-wallet-ds/src/lib/molecules/money-text/money-text.component.ts @@ -0,0 +1,19 @@ +import { CurrencyPipe } from '@angular/common'; +import { Component, input } from '@angular/core'; +import { TypographyComponent } from './../../atoms/typography/typography.component'; +import { TypographyVariants } from './../../types/TypographyVariants'; +@Component({ + selector: 'my-wallet-money-text', + standalone: true, + imports: [CurrencyPipe, TypographyComponent], + templateUrl: './money-text.component.html', + styleUrl: './money-text.component.css' +}) +export class MoneyTextComponent { + amount = input(0); + currencyCode = input("USD"); + color = input("var(--mw-gray-500)"); + lineHeight = input(null); + size = input("1.6rem"); + typographyVariant = TypographyVariants.p; +}