diff --git a/rnd/autogpt_builder/src/app/globals.css b/rnd/autogpt_builder/src/app/globals.css
index 39a92718dd5b..d90551d168c8 100644
--- a/rnd/autogpt_builder/src/app/globals.css
+++ b/rnd/autogpt_builder/src/app/globals.css
@@ -7,3 +7,60 @@
text-wrap: balance;
}
}
+
+
+
+:root {
+ --background: 180 100% 95%;
+ --foreground: 180 5% 0%;
+ --card: 180 50% 90%;
+ --card-foreground: 180 5% 10%;
+ --popover: 180 100% 95%;
+ --popover-foreground: 180 100% 0%;
+ --primary: 180 76.5% 30%;
+ --primary-foreground: 0 0% 100%;
+ --secondary: 180 30% 70%;
+ --secondary-foreground: 0 0% 0%;
+ --muted: 142 30% 85%;
+ --muted-foreground: 180 5% 35%;
+ --accent: 142 30% 80%;
+ --accent-foreground: 180 5% 10%;
+ --destructive: 0 100% 30%;
+ --destructive-foreground: 180 5% 90%;
+ --border: 180 30% 50%;
+ --input: 180 30% 18%;
+ --ring: 180 76.5% 30%;
+ --radius: 0.5rem;
+}
+.dark {
+ --background: 180 50% 5%;
+ --foreground: 180 5% 90%;
+ --card: 180 50% 0%;
+ --card-foreground: 180 5% 90%;
+ --popover: 180 50% 5%;
+ --popover-foreground: 180 5% 90%;
+ --primary: 180 76.5% 30%;
+ --primary-foreground: 0 0% 100%;
+ --secondary: 180 30% 10%;
+ --secondary-foreground: 0 0% 100%;
+ --muted: 142 30% 15%;
+ --muted-foreground: 180 5% 60%;
+ --accent: 142 30% 15%;
+ --accent-foreground: 180 5% 90%;
+ --destructive: 0 100% 30%;
+ --destructive-foreground: 180 5% 90%;
+ --border: 180 30% 18%;
+ --input: 180 30% 18%;
+ --ring: 180 76.5% 30%;
+ --radius: 0.5rem;
+}
+
+
+@layer base {
+ * {
+ @apply border-border;
+ }
+ body {
+ @apply bg-background text-foreground;
+ }
+}
diff --git a/rnd/autogpt_builder/src/app/layout.tsx b/rnd/autogpt_builder/src/app/layout.tsx
index 604100536c75..f7b4dc8ddb72 100644
--- a/rnd/autogpt_builder/src/app/layout.tsx
+++ b/rnd/autogpt_builder/src/app/layout.tsx
@@ -1,10 +1,8 @@
import React from 'react';
import type { Metadata } from "next";
-import { ThemeProvider as NextThemeProvider } from "next-themes";
-import { type ThemeProviderProps } from "next-themes/dist/types";
import { Inter } from "next/font/google";
import Link from "next/link";
-import { CubeIcon, Pencil1Icon, ReaderIcon, TimerIcon } from "@radix-ui/react-icons";
+import { Pencil1Icon, TimerIcon } from "@radix-ui/react-icons";
import "./globals.css";
@@ -13,6 +11,7 @@ import { Button, buttonVariants } from "@/components/ui/button";
import {
DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger
} from "@/components/ui/dropdown-menu";
+import { Providers } from "@/app/providers";
const inter = Inter({ subsets: ["latin"] });
@@ -21,60 +20,57 @@ export const metadata: Metadata = {
description: "Your one stop shop to creating AI Agents",
};
-function ThemeProvider({ children, ...props }: ThemeProviderProps) {
- return {children}
-}
-
const NavBar = () => (
-
+
);
-
export default function RootLayout({
- children,
+ children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
-
+
-
-
-
-
- {children}
-
-
-
+ >
+
+
+
+ {children}
+
+
+
-
+
);
}
diff --git a/rnd/autogpt_builder/src/app/providers.tsx b/rnd/autogpt_builder/src/app/providers.tsx
new file mode 100644
index 000000000000..b07beb96d00d
--- /dev/null
+++ b/rnd/autogpt_builder/src/app/providers.tsx
@@ -0,0 +1,14 @@
+'use client'
+
+import * as React from 'react'
+import { ThemeProvider as NextThemesProvider } from 'next-themes'
+import { ThemeProviderProps } from 'next-themes/dist/types'
+import { TooltipProvider } from '@/components/ui/tooltip'
+
+export function Providers({ children, ...props }: ThemeProviderProps) {
+ return (
+
+ {children}
+
+ )
+}
\ No newline at end of file
diff --git a/rnd/autogpt_builder/tailwind.config.ts b/rnd/autogpt_builder/tailwind.config.ts
index 1becdec7d3ab..9784068cc0e9 100644
--- a/rnd/autogpt_builder/tailwind.config.ts
+++ b/rnd/autogpt_builder/tailwind.config.ts
@@ -15,21 +15,65 @@ const config = {
},
},
extend: {
- keyframes: {
- "accordion-down": {
- from: { height: "0" },
- to: { height: "var(--radix-accordion-content-height)" },
+ fontFamily: {
+ sans: ['var(--font-geist-sans)'],
+ mono: ['var(--font-geist-mono)']
+ },
+ colors: {
+ border: 'hsl(var(--border))',
+ input: 'hsl(var(--input))',
+ ring: 'hsl(var(--ring))',
+ background: 'hsl(var(--background))',
+ foreground: 'hsl(var(--foreground))',
+ primary: {
+ DEFAULT: 'hsl(var(--primary))',
+ foreground: 'hsl(var(--primary-foreground))'
+ },
+ secondary: {
+ DEFAULT: 'hsl(var(--secondary))',
+ foreground: 'hsl(var(--secondary-foreground))'
+ },
+ destructive: {
+ DEFAULT: 'hsl(var(--destructive))',
+ foreground: 'hsl(var(--destructive-foreground))'
+ },
+ muted: {
+ DEFAULT: 'hsl(var(--muted))',
+ foreground: 'hsl(var(--muted-foreground))'
+ },
+ accent: {
+ DEFAULT: 'hsl(var(--accent))',
+ foreground: 'hsl(var(--accent-foreground))'
},
- "accordion-up": {
- from: { height: "var(--radix-accordion-content-height)" },
- to: { height: "0" },
+ popover: {
+ DEFAULT: 'hsl(var(--popover))',
+ foreground: 'hsl(var(--popover-foreground))'
},
+ card: {
+ DEFAULT: 'hsl(var(--card))',
+ foreground: 'hsl(var(--card-foreground))'
+ }
},
- animation: {
- "accordion-down": "accordion-down 0.2s ease-out",
- "accordion-up": "accordion-up 0.2s ease-out",
+ borderRadius: {
+ lg: 'var(--radius)',
+ md: 'calc(var(--radius) - 2px)',
+ sm: 'calc(var(--radius) - 4px)'
},
- },
+ keyframes: {
+ 'accordion-down': {
+ from: { height: '0' },
+ to: { height: 'var(--radix-accordion-content-height)' }
+ },
+ 'accordion-up': {
+ from: { height: 'var(--radix-accordion-content-height)' },
+ to: { height: '0' }
+ }
+ },
+ animation: {
+ 'accordion-down': 'accordion-down 0.2s ease-out',
+ 'accordion-up': 'accordion-up 0.2s ease-out'
+ }
+ }
},
plugins: [require("tailwindcss-animate")],
} satisfies Config;