Extracted cards in overview to their own component

src/servers/helpers/HighlightCard.scss

@@ -0,0 +1,13 @@
+@import '../../utils/base';
+
+.highlight-card.highlight-card {
+  text-align: center;
+  border-top: 3px solid var(--brand-color);
+  color: inherit;
+  text-decoration: none;
+}
+
+.highlight-card__title {
+  text-transform: uppercase;
+  color: $textPlaceholder;
+}

src/servers/helpers/HighlightCard.tsx

@@ -0,0 +1,16 @@
+import { FC } from 'react';
+import { Card, CardText, CardTitle } from 'reactstrap';
+import { Link } from 'react-router-dom';
+import './HighlightCard.scss';
+
+export interface HighlightCardProps {
+  title: string;
+  link?: string;
+}
+
+export const HighlightCard: FC<HighlightCardProps> = ({ children, title, link }) => (
+  <Card className="highlight-card" body {...(link && { tag: Link, to: link })}>
+    <CardTitle tag="h5" className="highlight-card__title">{title}</CardTitle>
+    <CardText tag="h2">{children}</CardText>
+  </Card>
+);