feat(web-ui): add meet styled text (#886)

Co-authored-by: Johan Book <{ID}+{username}@users.noreply.github.com>

services/web-ui/src/features/blogs/pages/BlogPostListPage/BlogPostListPage.nav.tsx

@@ -1,6 +1,10 @@
 import { ReactElement, ReactNode } from "react";
 
+import { Typography } from "@mui/material";
+
 import { Nav } from "src/components/nav";
+import { CurrentOrganizationAvatar } from "src/components/nav/AppBar/CurrentOrganizationAvatar";
+import { config } from "src/config";
 
 interface BlogPostListPageNavProps {
   children: ReactNode;
@@ -9,5 +13,26 @@ interface BlogPostListPageNavProps {
 export function BlogPostListPageNav({
   children,
 }: BlogPostListPageNavProps): ReactElement {
-  return <Nav>{children}</Nav>;
+  const appBarContent = (
+    <>
+      <CurrentOrganizationAvatar />
+
+      <Typography
+        sx={(theme) => ({
+          background: `linear-gradient(to right, ${theme.palette.primary.main}, ${theme.palette.secondary.main})`,
+          backgroundClip: "text",
+          color: "transparent",
+          fontFamily: "sans-serif",
+          fontWeight: 600,
+          ml: 3,
+          textShadow: "1px 1px 1px white",
+        })}
+        variant="h5"
+      >
+        {config.APP.NAME}
+      </Typography>
+    </>
+  );
+
+  return <Nav appBarContent={appBarContent}>{children}</Nav>;
 }