feat: design applications and first api calls

Co-authored-by: Walid <87608619+WalidKorchi@users.noreply.github.com>

components/design/IconLink/IconLink.tsx

@@ -0,0 +1,32 @@
+import Link from 'next/link'
+import classNames from 'classnames'
+
+export interface IconLinkProps {
+  selected?: boolean
+  href: string
+  title?: string
+}
+
+export const IconLink: React.FC<IconLinkProps> = (props) => {
+  const { children, selected, href, title } = props
+
+  return (
+    <div className='w-full flex justify-center group'>
+      <Link href={href}>
+        <a className='w-full flex justify-center relative group' title={title}>
+          {children}
+          <div className='absolute flex items-center w-3 h-12 left-0'>
+            <span
+              className={classNames(
+                'absolute w-4/12 bg-green-700 rounded-r-lg group-hover:h-5',
+                {
+                  'h-full': selected
+                }
+              )}
+            ></span>
+          </div>
+        </a>
+      </Link>
+    </div>
+  )
+}