Button new Options
Options for Font Color
This commit is contained in:
@@ -18,6 +18,7 @@ export default function Button(p) {
|
|||||||
let iconWidth = p.iconWidth, iconHeight = p.iconHeight;
|
let iconWidth = p.iconWidth, iconHeight = p.iconHeight;
|
||||||
let onClick = p.onClick;
|
let onClick = p.onClick;
|
||||||
let color = p.color;
|
let color = p.color;
|
||||||
|
let fontColor = p.fontColor;
|
||||||
|
|
||||||
//if parameters are not set, they are set to default values
|
//if parameters are not set, they are set to default values
|
||||||
if (height == null) height = 50;
|
if (height == null) height = 50;
|
||||||
@@ -26,6 +27,7 @@ export default function Button(p) {
|
|||||||
if (iconHeight == null) iconHeight = height-10;
|
if (iconHeight == null) iconHeight = height-10;
|
||||||
if (onClick == null) onClick = () => {};
|
if (onClick == null) onClick = () => {};
|
||||||
if (color == null) color = "#363636";
|
if (color == null) color = "#363636";
|
||||||
|
if (fontColor == null) fontColor = "white";
|
||||||
|
|
||||||
//build in the icon width and height to the svg tag (svg tag should not contain any size information by default)
|
//build in the icon width and height to the svg tag (svg tag should not contain any size information by default)
|
||||||
if (iconHTML != null) {
|
if (iconHTML != null) {
|
||||||
@@ -45,7 +47,8 @@ export default function Button(p) {
|
|||||||
display: "flex",
|
display: "flex",
|
||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
justifyContent: "center",
|
justifyContent: "center",
|
||||||
backgroundColor: color
|
backgroundColor: color,
|
||||||
|
color: fontColor
|
||||||
}}
|
}}
|
||||||
onClick={onClick}>
|
onClick={onClick}>
|
||||||
{text}
|
{text}
|
||||||
|
|||||||
@@ -8,13 +8,6 @@
|
|||||||
--background-end-rgb: 255, 255, 255;
|
--background-end-rgb: 255, 255, 255;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
:root {
|
|
||||||
--foreground-rgb: 255, 255, 255;
|
|
||||||
--background-start-rgb: 0, 0, 0;
|
|
||||||
--background-end-rgb: 0, 0, 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
color: rgb(var(--foreground-rgb));
|
color: rgb(var(--foreground-rgb));
|
||||||
|
|||||||
Reference in New Issue
Block a user