diff --git a/packages/app/src/components/app/play/ui/money/PixelFJVerdana12pt.woff b/packages/app/src/components/app/play/ui/money/PixelFJVerdana12pt.woff new file mode 100644 index 0000000..564e80b Binary files /dev/null and b/packages/app/src/components/app/play/ui/money/PixelFJVerdana12pt.woff differ diff --git a/packages/app/src/components/app/play/ui/money/index.jsx b/packages/app/src/components/app/play/ui/money/index.jsx index 84e07bb..885e77a 100644 --- a/packages/app/src/components/app/play/ui/money/index.jsx +++ b/packages/app/src/components/app/play/ui/money/index.jsx @@ -9,9 +9,13 @@ function Money({selfEntity}) { return (

- $ + + $ + {' '} - {formatted} + + {formatted} +

); diff --git a/packages/app/src/components/app/play/ui/money/index.module.scss b/packages/app/src/components/app/play/ui/money/index.module.scss index 68f4507..89c10e4 100644 --- a/packages/app/src/components/app/play/ui/money/index.module.scss +++ b/packages/app/src/components/app/play/ui/money/index.module.scss @@ -1,3 +1,8 @@ +@font-face { + font-family: 'PixelFJVerdana'; + src: url('./PixelFJVerdana12pt.woff'); +} + .money { color: black; font-size: 32px; @@ -14,13 +19,12 @@ border-radius: 5px; box-shadow: inset 0 0 5px black; display: inline-block; - font-family: monospace; - font-weight: bold; + height: 50px; padding: 10px 15px 10px 20px; position: relative; left: -25px; text-align: right; - top: -15px; + top: -12px; width: 160px; } @@ -35,6 +39,22 @@ width: calc(100% + 6px); } +.numberText { + --inner-shadow: rgb(196, 182, 103); + bottom: 2px; + font-family: PixelFJVerdana; + font-size: 0.5em; + font-weight: bold; + right: -8px; + position: relative; + text-shadow: + -1px -1px 0 var(--inner-shadow), + -1px 1px 0 var(--inner-shadow), + 1px -1px 0 var(--inner-shadow), + 1px 1px 0 var(--inner-shadow), + ; +} + .sign { background-color: #fff; border: 3px solid black;