Added files for 1. ZH

2026-04-15 22:07:56 +02:00
commit d80a95a395
3 changed files with 167 additions and 0 deletions
--- a/index.html
+++ b/index.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <h1>Jó lesz oldal</h1>
+    <button id="sotet">Sötét mód</button>
+    <input type="text" id="nev" name="nev" placeholder="neved">
+    <input type="email" id="email" name="email" placeholder="email">
+    <input type="submit" id="submit" name="kuldes">
+
+    <div id="employees">
+
+    </div>
+
+    <div id="output">
+
+    </div>
+
+
+
+
+
+
+
+
+
+
+    <div class="card" style="width: 18rem;">
+
+
+
+    <img src="https://picsum.photos/200" class="card-img-top" alt="kép">
+
+    <div class="card-body">
+        <h5 class="card-title">Card title</h5>
+        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card’s content.</p>
+        <a href="#" class="btn btn-primary">Go somewhere</a>
+    </div>
+    </div>
+    <hr>
+    <table class="table table-primary table-striped">
+        <tr>
+            <td><p>asd</p></td>
+        </tr>
+        <tr>
+            <td><p>asd2</p></td>
+        </tr>
+        
+    </table>
+    <script src="script.js"></script>
+
+    <img class="kep" src="https://images.trvl-media.com/localexpert/1790496/71d84da1-ebdb-49a6-a1e2-75936c03475f.jpg?impolicy=resizecrop&rw=1005&rh=565">
+    <img src="https://images.trvl-media.com/localexpert/1790496/71d84da1-ebdb-49a6-a1e2-75936c03475f.jpg?impolicy=resizecrop&rw=1005&rh=565">
+
+    <p id="szoveges">asdasdasdfgnjdgndjk</p>
+</body>
+</html>
--- a/script.js
+++ b/script.js
@@ -0,0 +1,82 @@
+let json = {
+  "companies": [
+    {
+      "name": "TechCorp",
+      "location": "Budapest",
+      "employees": [
+        {
+          "id": 1,
+          "name": "Alice",
+          "email": "alice@email.com"
+        },
+        {
+          "id": 2,
+          "name": "Bob",
+          "email": "bob@email.com"
+        }
+      ]
+    },
+    {
+      "name": "DesignHub",
+      "location": "Vienna",
+      "employees": [
+        {
+          "id": 1,
+          "name": "Alice",
+          "email": "alice@email.com"
+        },
+        {
+          "id": 3,
+          "name": "Emma",
+          "email": "emma@email.com"
+        }
+      ]
+    }
+  ]
+}
+
+LoadEmployees(json);
+
+function LoadEmployees(data) {
+    let parent = document.getElementById("employees");
+    employees.innerHTML = '';
+    data.companies.forEach(company => {
+        let companydiv = document.createElement("div");
+        let description = document.createElement("h2");
+        description.innerHTML = company.name + "Employees:";
+        companydiv.appendChild(description);
+        company.employees.forEach(person => {
+            let employeediv = document.createElement("div");
+            let employeedesc = document.createElement("p");
+            employeedesc.innerHTML = person.name + ' (' + person.email + ')';
+            employeediv.appendChild(employeedesc);
+            companydiv.appendChild(employeediv);
+        });
+        parent.appendChild(companydiv);
+    });
+}
+
+function SaveEmployee() {
+    let name = document.getElementById('nev').value;
+    let email = document.getElementById('email').value;
+    json.companies[1].employees.push({id: 43, name: name, email: email});
+    LoadEmployees(json);
+}
+
+document.getElementById('submit').addEventListener("click", SaveEmployee);
+
+console.log(json.companies.filter(x => x.employees.length > 1).length);
+
+console.log(json.companies.filter(x => x.name.startsWith('T')).map(x => x.name));
+
+
+
+console.log(json.companies.reduce((sum, company) => sum + company.employees.length, 0) / json.companies.length);
+
+
+function Sotetites() {
+    let hatter = document.querySelector("body");
+    hatter.classList.toggle("sotet");
+}
+
+document.getElementById('sotet').addEventListener("click", Sotetites);
--- a/style.css
+++ b/style.css
@@ -0,0 +1,22 @@
+.kep {
+    border-radius: 30px;
+}
+
+.kep:hover {
+    border-radius: 100px;
+}
+
+img {
+    border: 100px;
+}
+
+#szoveges {
+    border: 20px solid orange;
+    padding: 10px 20px 30px 40px;   
+    /* TOP RIGHT BOTTOM LEFT */
+    margin: 40px 30px 20px 10px;
+}
+
+.sotet {
+    background-color: #777;
+}