From 745a63103409e57f6371273f612839ef987552ae Mon Sep 17 00:00:00 2001
From: Sascha Schulz <sschulz@dh-software.de>
Date: Mo, 05 Feb 2024 12:38:14 +0100
Subject: [PATCH] add card component exercise
---
templates/web-components/card-component.js | 15 +++++++++++++++
templates/web-components/card-component.html | 13 +++++++++++++
2 files changed, 28 insertions(+), 0 deletions(-)
diff --git a/templates/web-components/card-component.html b/templates/web-components/card-component.html
new file mode 100644
index 0000000..16d1278
--- /dev/null
+++ b/templates/web-components/card-component.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8">
+ <title>Card Component</title>
+ <script defer src="card-component.js"></script>
+ </head>
+ <body>
+ <card-component>
+ <!-- title and content-->
+ </card-component>
+ </body>
+</html>
diff --git a/templates/web-components/card-component.js b/templates/web-components/card-component.js
new file mode 100644
index 0000000..abd10c9
--- /dev/null
+++ b/templates/web-components/card-component.js
@@ -0,0 +1,15 @@
+class CardComponent extends HTMLElement {
+ constructor() {
+ super();
+
+ const shadowRoot = this.attachShadow({mode: "open"});
+
+ shadowRoot.innerHTML = `
+ <!-- style -->
+
+ <!-- html -->
+ `;
+ }
+}
+
+window.customElements.define("card-component", CardComponent);
--
Gitblit v1.9.3