slanted-gamedev-toolz
Version:
A slanted mix of tools for your brilliant ideas in game design.
32 lines (31 loc) • 1.42 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { numberWithCommas } from "../../util/numberWithComma";
import { textOutline } from "../GameCard/GameCardSx";
export const MatchScore = ({ target, score }) => {
return (_jsxs("div", { style: {
borderBottom: "4px solid rgba(0,0,0,0.2)",
borderRadius: "2px",
textAlign: "center",
alignItems: "baseline",
display: "flex",
flexWrap: "wrap",
flexDirection: "row",
justifyContent: "center",
gap: "20px",
fontSize: "2em",
fontWeight: "bold",
...textOutline.white,
padding: 0,
margin: 0,
}, children: [_jsxs("div", { children: [_jsx("span", { style: {
fontSize: "0.6em",
color: "green",
}, children: "Total Cats:" }), _jsx("span", { style: {
color: "green",
}, children: ` ${numberWithCommas(score)}` })] }), _jsxs("div", { children: [_jsx("span", { style: {
color: "red",
fontSize: "0.6em",
}, children: "Target:" }), _jsx("span", { style: {
color: "red",
}, children: ` ${numberWithCommas(target)}` })] })] }));
};