From 1d11cdbef91bb1623a02515f3894f9658645baf2 Mon Sep 17 00:00:00 2001
From: Subliminal Guy <subliminal_kid@posteo.de>
Date: Wed, 5 Feb 2025 17:11:37 +0100
Subject: [PATCH] Add Minimal Data Fetching
---
index.js | 20 +++++++++++++++++++-
style.css | 11 +++++++++++
2 files changed, 30 insertions(+), 1 deletion(-)
diff --git a/index.js b/index.js
index a1ef507..2da89b2 100644
--- a/index.js
+++ b/index.js
@@ -4,7 +4,25 @@ import data from "./helper/data.js";
const button = document.getElementsByClassName("main-button")[0];
button.addEventListener("click", () => {
- console.log(data);
+
+ const existingDiv = document.getElementsByClassName("user-data")[0];
+
+ if (existingDiv) {
+ existingDiv.remove();
+ }
+
+ else {
+ const userDate = document.createElement("div");
+ userDate.className = "user-data";
+
+ userDate.innerHTML = `
+ <h1>${data[0].name}</h1>
+ <p>${data[0].username}</p>
+ <p>${data[0].email}</p>
+`;
+
+ document.body.appendChild(userDate);
+ }
});
diff --git a/style.css b/style.css
index 3641879..c64aac4 100644
--- a/style.css
+++ b/style.css
@@ -3,6 +3,17 @@ body {
margin: 0;
background: deepskyblue;
display: flex;
+ flex-direction: column;
justify-content: center;
align-items: center;
}
+
+.user-data {
+ background: white;
+ padding: 20px;
+ border-radius: 5px;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+ justify-content: center;
+ margin-top: 20px;
+ color: navy;
+}
\ No newline at end of file
--
GitLab