From 47fd5c7458746d7e05af59a9e917d80e378c0645 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 14:37:17 -0600 Subject: [PATCH 001/122] core: rearrange navigation and put main projects in a single row --- default.css | 11 +++++++++++ index.html | 24 ++++++++++++++---------- 2 files changed, 25 insertions(+), 10 deletions(-) diff --git a/default.css b/default.css index 90107a7..cf6e7eb 100644 --- a/default.css +++ b/default.css @@ -22,6 +22,7 @@ body { padding: 8px; line-height: 21px; display: inline-block; + text-align: right; } #top { @@ -34,9 +35,19 @@ body { } #main { + margin: 0px 120px; + display: flex; /*background: #1e2030;*/ } +.canvas { + width: 780px; + height: 600px; + align-items: center; + justify-content: center; + display: flex; +} + .cardStats { font-size: 18px; } diff --git a/index.html b/index.html index a399945..b1eb112 100644 --- a/index.html +++ b/index.html @@ -7,20 +7,22 @@

Pong

- - - -

Left Paddle Height:

Right Paddle Height:

@@ -28,8 +30,10 @@

Snake

- - +
+ + +

Snake Head Location:

Food Location:

View Code -- 2.45.2 From 343af77bd1ec987330441926d968d1aa8fa7f80a Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:20:56 -0600 Subject: [PATCH 002/122] snake: make game resizable by user --- index.html | 6 ++++++ src/snake.ts | 17 ++++++++++++++++- 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index b1eb112..0724c96 100644 --- a/index.html +++ b/index.html @@ -34,6 +34,12 @@
+

+ Adjust game size -- Width: + + Height: + +

Snake Head Location:

Food Location:

View Code diff --git a/src/snake.ts b/src/snake.ts index 236ac7d..871b9ec 100644 --- a/src/snake.ts +++ b/src/snake.ts @@ -169,6 +169,21 @@ class SnakeCore { document.getElementById("snakeHead").innerHTML = "x: " + this.body[this.body.length - 1].x + " y: " + this.body[this.body.length - 1].y; document.getElementById("snakeFood").innerHTML = "x: " + this.food.x + " y: " + this.food.y ; } + + // Update width and height from page to match game + getPageNumbers() { + let specifiedWidth = parseInt((document.getElementById("snakeWidth") as HTMLInputElement).value); + let specifiedHeight = parseInt((document.getElementById("snakeHeight") as HTMLInputElement).value); + if (this.width == specifiedWidth && this.height == specifiedHeight) + return false; + this.width = specifiedWidth; + this.height = specifiedHeight; + while (this.height > this.board.length) + this.board.push(new Array(this.width)); + this.canvas.setAttribute("width", String(specifiedWidth * this.grid)); + this.canvas.setAttribute("height", String(specifiedHeight * this.grid)); + return true; + } } class Bot { @@ -270,7 +285,7 @@ const g_snakebot: Bot = new Bot(); // game loop function snakeloop() { // Reset of needed - if (g_snake.gameover) + if (g_snake.gameover || g_snake.getPageNumbers()) g_snake.reset(); // Simulate movement of snake -- 2.45.2 From f1346a628ccc5a3ad74dc381169edaeedb1d633b Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:34:53 -0600 Subject: [PATCH 003/122] core: make entire card same border radius --- default.css | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/default.css b/default.css index cf6e7eb..08efe3c 100644 --- a/default.css +++ b/default.css @@ -132,9 +132,7 @@ a.button { .card { background: #363a4f; text-align: center; - border-radius: 6px; - border-top-left-radius: 18px; - border-top-right-radius: 18px; + border-radius: 18px; animation: card 3s linear infinite; width: 800px; height: 800px; -- 2.45.2 From c27b5c0ea98db1d5c641445534d99c6cea99ab6c Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:37:20 -0600 Subject: [PATCH 004/122] core: remove background color on nav bar --- default.css | 3 --- 1 file changed, 3 deletions(-) diff --git a/default.css b/default.css index 08efe3c..4ad4495 100644 --- a/default.css +++ b/default.css @@ -10,10 +10,7 @@ body { } #navigation { - background: #181926; display: flex; - border-bottom-left-radius: 18px; - border-bottom-right-radius: 18px; } .navItem { -- 2.45.2 From f3a5359a845fd63c47a8572a03a005edb9008f56 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:43:19 -0600 Subject: [PATCH 005/122] core: restyle catppuccin-macchiato to catppuccin-latte --- default.css | 29 ++++++++++++++--------------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/default.css b/default.css index 4ad4495..b5d8a20 100644 --- a/default.css +++ b/default.css @@ -1,11 +1,11 @@ body { font-family: Arial, sans-serif; font-size: 14px; - color: #cad3f5; + color: #4c4f69; line-height: 1.5; max-width: 1920px; margin-inline: auto; - background: #24273a; + background: #eff1f5; margin: 0px auto; } @@ -34,7 +34,6 @@ body { #main { margin: 0px 120px; display: flex; - /*background: #1e2030;*/ } .canvas { @@ -102,32 +101,32 @@ a:hover, a:active { a.button { margin: 14px 10%; padding: 4px 12px; - border: 1px outset #494d64; + border: 1px outset #bcc0cc; border-radius: 9px; - color: #8aadf4; + color: #1e66f5; display: inline-block; - background-color: #363a4f; + background-color: #ccd0da; text-decoration: none; width: 80px; text-align: center; } @keyframes hover { - 0% { box-shadow: 0 0 8px 4px #24273a; } - 15% { box-shadow: 0 0 8px 4px #494d64; } - 50% { box-shadow: 0 0 8px 4px #b7bdf8; } - 85% { box-shadow: 0 0 8px 4px #494d64; } - 100% { box-shadow: 0 0 8px 4px #24273a; } + 0% { box-shadow: 0 0 8px 4px #eff1f5; } + 15% { box-shadow: 0 0 8px 4px #bcc0cc; } + 50% { box-shadow: 0 0 8px 4px #7287fd; } + 85% { box-shadow: 0 0 8px 4px #bcc0cc; } + 100% { box-shadow: 0 0 8px 4px #eff1f5; } } @keyframes card { - 0% { box-shadow: 0 0 8px 4px #24273a; } + 0% { box-shadow: 0 0 8px 4px #eff1f5; } 50% { box-shadow: 0 0 8px 4px #df8e1d; } - 100% { box-shadow: 0 0 8px 4px #24273a; } + 100% { box-shadow: 0 0 8px 4px #eff1f5; } } .card { - background: #363a4f; + background: #ccd0da; text-align: center; border-radius: 18px; animation: card 3s linear infinite; @@ -139,7 +138,7 @@ a.button { } .cardTop { - background: #1e2030; + background: #e6e9ef; border-top-left-radius: 18px; border-top-right-radius: 18px; } -- 2.45.2 From b4ef84bc04407960d4216328792a2a73dff4ae1b Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:46:29 -0600 Subject: [PATCH 006/122] nav: increase padding and make text bold --- default.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/default.css b/default.css index b5d8a20..777914d 100644 --- a/default.css +++ b/default.css @@ -16,10 +16,11 @@ body { .navItem { margin: 6px; margin-top: 0px; - padding: 8px; + padding: 16px; line-height: 21px; display: inline-block; text-align: right; + font-weight: bold; } #top { -- 2.45.2 From 97f832de2299c8ef89e62dc7e373b0294479850a Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 15:49:19 -0600 Subject: [PATCH 007/122] card: match top text color --- default.css | 1 - 1 file changed, 1 deletion(-) diff --git a/default.css b/default.css index 777914d..0b40e10 100644 --- a/default.css +++ b/default.css @@ -61,7 +61,6 @@ h1 { } h2 { - color: #6c6f85; font-size: 1.8rem; text-align: center; margin-top: 0; -- 2.45.2 From 9c3539ebeff67d290bb82517603863284fe60355 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 17:06:50 -0600 Subject: [PATCH 008/122] nav: move padding to bar instead of items --- default.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/default.css b/default.css index 0b40e10..aab40da 100644 --- a/default.css +++ b/default.css @@ -11,12 +11,12 @@ body { #navigation { display: flex; + padding: 16px; } .navItem { margin: 6px; margin-top: 0px; - padding: 16px; line-height: 21px; display: inline-block; text-align: right; -- 2.45.2 From 028ef8df27d0f915bf9ec6626f7a473b83d8cd76 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 17:12:30 -0600 Subject: [PATCH 009/122] nav: reintroduce background and add border to items --- default.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/default.css b/default.css index aab40da..03f9bd1 100644 --- a/default.css +++ b/default.css @@ -10,6 +10,7 @@ body { } #navigation { + background: #dce0e8; display: flex; padding: 16px; } @@ -21,6 +22,7 @@ body { display: inline-block; text-align: right; font-weight: bold; + border: 1px solid #4c4f69; } #top { -- 2.45.2 From 95bba8bde199f0de477c2cb0e0c2b834f514e4d7 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 17:14:00 -0600 Subject: [PATCH 010/122] nav: add radius to border --- default.css | 1 + 1 file changed, 1 insertion(+) diff --git a/default.css b/default.css index 03f9bd1..b4f00e5 100644 --- a/default.css +++ b/default.css @@ -23,6 +23,7 @@ body { text-align: right; font-weight: bold; border: 1px solid #4c4f69; + border-radius: 12px; } #top { -- 2.45.2 From c10676064de345c7cd27d363ce1f96041647728e Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:13:39 -0600 Subject: [PATCH 011/122] navbar: fix padding issues --- default.css | 2 +- index.html | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/default.css b/default.css index b4f00e5..28a4e32 100644 --- a/default.css +++ b/default.css @@ -18,6 +18,7 @@ body { .navItem { margin: 6px; margin-top: 0px; + padding: 8px; line-height: 21px; display: inline-block; text-align: right; @@ -90,7 +91,6 @@ p { a { text-decoration: none; - padding: 8px; color: #8aadf4; } diff --git a/index.html b/index.html index 0724c96..9600d53 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,9 @@ -- 2.45.2 From e330c9ab081c01b35fd4ab11ab60eb230b76e3fc Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:16:24 -0600 Subject: [PATCH 012/122] navbar: adjust left size styling, especially since not a button --- default.css | 6 ++++++ index.html | 4 +--- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/default.css b/default.css index 28a4e32..ba4aa02 100644 --- a/default.css +++ b/default.css @@ -15,6 +15,12 @@ body { padding: 16px; } +#navBarLeft { + text-align: left; + flex-grow: 1; + font-size: 18px; +} + .navItem { margin: 6px; margin-top: 0px; diff --git a/index.html b/index.html index 9600d53..df95f02 100644 --- a/index.html +++ b/index.html @@ -7,9 +7,7 @@ -- 2.45.2 From c856505bb4d4a1cc2272c1e4180a435ed5cf2dde Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:19:22 -0600 Subject: [PATCH 013/122] navbar: increase font size of name --- default.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/default.css b/default.css index ba4aa02..cb89d44 100644 --- a/default.css +++ b/default.css @@ -18,7 +18,7 @@ body { #navBarLeft { text-align: left; flex-grow: 1; - font-size: 18px; + font-size: 24px; } .navItem { -- 2.45.2 From 68b7d66f2dd0a920c85db6317314f2098472abe7 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:22:49 -0600 Subject: [PATCH 014/122] body: only do single line if it could fit --- default.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/default.css b/default.css index cb89d44..b74244c 100644 --- a/default.css +++ b/default.css @@ -44,7 +44,9 @@ body { #main { margin: 0px 120px; - display: flex; + @media (min-width: 1920px) { + display: flex; + } } .canvas { -- 2.45.2 From 794a1c23d02e660f53240bf207cc72bbf8b24510 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:30:51 -0600 Subject: [PATCH 015/122] navbar: set fixed to top of screen --- default.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/default.css b/default.css index b74244c..5fbc040 100644 --- a/default.css +++ b/default.css @@ -7,12 +7,17 @@ body { margin-inline: auto; background: #eff1f5; margin: 0px auto; + padding-top: 80px; } #navigation { background: #dce0e8; display: flex; padding: 16px; + position: fixed; + top: 0px; + left: 0px; + right: 0px; } #navBarLeft { -- 2.45.2 From ad7d7e1c85ee01550fd08c31e0c7d9b3af9c4bf5 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:35:59 -0600 Subject: [PATCH 016/122] canvas: fix margin gaps --- default.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/default.css b/default.css index 5fbc040..fae15a4 100644 --- a/default.css +++ b/default.css @@ -59,7 +59,7 @@ body { height: 600px; align-items: center; justify-content: center; - display: flex; + margin: auto; } .cardStats { -- 2.45.2 From 8e839e4efd9d6d228458007bd6f5611727b92816 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:40:22 -0600 Subject: [PATCH 017/122] canvas: fix the canvas element usage of space --- default.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/default.css b/default.css index fae15a4..77350ef 100644 --- a/default.css +++ b/default.css @@ -10,6 +10,10 @@ body { padding-top: 80px; } +canvas { + margin: auto; +} + #navigation { background: #dce0e8; display: flex; -- 2.45.2 From c0f669d4195eaf7fd297ea8ebd2a2adcb4a051c1 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 18:51:11 -0600 Subject: [PATCH 018/122] navitem: increase border size --- default.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/default.css b/default.css index 77350ef..f9458a6 100644 --- a/default.css +++ b/default.css @@ -38,7 +38,7 @@ canvas { display: inline-block; text-align: right; font-weight: bold; - border: 1px solid #4c4f69; + border: 2px solid #4c4f69; border-radius: 12px; } -- 2.45.2 From 688a31cff979b79164de131f1f55265e5cc4b75c Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 19:05:28 -0600 Subject: [PATCH 019/122] navbar: potentially fix mobile spacing --- default.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/default.css b/default.css index f9458a6..de55a1d 100644 --- a/default.css +++ b/default.css @@ -16,7 +16,6 @@ canvas { #navigation { background: #dce0e8; - display: flex; padding: 16px; position: fixed; top: 0px; @@ -25,6 +24,7 @@ canvas { } #navBarLeft { + display: inline-block; text-align: left; flex-grow: 1; font-size: 24px; @@ -35,7 +35,6 @@ canvas { margin-top: 0px; padding: 8px; line-height: 21px; - display: inline-block; text-align: right; font-weight: bold; border: 2px solid #4c4f69; -- 2.45.2 From f00bc01ad76d7f6f04ce60488c726465bce54647 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 19:07:25 -0600 Subject: [PATCH 020/122] navbar: don't forget float --- default.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/default.css b/default.css index de55a1d..b5041aa 100644 --- a/default.css +++ b/default.css @@ -21,12 +21,12 @@ canvas { top: 0px; left: 0px; right: 0px; + text-align: right; } #navBarLeft { - display: inline-block; + float: left; text-align: left; - flex-grow: 1; font-size: 24px; } -- 2.45.2 From 84643c765a5f35243443f50b164de1d1e69490a4 Mon Sep 17 00:00:00 2001 From: Trianta <56975502+Trimutex@users.noreply.github.com> Date: Mon, 25 Nov 2024 19:32:38 -0600 Subject: [PATCH 021/122] core: add meta viewport tag --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index df95f02..8718e36 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,7 @@ Trianta +