khoj-ai · sabaimran · Jul 27, 2024 · Jul 12, 2024 · Jul 12, 2024 · Jul 13, 2024
diff --git a/src/interface/web/app/agents/agents.module.css b/src/interface/web/app/agents/agents.module.css
@@ -6,7 +6,7 @@ div.titleBar {
 .agentPersonality p {
     white-space: inherit;
     overflow: hidden;
-    height: 78px;
+    height: 77px;
     line-height: 1.5;
 }
 
@@ -16,6 +16,16 @@ div.agentPersonality {
     overflow: hidden;
 }
 
+div.sidePanel {
+    position: fixed;
+    height: 100%;
+}
+
+div.pageLayout {
+    display: grid;
+    grid-template-columns: auto 1fr;
+    gap: 1rem;
+}
 
 
 button.infoButton {
@@ -30,7 +40,7 @@ button.infoButton {
 div.agentList {
     display: grid;
     gap: 20px;
-    padding: 20px;
+    padding-top: 30px;
     margin-right: auto;
     grid-auto-flow: row;
     grid-template-columns: 1fr 1fr;
@@ -40,7 +50,7 @@ div.agentList {
 
 @media only screen and (max-width: 700px) {
     div.agentList {
-        width: 90%;
+        width: 100%;
         padding: 0;
         margin-right: auto;
         margin-left: auto;

diff --git a/src/interface/web/app/agents/agentsLayout.module.css b/src/interface/web/app/agents/agentsLayout.module.css
diff --git a/src/interface/web/app/agents/layout.tsx b/src/interface/web/app/agents/layout.tsx
@@ -1,13 +1,12 @@
-
 import type { Metadata } from "next";
-import NavMenu from '../components/navMenu/navMenu';
-import styles from './agentsLayout.module.css';
-
+import { Noto_Sans } from "next/font/google";
 import "../globals.css";
 
+const inter = Noto_Sans({ subsets: ["latin"] });
+
 export const metadata: Metadata = {
-    title: "Khoj AI - Agents",
-    description: "Use Agents with Khoj AI for deeper, more personalized queries.",
+    title: "Khoj AI - Chat",
+    description: "Use this page to chat with Khoj AI.",
     icons: {
         icon: '/static/favicon.ico',
     },
@@ -19,9 +18,20 @@ export default function RootLayout({
     children: React.ReactNode;
 }>) {
     return (
-        <div className={`${styles.agentsLayout}`}>
-            <NavMenu selected="Agents" showLogo={true} />
-            {children}
-        </div>
+        <html lang="en">
+            <meta httpEquiv="Content-Security-Policy"
+                content="default-src 'self' https://assets.khoj.dev;
+                       media-src * blob:;
+                       script-src 'self' https://assets.khoj.dev 'unsafe-inline' 'unsafe-eval';
+                       connect-src 'self' https://ipapi.co/json ws://localhost:42110;
+                       style-src 'self' https://assets.khoj.dev 'unsafe-inline' https://fonts.googleapis.com;
+                       img-src 'self' data: https://*.khoj.dev https://*.googleusercontent.com https://*.google.com/ https://*.gstatic.com;
+                       font-src 'self' https://assets.khoj.dev https://fonts.gstatic.com;
+                       child-src 'none';
+                       object-src 'none';"></meta>
+            <body className={inter.className}>
+                {children}
+            </body>
+        </html>
     );
 }
diff --git a/src/interface/web/app/agents/page.tsx b/src/interface/web/app/agents/page.tsx
diff --git a/src/interface/web/app/automations/automations.module.css b/src/interface/web/app/automations/automations.module.css
@@ -9,8 +9,23 @@ div.automationCard {
     grid-template-rows: auto 1fr auto;
 }
 
+div.pageLayout {
+    max-width: 60vw;
+    margin: auto;
+    margin-bottom: 2rem;
+}
+
+div.sidePanel {
+    position: fixed;
+    height: 100%;
+}
+
 @media screen and (max-width: 768px) {
     div.automationsLayout {
         grid-template-columns: 1fr;
     }
+
+    div.pageLayout {
+        max-width: 90vw;
+    }
 }
diff --git a/src/interface/web/app/automations/automationsLayout.module.css b/src/interface/web/app/automations/automationsLayout.module.css
diff --git a/src/interface/web/app/automations/layout.tsx b/src/interface/web/app/automations/layout.tsx
@@ -1,6 +1,4 @@
 import type { Metadata } from "next";
-import NavMenu from '../components/navMenu/navMenu';
-import styles from './automationsLayout.module.css';
 import { Toaster } from "@/components/ui/toaster";
 
 import "../globals.css";
@@ -20,8 +18,7 @@ export default function RootLayout({
     children: React.ReactNode;
 }>) {
     return (
-        <div className={`${styles.automationsLayout}`}>
-            <NavMenu selected="Automations" showLogo={true} />
+        <div>
             {children}
             <Toaster />
         </div>