1 files changed, 26 insertions, 0 deletions
diff --git a/sw-ui/src/components/game/CardImage.tsx b/sw-ui/src/components/game/CardImage.tsx
new file mode 100644
index 00000000..a37595ad
--- /dev/null
+++ b/sw-ui/src/components/game/CardImage.tsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import { ApiCard } from '../../api/model';
+import './CardImage.css'
+
+type CardImageProps = {
+  card: ApiCard,
+  otherClasses: string,
+  highlightColor?: string
+}
+
+export const CardImage = ({card, otherClasses, highlightColor}: CardImageProps) => {
+  const style = highlightStyle(highlightColor);
+  return <img src={`/images/cards/${card.image}`}
+              title={card.name}
+              alt={'Card ' + card.name}
+              className={`card-img ${otherClasses}`}
+              style={style}/>
+};
+
+function highlightStyle(highlightColor?: string) {
+  if (highlightColor) {
+    return { boxShadow: `0 0 1rem 0.1rem ${highlightColor}` };
+  } else {
+    return {};
+  }
+}