Variable Buttons

Padding, width, height, text are optional, if not set there are default values (no css)
2023-04-27 18:58:41 +02:00
parent 1d087d7996
commit 09e0e006ec
4 changed files with 17369 additions and 17349 deletions
@@ -1,15 +1,28 @@
-import "../App.css"
-
-export default function Button(p) {
-
-
-    return (
-        <button className={"default-button round-border-10 font font-middle"}
-                style={{
-                    paddingTop: p.PaddingY,
-                    paddingBottom: p.PaddingY,
-                    paddingLeft: p.PaddingX,
-                    paddingRight: p.PaddingX
-                }}>{p.text}</button>
-    );
+import "../App.css"
+
+export default function Button(p) {
+
+    let text = p.text;
+    let paddingY = p.paddingY, paddingX = p.paddingX;
+    let width = p.width, height = p.height;
+    let color = p.color;
+
+    if (paddingY == null) paddingY = 10;
+    if (paddingX == null) paddingX = 20;
+    if (height == null) height = 50;
+    if (width == null) width = 100;
+
+
+    return (
+        <button className={"default-button round-border font font-middle"}
+                style={{
+                    paddingTop: paddingY,
+                    paddingBottom: paddingY,
+                    paddingLeft: paddingX,
+                    paddingRight: paddingX,
+                    width: width,
+                    height: height,
+                    color: color
+                }}>{text}</button>
+    );
 }