From 06c203aa95a4504d3928c430cca4c8fbf6d78f91 Mon Sep 17 00:00:00 2001 From: Koosthzuien <> Date: Tue, 22 Aug 2023 18:53:31 +0200 Subject: [PATCH 1/4] Added new onSale and originalPrice properties to product datatype --- src/app/products.ts | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/src/app/products.ts b/src/app/products.ts index 4d99807..a8dba3a 100644 --- a/src/app/products.ts +++ b/src/app/products.ts @@ -3,6 +3,8 @@ export interface Product { name: string; price: number; description: string; + onSale: boolean; + originalPrice?: number; } export const products: Product[] = [ @@ -10,18 +12,22 @@ export const products: Product[] = [ id: 1, name: 'Phone XL', price: 799, - description: 'A large phone with one of the best screens' + description: 'A large phone with one of the best screens', + onSale: false }, { id: 2, name: 'Phone Mini', price: 699, - description: 'A great phone with one of the best cameras' + description: 'A great phone with one of the best cameras', + onSale: false }, { id: 3, name: 'Phone Standard', price: 299, - description: '' + description: '', + onSale: true, + originalPrice: 500 } ]; From bfcca4420c2cd4734a3394adc866ce6b7665ae84 Mon Sep 17 00:00:00 2001 From: Koosthzuien <> Date: Tue, 22 Aug 2023 18:53:51 +0200 Subject: [PATCH 2/4] Added HTML rendering for new on sale indicators --- src/app/product-list/product-list.component.css | 8 ++++++++ .../product-list/product-list.component.html | 17 +++++++++++++++++ src/app/product-list/product-list.component.ts | 4 ++-- 3 files changed, 27 insertions(+), 2 deletions(-) diff --git a/src/app/product-list/product-list.component.css b/src/app/product-list/product-list.component.css index e69de29..b292da9 100644 --- a/src/app/product-list/product-list.component.css +++ b/src/app/product-list/product-list.component.css @@ -0,0 +1,8 @@ +.strike-through { + text-decoration: line-through; +} + +.my-7 { + margin-top: 14px; + margin-bottom: 14px; +} \ No newline at end of file diff --git a/src/app/product-list/product-list.component.html b/src/app/product-list/product-list.component.html index b760f69..c877c58 100644 --- a/src/app/product-list/product-list.component.html +++ b/src/app/product-list/product-list.component.html @@ -14,6 +14,23 @@

Description: {{ product.description }}

+
+

+ Was: + {{ product.originalPrice | currency }} +

+
+ Now: + {{ product.price | currency }} +
+
+ + +

+ Price: {{ product.price | currency }} +

+ + diff --git a/src/app/product-list/product-list.component.ts b/src/app/product-list/product-list.component.ts index eb746cf..70741e9 100644 --- a/src/app/product-list/product-list.component.ts +++ b/src/app/product-list/product-list.component.ts @@ -1,6 +1,6 @@ import { Component } from '@angular/core'; -import { products } from '../products'; +import { Product, products } from '../products'; @Component({ selector: 'app-product-list', @@ -9,7 +9,7 @@ import { products } from '../products'; }) export class ProductListComponent { - products = [...products]; + products: Product[] = [...products]; share() { window.alert('The product has been shared!'); From 0f127c18ee29d6c110838e45bf2ecda02a3fd0ad Mon Sep 17 00:00:00 2001 From: Koosthzuien <> Date: Tue, 22 Aug 2023 19:02:26 +0200 Subject: [PATCH 3/4] Added launch files to run project in visual studio code --- .vscode/launch.json | 26 ++++++++++++++++++++++++++ .vscode/tasks.json | 34 ++++++++++++++++++++++++++++++++++ 2 files changed, 60 insertions(+) create mode 100644 .vscode/launch.json create mode 100644 .vscode/tasks.json diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..18e4419 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,26 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:4200", + "webRoot": "${workspaceFolder}", + "sourceMaps": true, + "preLaunchTask": "start" + }, + { + "type": "msedge", + "request": "launch", + "name": "Launch Edge against localhost", + "url": "http://localhost:4200", + "webRoot": "${workspaceFolder}", + "sourceMaps": true, + "preLaunchTask": "start" + } + ] +} \ No newline at end of file diff --git a/.vscode/tasks.json b/.vscode/tasks.json new file mode 100644 index 0000000..550cb18 --- /dev/null +++ b/.vscode/tasks.json @@ -0,0 +1,34 @@ +{ + "version": "2.0.0", + "tasks": [ + { + "label": "start", + "type": "npm", + "script": "start", + "isBackground": true, + "presentation": { + "focus": true, + "panel": "dedicated" + }, + "problemMatcher": { + "owner": "typescript", + "source": "ts", + "applyTo": "closedDocuments", + "fileLocation": [ + "relative", + "${cwd}" + ], + "pattern": "$tsc", + "background": { + "activeOnStart": true, + "beginsPattern": { + "regexp": "(.*?)" + }, + "endsPattern": { + "regexp": "Compiled |Failed to compile." + } + } + } + } + ] +} \ No newline at end of file From d33d8423b5d746f802121258ca2ed1c3c7ecbab0 Mon Sep 17 00:00:00 2001 From: KyleO249 <59878048+KyleO249@users.noreply.github.com> Date: Thu, 24 Aug 2023 21:17:46 +0200 Subject: [PATCH 4/4] Update src/app/product-list/product-list.component.css Co-authored-by: Keagan Bester --- src/app/product-list/product-list.component.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/product-list/product-list.component.css b/src/app/product-list/product-list.component.css index b292da9..f7ee0fd 100644 --- a/src/app/product-list/product-list.component.css +++ b/src/app/product-list/product-list.component.css @@ -3,6 +3,6 @@ } .my-7 { - margin-top: 14px; + margin-top: 0.02%; margin-bottom: 14px; } \ No newline at end of file