feat(layout.tsx): added Dynamic Title (#230)

Author: saisrikardumpeti

apps/website/src/routes/docs/layout.tsx

@@ -1,4 +1,5 @@
 import { component$, Slot, useContext } from '@builder.io/qwik';
+import { DocumentHead } from '@builder.io/qwik-city';
 import { MaterialProvider } from '../../components/material';
 import { Menu } from '../../components/menu/menu';
 import { APP_STATE } from '../../constants';
@@ -27,3 +28,19 @@ export default component$(() => {
     </>
   );
 });
+
+export const head: DocumentHead = ({ url }) => {
+  const UrlPathList = url.pathname.split('/').filter((path) => path !== '');
+  if (UrlPathList.length === 3) {
+    const Component =
+      UrlPathList[2].charAt(0).toUpperCase() + UrlPathList[2].slice(1);
+    const ComponentTheme =
+      UrlPathList[1].charAt(0).toUpperCase() + UrlPathList[1].slice(1);
+    return {
+      title: `${Component} | ${ComponentTheme} | QwikUI`,
+    };
+  }
+  return {
+    title: `Docs | QwikUI`,
+  };
+};