Various minor style improvements

app/javascript/components/shared/CustomTexts.tsx

@@ -13,6 +13,10 @@ export const TitleText = ({ children }: Props) => (
   <span className="titleText">{children}</span>
 );
 
+export const BoxTitleText = ({ children }: Props) => (
+  <span className="boxTitleText">{children}</span>
+);
+
 export const MutedText = ({ children }: Props) => (
   <span className="mutedText">{children}</span>
 );

app/javascript/components/shared/PostBoardLabel.tsx

@@ -3,7 +3,7 @@ import * as React from 'react';
 import IBoard from '../../interfaces/IBoard';
 
 const PostBoardLabel = ({ name }: IBoard) => (
-  <span className="badge badgeLight">{name}</span>
+  <span className="badge badgeLight">{name?.toUpperCase()}</span>
 );
 
 export default PostBoardLabel;

app/javascript/components/shared/PostStatusLabel.tsx

@@ -9,7 +9,9 @@ const PostStatusLabel = ({
   name,
   color,
 }: Props) => (
-  <span className="badge" style={{backgroundColor: color, color: 'white'}}>{name}</span>
+  <span className="badge" style={{backgroundColor: color, color: 'white'}}>
+    {name?.toUpperCase()}
+  </span>
 );
 
 export default PostStatusLabel;

app/javascript/components/shared/Spinner.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
-const Spinner = () => (
-  <div className="spinner-grow d-block mx-auto" role="status">
+const Spinner = ({ color = 'dark' }) => (
+  <div className={`spinner-grow d-block mx-auto text-${color}`} role="status">
     <span className="sr-only">Loading...</span>
   </div>
 );