diff --git a/README.md b/README.md index ac2c3b5..4848f03 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ Before getting started with Training.JobVacancy.Frontend , ensure your runtime e ### Installation -Install Training.JobVacancy.Frontend using one of the following methods: +Install Training.JobVacancy.Frontend using one of the following methods: **Build from source:** @@ -27,7 +27,7 @@ Install Training.JobVacancy.Frontend using one of the following methods: 2. Navigate to the project directory: ```sh -❯ Training.JobVacancy.Frontend +❯ Training.JobVacancy.Frontend ``` 3. Install the project dependencies: diff --git a/angular.json b/angular.json index 3aae48b..f96cef3 100644 --- a/angular.json +++ b/angular.json @@ -82,9 +82,7 @@ } }, "cli": { - "schematicCollections": [ - "angular-eslint" - ], + "schematicCollections": ["angular-eslint"], "analytics": false } } diff --git a/public/logo.jpg b/public/logo.jpg new file mode 100644 index 0000000..2fad006 Binary files /dev/null and b/public/logo.jpg differ diff --git a/src/app/app.component.ts b/src/app/app.component.ts index c03308f..87a0f8f 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -2,20 +2,20 @@ import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; import { HeaderComponent } from './header/header.component'; -import { PlaygroundComponent } from './playground/playground.component'; -import { ToolbarComponent } from "./playground/toolbar/toolbar.component"; +import { ToolbarComponent } from './playground/toolbar/toolbar.component'; @Component({ selector: 'aa-root', standalone: true, - imports: [RouterOutlet, HeaderComponent, ToolbarComponent, PlaygroundComponent], + imports: [RouterOutlet, HeaderComponent, ToolbarComponent], template: `

Welcome to {{ title }}!

- - - +
+
+ +
`, styleUrls: ['./app.component.scss'], }) diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index dc39edb..730931e 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,3 +1,10 @@ import { Routes } from '@angular/router'; -export const routes: Routes = []; +export const routes: Routes = [ + { + path: 'playground', + loadComponent: () => + import('./playground/playground.component').then(m => m.PlaygroundComponent), + }, + { path: '', redirectTo: 'playground', pathMatch: 'full' }, +]; diff --git a/src/app/playground/company-card/company-card.component.html b/src/app/playground/company-card/company-card.component.html new file mode 100644 index 0000000..5776c4e --- /dev/null +++ b/src/app/playground/company-card/company-card.component.html @@ -0,0 +1,41 @@ +@let company = companyData(); +
+
+
+ +
+
+ +
+
+
+ {{ company.name }} +
+ @if (company.isFeatured) { +
+ Featured +
+ } +
+ +
+ + {{ company.location }}, {{ company.country }} +
+
+ +
+ +
+
diff --git a/src/app/playground/company-card/company-card.component.scss b/src/app/playground/company-card/company-card.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/playground/company-card/company-card.component.spec.ts b/src/app/playground/company-card/company-card.component.spec.ts new file mode 100644 index 0000000..27b88ed --- /dev/null +++ b/src/app/playground/company-card/company-card.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CompanyCardComponent } from './company-card.component'; + +describe('CompanyCardComponent', () => { + let component: CompanyCardComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CompanyCardComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(CompanyCardComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/playground/company-card/company-card.component.ts b/src/app/playground/company-card/company-card.component.ts new file mode 100644 index 0000000..744f6d8 --- /dev/null +++ b/src/app/playground/company-card/company-card.component.ts @@ -0,0 +1,26 @@ +import { Component, inject, input } from '@angular/core'; +import { Router } from '@angular/router'; +import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; +import { faGlobe, faLocationDot } from '@fortawesome/free-solid-svg-icons'; + +import { Company } from '../models/company'; + +@Component({ + selector: 'aa-company-card', + imports: [FontAwesomeModule], + templateUrl: './company-card.component.html', + styleUrl: './company-card.component.scss', +}) +export class CompanyCardComponent { + companyData = input.required(); + + router = inject(Router); + + faGlobe = faGlobe; + faLocationDot = faLocationDot; + + onOpenPositions() { + console.log('Open positions clicked'); + this.router.navigateByUrl('#'); + } +} diff --git a/src/app/playground/company-info/company-info.component.html b/src/app/playground/company-info/company-info.component.html index 24d150c..909d417 100644 --- a/src/app/playground/company-info/company-info.component.html +++ b/src/app/playground/company-info/company-info.component.html @@ -1,5 +1,12 @@
- -

Jobpilot

+ +

Jobpilot

-

6391 Elgin St. Celina, Delaware 10299, New York, United States of America

+

+ 6391 Elgin St. Celina, Delaware 10299, New York, United States of America +

diff --git a/src/app/playground/footer-icons/footer-icons.component.html b/src/app/playground/footer-icons/footer-icons.component.html index 77e3ac9..46dcd17 100644 --- a/src/app/playground/footer-icons/footer-icons.component.html +++ b/src/app/playground/footer-icons/footer-icons.component.html @@ -1,14 +1,32 @@ - - + + - - + + - - + + - - + + - - diff --git a/src/app/playground/footer/footer.component.html b/src/app/playground/footer/footer.component.html index 389a21f..05c4b3a 100644 --- a/src/app/playground/footer/footer.component.html +++ b/src/app/playground/footer/footer.component.html @@ -1,17 +1,21 @@ -