Added ability to set icons on bookmarks. Added hover indicator for apps

client/src/components/Apps/AppCard/AppCard.module.css

@@ -27,4 +27,16 @@
   font-weight: 400;
   font-size: 0.8em;
   opacity: 1;
+}
+
+@media (min-width: 500px) {
+  .AppCard {
+    padding: 2px;
+    border-radius: 4px;
+    transition: all 0.10s;
+  }
+
+  .AppCard:hover {
+    background-color: rgba(0,0,0,0.2);
+  }
 }

client/src/components/Apps/AppCard/AppCard.tsx

@@ -2,6 +2,7 @@ import { Link } from 'react-router-dom';
 
 import classes from './AppCard.module.css';
 import Icon from '../../UI/Icons/Icon/Icon';
+import { iconParser } from '../../../utility/iconParser';
 
 import { App } from '../../../interfaces';
 
@@ -11,16 +12,6 @@ interface ComponentProps {
 }
 
 const AppCard = (props: ComponentProps): JSX.Element => {
-  const iconParser = (mdiName: string): string => {
-    let parsedName = mdiName
-      .split('-')
-      .map((word: string) => `${word[0].toUpperCase()}${word.slice(1)}`)
-      .join('');
-    parsedName = `mdi${parsedName}`;
-
-    return parsedName;
-  }
-
   const redirectHandler = (url: string): void => {
     window.open(url);
   }