From a6b021dd980ae8087edcd9604c26fff8a38dbb01 Mon Sep 17 00:00:00 2001 From: itsscb Date: Mon, 3 Mar 2025 22:43:08 +0100 Subject: [PATCH] feat: add TextButtonComponent --- .../text-button/text-button.component.css | 16 +++++++++++++ .../text-button/text-button.component.html | 1 + .../text-button/text-button.component.spec.ts | 23 +++++++++++++++++++ .../text-button/text-button.component.ts | 12 ++++++++++ 4 files changed, 52 insertions(+) create mode 100644 frontend/src/app/atomic/text-button/text-button.component.css create mode 100644 frontend/src/app/atomic/text-button/text-button.component.html create mode 100644 frontend/src/app/atomic/text-button/text-button.component.spec.ts create mode 100644 frontend/src/app/atomic/text-button/text-button.component.ts diff --git a/frontend/src/app/atomic/text-button/text-button.component.css b/frontend/src/app/atomic/text-button/text-button.component.css new file mode 100644 index 0000000..74b0441 --- /dev/null +++ b/frontend/src/app/atomic/text-button/text-button.component.css @@ -0,0 +1,16 @@ +button { + background-color: var(--primary-background-color); + color: var(--primary-text-color); + font-size: 1.5rem; + font-weight: bold; + padding: 1rem 3rem; + border: none; + border-color: var(--primary-background-color); + border-radius: 6px; + cursor: pointer; +} + +button:hover { + transform: translateY(3px); + transition: transform 0.1s ease-in-out; +} \ No newline at end of file diff --git a/frontend/src/app/atomic/text-button/text-button.component.html b/frontend/src/app/atomic/text-button/text-button.component.html new file mode 100644 index 0000000..3b26f78 --- /dev/null +++ b/frontend/src/app/atomic/text-button/text-button.component.html @@ -0,0 +1 @@ + diff --git a/frontend/src/app/atomic/text-button/text-button.component.spec.ts b/frontend/src/app/atomic/text-button/text-button.component.spec.ts new file mode 100644 index 0000000..70a71c7 --- /dev/null +++ b/frontend/src/app/atomic/text-button/text-button.component.spec.ts @@ -0,0 +1,23 @@ +import {ComponentFixture, TestBed} from '@angular/core/testing'; + +import {TextButtonComponent} from './text-button.component'; + +describe('ButtonComponent', () => { + let component: TextButtonComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [TextButtonComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(TextButtonComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/atomic/text-button/text-button.component.ts b/frontend/src/app/atomic/text-button/text-button.component.ts new file mode 100644 index 0000000..b585f5c --- /dev/null +++ b/frontend/src/app/atomic/text-button/text-button.component.ts @@ -0,0 +1,12 @@ +// import {Component} from '@angular/core'; +import {Component, Input} from '@angular/core'; + +@Component({ + selector: 'atomic-text-button', + imports: [], + templateUrl: './text-button.component.html', + styleUrl: './text-button.component.css' +}) +export class TextButtonComponent { + @Input() text: string = ''; +}