feat(mocule): add default presentation for money texts
This commit is contained in:
@@ -0,0 +1,9 @@
|
||||
:host {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
p {
|
||||
margin: 0 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
<my-wallet-typography
|
||||
[color]="color()"
|
||||
[size]="size()"
|
||||
[variant]="typographyVariant"
|
||||
>{{amount()|currency:currencyCode():'symbol-narrow'}}</my-wallet-typography>
|
||||
@@ -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<MoneyTextComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [MoneyTextComponent]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(MoneyTextComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -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<string|null>(null);
|
||||
size = input("1.6rem");
|
||||
typographyVariant = TypographyVariants.p;
|
||||
}
|
||||
Reference in New Issue
Block a user