From 5d5f37345875e1ca9e2fd02b6279d0327cff86a7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Magalh=C3=A3es?= <joamag@gmail.com>
Date: Mon, 31 Oct 2022 10:24:52 +0000
Subject: [PATCH] feat: more gameboy resources
---
examples/web/react/components/keyboard-gb/dpad.svg | 1 +
examples/web/react/components/keyboard-gb/keyboard-gb.css | 4 ++++
examples/web/react/components/keyboard-gb/keyboard-gb.tsx | 4 +++-
3 files changed, 8 insertions(+), 1 deletion(-)
create mode 100644 examples/web/react/components/keyboard-gb/dpad.svg
diff --git a/examples/web/react/components/keyboard-gb/dpad.svg b/examples/web/react/components/keyboard-gb/dpad.svg
new file mode 100644
index 00000000..8115b917
--- /dev/null
+++ b/examples/web/react/components/keyboard-gb/dpad.svg
@@ -0,0 +1 @@
+<svg width="700pt" height="700pt" version="1.1" viewBox="0 0 700 700" fill="#ffffff" stroke="#ffffff" xmlns="http://www.w3.org/2000/svg"><path d="m338.45 240.62c3.1953 2.8047 7.3008 4.3516 11.551 4.3516s8.3555-1.5469 11.551-4.3516l78.75-70c3.7773-3.3164 5.9414-8.0977 5.9492-13.125v-105c0-4.6406-1.8438-9.0938-5.125-12.375s-7.7344-5.125-12.375-5.125h-157.5c-4.6406 0-9.0938 1.8438-12.375 5.125s-5.125 7.7344-5.125 12.375v105c0.007812 5.0273 2.1719 9.8086 5.9492 13.125zm-49.699-170.62h122.5v79.625l-61.25 54.426-61.25-54.426zm72.801 249.38c-3.1953-2.8047-7.3008-4.3516-11.551-4.3516s-8.3555 1.5469-11.551 4.3516l-78.75 70c-3.7773 3.3164-5.9414 8.0977-5.9492 13.125v105c0 4.6406 1.8438 9.0938 5.125 12.375s7.7344 5.125 12.375 5.125h157.5c4.6406 0 9.0938-1.8438 12.375-5.125s5.125-7.7344 5.125-12.375v-105c-0.007812-5.0273-2.1719-9.8086-5.9492-13.125zm49.699 170.62h-122.5v-79.625l61.25-54.426 61.25 54.426zm-100.62-221.55-70-78.75c-3.3164-3.7773-8.0977-5.9414-13.125-5.9492h-105c-4.6406 0-9.0938 1.8438-12.375 5.125s-5.125 7.7344-5.125 12.375v157.5c0 4.6406 1.8438 9.0938 5.125 12.375s7.7344 5.125 12.375 5.125h105c5.0273-0.007812 9.8086-2.1719 13.125-5.9492l70-78.75c2.8047-3.1953 4.3516-7.3008 4.3516-11.551s-1.5469-8.3555-4.3516-11.551zm-91 72.801h-79.625v-122.5h79.625l54.426 61.25zm357.88-157.5h-105c-5.0273 0.007812-9.8086 2.1719-13.125 5.9492l-70 78.75c-2.8047 3.1953-4.3516 7.3008-4.3516 11.551s1.5469 8.3555 4.3516 11.551l70 78.75c3.3164 3.7773 8.0977 5.9414 13.125 5.9492h105c4.6406 0 9.0938-1.8438 12.375-5.125s5.125-7.7344 5.125-12.375v-157.5c0-4.6406-1.8438-9.0938-5.125-12.375s-7.7344-5.125-12.375-5.125zm-17.5 157.5h-79.625l-54.426-61.25 54.426-61.25h79.625z"/></svg>
diff --git a/examples/web/react/components/keyboard-gb/keyboard-gb.css b/examples/web/react/components/keyboard-gb/keyboard-gb.css
index a17545f6..56f4b8da 100644
--- a/examples/web/react/components/keyboard-gb/keyboard-gb.css
+++ b/examples/web/react/components/keyboard-gb/keyboard-gb.css
@@ -53,3 +53,7 @@
.keyboard-gb .key:active {
background-color: #2a9d8f;
}
+
+.keyboard-gb .dpad {
+ width: 120px;
+}
diff --git a/examples/web/react/components/keyboard-gb/keyboard-gb.tsx b/examples/web/react/components/keyboard-gb/keyboard-gb.tsx
index e63f1018..4a338965 100644
--- a/examples/web/react/components/keyboard-gb/keyboard-gb.tsx
+++ b/examples/web/react/components/keyboard-gb/keyboard-gb.tsx
@@ -2,6 +2,8 @@ import React, { FC } from "react";
import "./keyboard-gb.css";
+declare const require: any;
+
type KeyboardGBProps = {
style?: string[];
onKeyDown?: (key: string) => void;
@@ -23,7 +25,7 @@ export const KeyboardGB: FC<KeyboardGBProps> = ({ style = [], onKeyDown }) => {
return (
<div className={classes()}>
<div className="keyboard-line">
- {["1", "2", "3", "4"].map((k) => renderKey(k))}
+ <img className="dpad" src={require("./dpad.svg")} />
</div>
<div className="keyboard-line">
{["Q", "W", "E", "R"].map((k) => renderKey(k))}
--
GitLab