diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..1b8ac88 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,3 @@ +# Ignore artifacts: +build +coverage diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..0967ef4 --- /dev/null +++ b/.prettierrc @@ -0,0 +1 @@ +{} diff --git a/angular.json b/angular.json index 313e36e..66e531f 100644 --- a/angular.json +++ b/angular.json @@ -14,9 +14,7 @@ "builder": "@angular/build:application", "options": { "browser": "src/main.ts", - "polyfills": [ - "zone.js" - ], + "polyfills": ["zone.js"], "tsConfig": "tsconfig.app.json", "assets": [ { @@ -24,9 +22,7 @@ "input": "public" } ], - "styles": [ - "src/styles.css" - ] + "styles": ["src/styles.css"] }, "configurations": { "production": { @@ -70,10 +66,7 @@ "test": { "builder": "@angular/build:karma", "options": { - "polyfills": [ - "zone.js", - "zone.js/testing" - ], + "polyfills": ["zone.js", "zone.js/testing"], "tsConfig": "tsconfig.spec.json", "assets": [ { @@ -81,9 +74,7 @@ "input": "public" } ], - "styles": [ - "src/styles.css" - ] + "styles": ["src/styles.css"] } } } diff --git a/package-lock.json b/package-lock.json index 3618f06..533aca3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,6 +16,7 @@ "@angular/router": "^20.3.0", "@tailwindcss/postcss": "^4.1.17", "postcss": "^8.5.6", + "prettier": "^3.6.2", "rxjs": "~7.8.0", "tailwindcss": "^4.1.17", "tslib": "^2.3.0", @@ -8392,6 +8393,21 @@ "dev": true, "license": "MIT" }, + "node_modules/prettier": { + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz", + "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==", + "license": "MIT", + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, "node_modules/proc-log": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/proc-log/-/proc-log-5.0.0.tgz", diff --git a/package.json b/package.json index cd52557..f6993a7 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "@angular/router": "^20.3.0", "@tailwindcss/postcss": "^4.1.17", "postcss": "^8.5.6", + "prettier": "^3.6.2", "rxjs": "~7.8.0", "tailwindcss": "^4.1.17", "tslib": "^2.3.0", diff --git a/src/app/app.config.ts b/src/app/app.config.ts index d953f4c..414eeae 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -1,4 +1,8 @@ -import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChangeDetection } from '@angular/core'; +import { + ApplicationConfig, + provideBrowserGlobalErrorListeners, + provideZoneChangeDetection, +} from '@angular/core'; import { provideRouter } from '@angular/router'; import { routes } from './app.routes'; @@ -7,6 +11,6 @@ export const appConfig: ApplicationConfig = { providers: [ provideBrowserGlobalErrorListeners(), provideZoneChangeDetection({ eventCoalescing: true }), - provideRouter(routes) - ] + provideRouter(routes), + ], }; diff --git a/src/app/app.html b/src/app/app.html index 85183dc..3348174 100644 --- a/src/app/app.html +++ b/src/app/app.html @@ -1,6 +1,6 @@ -
+
+ -
- + diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index bf06ff2..c7eb174 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,13 +1,18 @@ import { Routes } from '@angular/router'; import { Startpage } from './sites/startpage/startpage'; +import {TestIt} from './sites/test-it/test-it'; export const routes: Routes = [ - - - - + { + path:'test', + component: TestIt, + }, { path: '', component: Startpage, + }, + { + path: '**', + redirectTo: '', } ]; diff --git a/src/app/app.ts b/src/app/app.ts index 1d7cfca..60a9776 100644 --- a/src/app/app.ts +++ b/src/app/app.ts @@ -1,12 +1,12 @@ import { Component, signal } from '@angular/core'; import { RouterOutlet } from '@angular/router'; -import {Navbar} from './components/navbar/navbar'; +import { Navbar } from './components/navbar/navbar'; @Component({ selector: 'app-root', imports: [RouterOutlet, Navbar], templateUrl: './app.html', - styleUrl: './app.css' + styleUrl: './app.css', }) export class App { protected readonly title = signal('tools-website'); diff --git a/src/app/components/custom-card/custom-card.css b/src/app/components/custom-card/custom-card.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/components/custom-card/custom-card.html b/src/app/components/custom-card/custom-card.html new file mode 100644 index 0000000..330f8bd --- /dev/null +++ b/src/app/components/custom-card/custom-card.html @@ -0,0 +1,15 @@ +@if (enabled()) { +
+ + {{ description() }} +
+} diff --git a/src/app/components/custom-card/custom-card.spec.ts b/src/app/components/custom-card/custom-card.spec.ts new file mode 100644 index 0000000..bad39db --- /dev/null +++ b/src/app/components/custom-card/custom-card.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomCard } from './custom-card'; + +describe('CustomCard', () => { + let component: CustomCard; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomCard], + }).compileComponents(); + + fixture = TestBed.createComponent(CustomCard); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/custom-card/custom-card.ts b/src/app/components/custom-card/custom-card.ts new file mode 100644 index 0000000..5fbbfdc --- /dev/null +++ b/src/app/components/custom-card/custom-card.ts @@ -0,0 +1,28 @@ +import { Component, input } from '@angular/core'; +import { CustomTitle } from '../custom-title/custom-title'; +import {RouterLink} from '@angular/router'; +import {NgStyle} from '@angular/common'; + +@Component({ + selector: 'app-custom-card', + imports: [CustomTitle, RouterLink, NgStyle], + templateUrl: './custom-card.html', + styleUrl: './custom-card.css', +}) +export class CustomCard { + + title = input.required(); + titleSizeInPx = input(20); + titleColor = input(); + + description = input.required(); + descriptionColor = input(); + + destination = input.required(); + enabled = input.required(); + + + ngOnInit() { + console.log(this.destination()); + } +} diff --git a/src/app/components/custom-title/custom-title.css b/src/app/components/custom-title/custom-title.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/components/custom-title/custom-title.html b/src/app/components/custom-title/custom-title.html new file mode 100644 index 0000000..a258993 --- /dev/null +++ b/src/app/components/custom-title/custom-title.html @@ -0,0 +1,6 @@ +{{ text() }} diff --git a/src/app/components/custom-title/custom-title.spec.ts b/src/app/components/custom-title/custom-title.spec.ts new file mode 100644 index 0000000..97e7031 --- /dev/null +++ b/src/app/components/custom-title/custom-title.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomTitle } from './custom-title'; + +describe('CustomTitle', () => { + let component: CustomTitle; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomTitle], + }).compileComponents(); + + fixture = TestBed.createComponent(CustomTitle); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/custom-title/custom-title.ts b/src/app/components/custom-title/custom-title.ts new file mode 100644 index 0000000..51b111d --- /dev/null +++ b/src/app/components/custom-title/custom-title.ts @@ -0,0 +1,15 @@ +import { Component, input } from '@angular/core'; +import {NgClass, NgStyle} from '@angular/common'; + +@Component({ + selector: 'app-custom-title', + imports: [NgStyle, NgClass], + templateUrl: './custom-title.html', + styleUrl: './custom-title.css', +}) +export class CustomTitle { + text = input.required(); + textSizeInPx = input(16); + textColor = input(); + fontWeight = input("normal"); +} diff --git a/src/app/components/navbar/navbar.html b/src/app/components/navbar/navbar.html index bef34a9..342b515 100644 --- a/src/app/components/navbar/navbar.html +++ b/src/app/components/navbar/navbar.html @@ -1,11 +1,17 @@