Upload Aufgabe 05
This commit is contained in:
Justin Dretvic
parent
e6584e69dd
commit
7da97db774
Binary file not shown.
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"ExpandedNodes": [
|
||||
""
|
||||
],
|
||||
"PreviewInSolutionExplorer": false
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 645 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 450 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 673 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 662 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 747 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 676 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 636 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 695 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 983 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 672 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 799 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 521 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.6 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 2.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 MiB |
|
|
@ -0,0 +1,89 @@
|
|||
#übersicht {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 10px 0px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.container .product {
|
||||
width: 300px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
border: solid #006a4e;
|
||||
background-color: #b8d5cd;
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.container .product img {
|
||||
width: 90%;
|
||||
height: auto;
|
||||
max-height: 300px;
|
||||
border: solid #006a4e;
|
||||
border-radius: 40px;
|
||||
overflow: hidden;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.container .product p, h3 {
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.container .product .title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .shopIn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.container .product .shopIn span,button{
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
margin: 10px 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button>span.buttonModifier {
|
||||
text-align: center;
|
||||
margin: 0px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button{
|
||||
border-radius: 30px;
|
||||
border-color: #006a4e;
|
||||
background-color: #2e856e;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
padding: 0px 10px;
|
||||
color: #b8d5cd;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .size {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .description{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: justify;
|
||||
height: 150px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
|
@ -0,0 +1,94 @@
|
|||
#übersicht {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 10px 0px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.container .product {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
border: solid #006a4e;
|
||||
background-color: #b8d5cd;
|
||||
border-radius: 40px;
|
||||
margin: 10px 20px;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.container .product img {
|
||||
width: 90%;
|
||||
height: width;
|
||||
max-height: 400px;
|
||||
border: solid #006a4e;
|
||||
border-radius: 40px;
|
||||
overflow: hidden;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.container .product p, h3 {
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.container .product .title {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .shopIn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.container .product .shopIn span,button{
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
margin: 10px 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button>span.buttonModifier {
|
||||
text-align: center;
|
||||
margin: 0px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button{
|
||||
border-radius: 30px;
|
||||
border-color: #006a4e;
|
||||
background-color: #2e856e;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
padding: 0px 10px;
|
||||
color: #b8d5cd;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .size {
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.container .product .description{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: justify;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
#bunt,#grün,#special {
|
||||
font-size: 50px;
|
||||
color: #006a4e;
|
||||
}
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 10px 0px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.container .product {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
border: solid #006a4e;
|
||||
background-color: #b8d5cd;
|
||||
border-radius: 40px;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
|
||||
.container .product img {
|
||||
width: 90%;
|
||||
height: auto;
|
||||
max-height: 300px;
|
||||
border: solid #006a4e;
|
||||
border-radius: 40px;
|
||||
overflow: hidden;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.container .product p, h3 {
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.container .product .title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .shopIn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.container .product .shopIn span,button{
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
margin: 10px 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button>span.buttonModifier {
|
||||
text-align: center;
|
||||
margin: 0px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button{
|
||||
border-radius: 30px;
|
||||
border-color: #006a4e;
|
||||
background-color: #2e856e;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
padding: 0px 10px;
|
||||
color: #b8d5cd;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .size {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .description{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: justify;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
#bunt,#grün,#special {
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
color: #006a4e;
|
||||
}
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 10px 0px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.container .product {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
border: solid #006a4e;
|
||||
background-color: #b8d5cd;
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.container .product img {
|
||||
width: 90%;
|
||||
height: auto;
|
||||
max-height: 300px;
|
||||
border: solid #006a4e;
|
||||
border-radius: 40px;
|
||||
overflow: hidden;
|
||||
object-fit: none;
|
||||
}
|
||||
|
||||
.container .product p, h3 {
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.container .product .title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .shopIn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.container .product .shopIn span,button{
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
margin: 10px 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button>span.buttonModifier {
|
||||
text-align: center;
|
||||
margin: 0px;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.container .product .shopIn button{
|
||||
border-radius: 30px;
|
||||
border-color: #006a4e;
|
||||
background-color: #2e856e;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
padding: 0px 10px;
|
||||
color: #b8d5cd;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.container .product .size {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.container .product .description{
|
||||
text-align: justify;
|
||||
}
|
||||
|
|
@ -0,0 +1,206 @@
|
|||
"use strict";
|
||||
// Datensammlung für Produkte
|
||||
let categories = [
|
||||
{
|
||||
title: "Special Offers!",
|
||||
id: "special",
|
||||
products: [
|
||||
{
|
||||
title: "Color: Rainbow",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-rainbow-square.png",
|
||||
description: "If you can't choose one color, go and catch them all!"
|
||||
}, {
|
||||
title: "Color: White",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-white.png",
|
||||
description: "The appearance of many sparkling stars on your garden floor."
|
||||
}, {
|
||||
title: "Color: Black",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-black.png",
|
||||
description: "Dark as the night. Be careful not to form a black hole!"
|
||||
}, {
|
||||
title: "Pattern: Murica",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green-murica.png",
|
||||
description: "Texas, Trump, Guns & Hamburgers"
|
||||
}, {
|
||||
title: "Pattern: Schachbrett",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green-chess-square.png",
|
||||
description: "Show your intellect on your own lawn and embarrass your opponents!"
|
||||
}
|
||||
]
|
||||
}, {
|
||||
title: "Bunte Gräser",
|
||||
id: "bunt",
|
||||
products: [
|
||||
{
|
||||
title: "Color: Green",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green.png",
|
||||
description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!"
|
||||
}, {
|
||||
title: "Color: Desert",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-yellow.png",
|
||||
description: "Summer, sun and oh my god, I'm hot! Are they pyramids in my garden ?!"
|
||||
}, {
|
||||
title: "Color: Beach",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-orange.png",
|
||||
description: "Summer, sun and hot feelings!"
|
||||
}, {
|
||||
title: "Pattern: Hell",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-red.png",
|
||||
description: "Look into the abyss that could await you after your death and invite guests to it!"
|
||||
}, {
|
||||
title: "Pattern: Unicorn",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-pink.png",
|
||||
description: "PINK FLUFFY UNICORN, DANCING ON RAINBOWS (which you can also buy in here) !!!"
|
||||
}, {
|
||||
title: "Pattern: Grape",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-purple.png",
|
||||
description: "It looks purple. Do you have to say more?"
|
||||
}, {
|
||||
title: "Pattern: Atlantic",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-blue.png",
|
||||
description: "Blue like the ocean. A deep look and mysterious nature."
|
||||
}
|
||||
]
|
||||
}, {
|
||||
title: "Green-Tones",
|
||||
id: "grün",
|
||||
products: [
|
||||
{
|
||||
title: "Green: 3B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-3.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 2B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-2.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-1.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: HB",
|
||||
price: 2339.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green.png",
|
||||
description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!"
|
||||
}, {
|
||||
title: "Green: H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-1.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 2H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-2.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 3H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-3.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
printProducts();
|
||||
//create Structure;
|
||||
function printProducts() {
|
||||
for (let nummer = 0; nummer < categories.length; nummer++) {
|
||||
let heading = document.createElement("h1");
|
||||
heading.setAttribute("id", categories[nummer].id);
|
||||
heading.innerHTML = `${categories[nummer].title}`;
|
||||
document.querySelector("#übersicht").appendChild(heading);
|
||||
let container = document.createElement("div");
|
||||
container.classList.add("container");
|
||||
document.querySelector("#übersicht").appendChild(container);
|
||||
for (let index = 0; index < categories[nummer].products.length; index++) {
|
||||
let product = document.createElement("div");
|
||||
product.classList.add("product");
|
||||
product.innerHTML = `
|
||||
<h3 class="title"> ${categories[nummer].products[index].title} </h3>
|
||||
<div class=shopIn>
|
||||
<span class="price"> ${categories[nummer].products[index].price} ¥</span>
|
||||
<button>+</button>
|
||||
<button>-</button>
|
||||
</div>
|
||||
<img src="files/${categories[nummer].products[index].imgName}" alt="Product" />
|
||||
<p class="size"> Size: ${categories[nummer].products[index].size}</p>
|
||||
<div class="description">
|
||||
<p> ${categories[nummer].products[index].description}</p>
|
||||
</div>
|
||||
`;
|
||||
container.appendChild(product);
|
||||
}
|
||||
}
|
||||
}
|
||||
// Folgender auskommentierter Code dient mir als Archiv für Gedankenansätze oder Verläufe.
|
||||
// Wenn dies nicht gerne gesehen ist, gebt mir kurz Bescheid und ich werde es entfernen
|
||||
/*
|
||||
function zeichnen(tagArray: Tag[]): void {
|
||||
for (let i: number = 0; i < tagArray.length ; i++){
|
||||
let title: HTMLElement = document.createElement(tagArray[i].tag);
|
||||
title.innerHTML = "I bims title";
|
||||
title.classList.add("title");
|
||||
if (tagArray[i].image) {
|
||||
title.setAttribute("src", "value");
|
||||
title.setAttribute("alt", "value");
|
||||
}
|
||||
document.body.appendChild(title);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*
|
||||
console.log("Hello Console");
|
||||
let theName: String = "Justin" + "Dretvic" + 20;
|
||||
console.log(theName);
|
||||
*/
|
||||
/*
|
||||
# Template für ein Produkt in HTML
|
||||
<div class="product"> tag class
|
||||
<h3 class="title"> Color: Rainbow </h3> tag class content
|
||||
<div class=shopIn> tag class
|
||||
<span class="price"> 3279,99 ¥ </span> tag class content
|
||||
<button>+</button> tag content
|
||||
<button>-</button> tag content
|
||||
</div>
|
||||
<img src="files/grass-rainbow-square.png" alt="Product" /> tag attribute1 attribute2
|
||||
<p class="size"> Size: 4m²</p> tag class content
|
||||
<div class="description"> tag class
|
||||
<p> If you can't choose one color, go and catch them all!</p> tag content
|
||||
</div>
|
||||
</div>
|
||||
*/
|
||||
//# sourceMappingURL=script.js.map
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"file":"script.js","sourceRoot":"","sources":["script.ts"],"names":[],"mappings":"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"}
|
||||
|
|
@ -0,0 +1,232 @@
|
|||
// Datensammlung für Produkte
|
||||
|
||||
interface Product {
|
||||
title: string;
|
||||
price: number;
|
||||
size: string;
|
||||
imgName: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
interface Category {
|
||||
title: string;
|
||||
id: string;
|
||||
products: Product[];
|
||||
}
|
||||
|
||||
let categories: Category[] = [
|
||||
{
|
||||
title: "Special Offers!",
|
||||
id: "special",
|
||||
products: [
|
||||
{
|
||||
title: "Color: Rainbow",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-rainbow-square.png",
|
||||
description: "If you can't choose one color, go and catch them all!"
|
||||
}, {
|
||||
title: "Color: White",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-white.png",
|
||||
description: "The appearance of many sparkling stars on your garden floor."
|
||||
}, {
|
||||
title: "Color: Black",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-black.png",
|
||||
description: "Dark as the night. Be careful not to form a black hole!"
|
||||
}, {
|
||||
title: "Pattern: Murica",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green-murica.png",
|
||||
description: "Texas, Trump, Guns & Hamburgers"
|
||||
}, {
|
||||
title: "Pattern: Schachbrett",
|
||||
price: 3279.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green-chess-square.png",
|
||||
description: "Show your intellect on your own lawn and embarrass your opponents!"
|
||||
}
|
||||
]
|
||||
}, {
|
||||
title: "Bunte Gräser",
|
||||
id: "bunt",
|
||||
products: [
|
||||
{
|
||||
title: "Color: Green",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-green.png",
|
||||
description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!"
|
||||
}, {
|
||||
title: "Color: Desert",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-yellow.png",
|
||||
description: "Summer, sun and oh my god, I'm hot! Are they pyramids in my garden ?!"
|
||||
}, {
|
||||
title: "Color: Beach",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-orange.png",
|
||||
description: "Summer, sun and hot feelings!"
|
||||
}, {
|
||||
title: "Pattern: Hell",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-red.png",
|
||||
description: "Look into the abyss that could await you after your death and invite guests to it!"
|
||||
}, {
|
||||
title: "Pattern: Unicorn",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-pink.png",
|
||||
description: "PINK FLUFFY UNICORN, DANCING ON RAINBOWS (which you can also buy in here) !!!"
|
||||
}, {
|
||||
title: "Pattern: Grape",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-purple.png",
|
||||
description: "It looks purple. Do you have to say more?"
|
||||
}, {
|
||||
title: "Pattern: Atlantic",
|
||||
price: 2339.99,
|
||||
size: "4m²",
|
||||
imgName: "grass-blue.png",
|
||||
description: "Blue like the ocean. A deep look and mysterious nature."
|
||||
}
|
||||
]
|
||||
}, {
|
||||
title: "Green-Tones",
|
||||
id: "grün",
|
||||
products: [
|
||||
{
|
||||
title: "Green: 3B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-3.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 2B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-2.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: B",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-dark-1.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: HB",
|
||||
price: 2339.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green.png",
|
||||
description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!"
|
||||
}, {
|
||||
title: "Green: H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-1.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 2H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-2.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}, {
|
||||
title: "Green: 3H",
|
||||
price: 3499.99,
|
||||
size: "10m²",
|
||||
imgName: "grass-green-light-3.png",
|
||||
description: "Green in every way. Nothing more to know about it."
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
printProducts();
|
||||
|
||||
//create Structure;
|
||||
|
||||
function printProducts(): void {
|
||||
for (let nummer: number = 0; nummer < categories.length; nummer++) {
|
||||
|
||||
let heading: HTMLHeadingElement = document.createElement("h1");
|
||||
heading.setAttribute("id", categories[nummer].id);
|
||||
heading.innerHTML = `${categories[nummer].title}`;
|
||||
(<HTMLDivElement>document.querySelector("#übersicht")).appendChild(heading);
|
||||
|
||||
let container: HTMLDivElement = document.createElement("div");
|
||||
container.classList.add("container");
|
||||
(<HTMLDivElement>document.querySelector("#übersicht")).appendChild(container);
|
||||
|
||||
for (let index: number = 0; index < categories[nummer].products.length; index++) {
|
||||
let product: HTMLDivElement = document.createElement("div");
|
||||
product.classList.add("product");
|
||||
product.innerHTML = `
|
||||
<h3 class="title"> ${categories[nummer].products[index].title} </h3>
|
||||
<div class=shopIn>
|
||||
<span class="price"> ${categories[nummer].products[index].price} ¥</span>
|
||||
<button>+</button>
|
||||
<button>-</button>
|
||||
</div>
|
||||
<img src="files/${categories[nummer].products[index].imgName}" alt="Product" />
|
||||
<p class="size"> Size: ${categories[nummer].products[index].size}</p>
|
||||
<div class="description">
|
||||
<p> ${categories[nummer].products[index].description}</p>
|
||||
</div>
|
||||
`;
|
||||
container.appendChild(product);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Folgender auskommentierter Code dient mir als Archiv für Gedankenansätze oder Verläufe.
|
||||
// Wenn dies nicht gerne gesehen ist, gebt mir kurz Bescheid und ich werde es entfernen
|
||||
|
||||
/*
|
||||
function zeichnen(tagArray: Tag[]): void {
|
||||
for (let i: number = 0; i < tagArray.length ; i++){
|
||||
let title: HTMLElement = document.createElement(tagArray[i].tag);
|
||||
title.innerHTML = "I bims title";
|
||||
title.classList.add("title");
|
||||
if (tagArray[i].image) {
|
||||
title.setAttribute("src", "value");
|
||||
title.setAttribute("alt", "value");
|
||||
}
|
||||
document.body.appendChild(title);
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
/*
|
||||
console.log("Hello Console");
|
||||
let theName: String = "Justin" + "Dretvic" + 20;
|
||||
console.log(theName);
|
||||
*/
|
||||
|
||||
/*
|
||||
# Template für ein Produkt in HTML
|
||||
<div class="product"> tag class
|
||||
<h3 class="title"> Color: Rainbow </h3> tag class content
|
||||
<div class=shopIn> tag class
|
||||
<span class="price"> 3279,99 ¥ </span> tag class content
|
||||
<button>+</button> tag content
|
||||
<button>-</button> tag content
|
||||
</div>
|
||||
<img src="files/grass-rainbow-square.png" alt="Product" /> tag attribute1 attribute2
|
||||
<p class="size"> Size: 4m²</p> tag class content
|
||||
<div class="description"> tag class
|
||||
<p> If you can't choose one color, go and catch them all!</p> tag content
|
||||
</div>
|
||||
</div>
|
||||
*/
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
body {
|
||||
margin: 0;
|
||||
font-family: Chelsea Market;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 10px 0px;
|
||||
position: relative;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
background-color: #006a4e;
|
||||
color: #b8d5cd;
|
||||
}
|
||||
|
||||
header ul {
|
||||
list-style: none;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
header li {
|
||||
display: block;
|
||||
margin: 10px auto 0px;
|
||||
}
|
||||
|
||||
header li a {
|
||||
text-decoration: none;
|
||||
color: #b8d5cd;
|
||||
}
|
||||
|
||||
header .dropdown {
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
position: relative;
|
||||
display: block;
|
||||
background-color: #2e856e;
|
||||
border-radius: 40px;
|
||||
margin: 10px 5px 0px 5px;
|
||||
padding: 10px 0px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
header .dropdown-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header .dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
header #shopping_cart {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
display: block;
|
||||
background-color: #2e856e;
|
||||
border-radius: 40px;
|
||||
margin: 10px 5px 0px 5px;
|
||||
padding: 10px 0px;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
header #shopping_cart a {
|
||||
text-decoration: none;
|
||||
color: #b8d5cd;
|
||||
font-size:24px
|
||||
}
|
||||
|
||||
header #shopping_cart a:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
header .title_bar img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin: 5px 15px;
|
||||
}
|
||||
|
||||
header .title_bar span {
|
||||
font-size: 27px;
|
||||
line-height: 50px;
|
||||
margin: auto 0px;
|
||||
}
|
||||
|
||||
header .title_bar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
background-color: #2e856e;
|
||||
border-radius: 40px;
|
||||
padding: 5px;
|
||||
margin: 5px
|
||||
}
|
||||
|
||||
header #bottom {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
header #shopping_cart {
|
||||
margin: 10px auto;
|
||||
text-align: center;
|
||||
color: #b8d5cd;
|
||||
display: block;
|
||||
background-color: #2e856e;
|
||||
border-radius: 40px;
|
||||
margin: 10px 5px 0px 5px;
|
||||
padding: 10px 0px;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
padding: 10px 5px;
|
||||
position: relative;
|
||||
bottom: 0;
|
||||
width: calc(100%-10px);
|
||||
background-color: #272727;
|
||||
color: white;
|
||||
}
|
||||
|
||||
footer p {
|
||||
margin: 0px 0px 10px;
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<script src='https://kit.fontawesome.com/a076d05399.js'></script>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Chelsea+Market&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" media="screen and (max-width: 600px)" href="product-small.css">
|
||||
<link rel="stylesheet" media="screen and (min-width: 601px)" href="product-medium.css">
|
||||
<link rel="stylesheet" media="screen and (min-width: 1025px)" href="product-big.css">
|
||||
<link rel="stylesheet" href="shop.css">
|
||||
<script src="script.js" defer></script>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>green grass</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<div class="title_bar">
|
||||
<img src="files/grass_icon_left.png" alt="grass" />
|
||||
<span>GREEEN GRASS</span>
|
||||
<img src="files/grass_icon_right.png" alt="grass" />
|
||||
</div>
|
||||
<div id="bottom">
|
||||
<div class="dropdown">
|
||||
<span>Categories</span>
|
||||
<ul class="dropdown-content">
|
||||
<li><a href="#special">~ Special Offers ~</a></li>
|
||||
<li><a href="#bunt">~ Colored Grass ~</a></li>
|
||||
<li><a href="#grün">~ Green-Tones ~</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="shopping_cart">
|
||||
<a href=""><i class="fas fa-shopping-cart" style='font-size:24px'></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="übersicht" />
|
||||
|
||||
<footer>
|
||||
<h1>Disclaimer</h1>
|
||||
<p>This website is not used monetarily </p>
|
||||
<p>Not even if things seem to be sold here!</p>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -13,13 +13,13 @@ body {
|
|||
</head>
|
||||
<body>
|
||||
<!-- Hier die Links zu den gelösten Aufgaben einstellen, aktuelle oben, alte stehen lassen! Format: Aufgabenbezeichnung, Datum -->
|
||||
<a href="https://github.com/YamiDesu/GIS-SoSe-2020/issues" taget="_blank"> Github Reposiroty → Issues <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_04_2020-05-20/shop.html" target="_blank"> Aufgabe_04_2020-05-20 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_03_2020-05-13/portfolio.html" target="_blank"> Aufgabe_03_2020-05-13 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_02_2020-05-06/portfolio.html" target="_blank"> Aufgabe_02_2020-05-06 </a> &
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_02_2020-05-06/tags_used.html" target="_blank"> tags_used <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_01_2020-04-29/index.html" target="_blank"> Aufgabe_01_2020-04-29 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_00_2020-04-22/index.html" target="_blank"> Aufgabe_00_2020-04-22 <br> </a>
|
||||
|
||||
<a href="https://github.com/YamiDesu/GIS-SoSe-2020/issues" taget="_blank"> Github Reposiroty → Issues <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_05_2020-05-27/shop.html" target="_blank"> Aufgabe_05_2020-05-27 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_04_2020-05-20/shop.html" target="_blank"> Aufgabe_04_2020-05-20 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_03_2020-05-13/portfolio.html" target="_blank"> Aufgabe_03_2020-05-13 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_02_2020-05-06/portfolio.html" target="_blank"> Aufgabe_02_2020-05-06 </a> &
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_02_2020-05-06/tags_used.html" target="_blank"> tags_used <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_01_2020-04-29/index.html" target="_blank"> Aufgabe_01_2020-04-29 <br> </a>
|
||||
<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_00_2020-04-22/index.html" target="_blank"> Aufgabe_00_2020-04-22 <br> </a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
/* Basic Options */
|
||||
"target": "ESNEXT", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
|
||||
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
|
||||
// "lib": [], /* Specify library files to be included in the compilation. */
|
||||
// "allowJs": true, /* Allow javascript files to be compiled. */
|
||||
// "checkJs": true, /* Report errors in .js files. */
|
||||
// "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
|
||||
// "declaration": true, /* Generates corresponding '.d.ts' file. */
|
||||
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
|
||||
"sourceMap": true, /* Generates corresponding '.map' file. */
|
||||
//"outFile": "./build/EngineTest.js", /* Concatenate and emit output to single file. */
|
||||
// "outDir": "../build", /* Redirect output structure to the directory. */
|
||||
// "sourceRoot": "./src/",
|
||||
// "rootDir": "./src/", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
|
||||
// "composite": true, /* Enable project compilation */
|
||||
"removeComments": false, /* Do not emit comments to output. */
|
||||
// "noEmit": true, /* Do not emit outputs. */
|
||||
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
|
||||
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
|
||||
// "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
|
||||
|
||||
/* Strict Type-Checking Options */
|
||||
//"strict": true, /* Enable all strict type-checking options. */
|
||||
"noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
|
||||
"strictNullChecks": true, /* Enable strict null checks. */
|
||||
"strictFunctionTypes": true, /* Enable strict checking of function types. */
|
||||
"strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
|
||||
// "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
|
||||
"noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
|
||||
"alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
|
||||
|
||||
/* Additional Checks */
|
||||
"noUnusedLocals": true, /* Report errors on unused locals. */
|
||||
"noUnusedParameters": true, /* Report errors on unused parameters. */
|
||||
"noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
|
||||
"noFallthroughCasesInSwitch": false, /* Report errors for fallthrough cases in switch statement. */
|
||||
|
||||
/* Module Resolution Options */
|
||||
"moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
|
||||
// "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
|
||||
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
|
||||
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
|
||||
// "typeRoots": [], /* List of folders to include type definitions from. */
|
||||
// "types": [], /* Type declaration files to be included in compilation. */
|
||||
// "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
|
||||
//"esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
|
||||
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
|
||||
|
||||
/* Source Map Options */
|
||||
// "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
|
||||
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
||||
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
|
||||
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
|
||||
|
||||
/* Experimental Options */
|
||||
// "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
|
||||
// "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
{
|
||||
"rules": {
|
||||
"align": [true, "parameters", "arguments", "statements"],
|
||||
"ban": false,
|
||||
"class-name": true,
|
||||
"comment-format": [false, "check-space", "check-lowercase"],
|
||||
"curly": false,
|
||||
"eofline": false,
|
||||
"forin": false,
|
||||
"indent": [true, "spaces", 2],
|
||||
"interface-name": false,
|
||||
"jsdoc-format": false,
|
||||
"label-position": true,
|
||||
"max-line-length": [false, 140],
|
||||
"member-ordering": [true, {"order": "fields-first"}],
|
||||
"no-any": true,
|
||||
"no-arg": true,
|
||||
"no-bitwise": false,
|
||||
"no-console": [false, "debug", "info", "time", "timeEnd", "trace"],
|
||||
"no-construct": true,
|
||||
"no-parameter-properties": true,
|
||||
"no-debugger": false,
|
||||
"no-duplicate-variable": true,
|
||||
"no-empty": true,
|
||||
"no-eval": true,
|
||||
"no-string-literal": false,
|
||||
"no-switch-case-fall-through": false,
|
||||
"trailing-comma": [true, {
|
||||
"singleline": "never",
|
||||
"multiline": "never"
|
||||
}
|
||||
],
|
||||
"no-trailing-whitespace": false,
|
||||
"no-unused-expression": true,
|
||||
"no-unused-variable": true,
|
||||
"no-use-before-declare": true,
|
||||
"no-var-requires": false,
|
||||
"no-conditional-assignment": true,
|
||||
"no-shadowed-variable": false,
|
||||
"one-line": [true, "check-open-brace", "check-catch", "check-whitespace"],
|
||||
"quotemark": [true, "double"],
|
||||
"radix": false,
|
||||
"semicolon": true,
|
||||
"switch-default": false,
|
||||
"triple-equals": [false, "allow-null-check"],
|
||||
"typedef": [true, "call-signature", "parameter", "property-declaration", "variable-declaration", "member-variable-declaration"],
|
||||
"typedef-whitespace": [true, {
|
||||
"call-signature": "nospace",
|
||||
"index-signature": "nospace",
|
||||
"parameter": "nospace",
|
||||
"property-declaration": "nospace",
|
||||
"variable-declaration": "nospace"
|
||||
}
|
||||
],
|
||||
"use-strict": [false, "check-module", "check-function"],
|
||||
"variable-name": [true, "check-format", "allow-leading-underscore"],
|
||||
"whitespace": [true, "check-branch", "check-decl", "check-operator", "check-separator", "check-type"],
|
||||
"file-header": [false, ""]
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue