From 0b0bd1e14bfec0e6351d0acbd0a24be7667719e0 Mon Sep 17 00:00:00 2001 From: Savanni D'Gerinel Date: Thu, 11 May 2023 10:32:48 -0400 Subject: [PATCH] Create the GoBoard custom element There's nothing in it, but it's still present --- kifu/kifu-pwa/src/components/Board.ts | 22 ++++++++++++++++ kifu/kifu-pwa/src/converter.css | 38 --------------------------- kifu/kifu-pwa/src/index.html | 24 +++-------------- kifu/kifu-pwa/src/kifu.css | 15 +++++++++++ kifu/kifu-pwa/src/main.ts | 19 ++++++++++++++ kifu/kifu-pwa/{ => src}/manifest.json | 0 kifu/kifu-pwa/webpack.config.js | 3 ++- 7 files changed, 62 insertions(+), 59 deletions(-) create mode 100644 kifu/kifu-pwa/src/components/Board.ts delete mode 100644 kifu/kifu-pwa/src/converter.css create mode 100644 kifu/kifu-pwa/src/kifu.css rename kifu/kifu-pwa/{ => src}/manifest.json (100%) diff --git a/kifu/kifu-pwa/src/components/Board.ts b/kifu/kifu-pwa/src/components/Board.ts new file mode 100644 index 0000000..ced024a --- /dev/null +++ b/kifu/kifu-pwa/src/components/Board.ts @@ -0,0 +1,22 @@ +export class GoBoard extends HTMLCanvasElement { + static get observedAttributes() { + return []; + } + + constructor() { + super(); + + console.log("Go Board constructor"); + } + + connectedCallback() { + console.log("connected callback"); + const ctx = this.getContext("2d"); + if (!ctx) { + alert("could not get the canvas context"); + return; + } + ctx.fillStyle = "green"; + ctx.fillRect(10, 10, 150, 150); + } +} diff --git a/kifu/kifu-pwa/src/converter.css b/kifu/kifu-pwa/src/converter.css deleted file mode 100644 index 401fef8..0000000 --- a/kifu/kifu-pwa/src/converter.css +++ /dev/null @@ -1,38 +0,0 @@ -html { - background: rgb(243, 243, 243); - font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; - font-size: 15pt; -} - -html, body { - height: 100%; - margin: 0; -} - -body { - display: grid; - place-items: center; -} - -#converter { - width: 15rem; - padding: 2rem; - border-radius: .5rem; - box-shadow: 0 0 2rem 0 #0001; - display: flex; - flex-direction: column; - align-items: center; -} - -#converter input, #converter select { - font-family: inherit; - font-size: inherit; - margin-block-end: 1rem; - text-align: center; - width: 10rem; -} - -#converter #output-temp { - font-size: 2rem; - font-weight: bold; -} diff --git a/kifu/kifu-pwa/src/index.html b/kifu/kifu-pwa/src/index.html index b04b82d..eabcd1b 100644 --- a/kifu/kifu-pwa/src/index.html +++ b/kifu/kifu-pwa/src/index.html @@ -3,29 +3,13 @@ - - Temperature converter + + Kifu -

Temperature Converter

-
- - - - - - - 68 F -
+

Kifu

+