aljaz/AgentGPT
1
0
Fork 0
mirror of https://github.com/aljazceru/AgentGPT.git synced 2025-12-17 22:14:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

🚀 Update styling

Browse Source
This commit is contained in:
Asim Shrestha
2023-04-07 13:45:18 -07:00
parent d8c8f18f05
commit bd70423d12
4 changed files with 15 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Badge.tsx
View File

@@ -1,4 +1,4 @@
import React from 'react'; import React from "react";
interface BadgeProps { interface BadgeProps {
children: React.ReactNode; children: React.ReactNode;
@@ -6,7 +6,7 @@ interface BadgeProps {
const Badge = ({ children }: BadgeProps) => { const Badge = ({ children }: BadgeProps) => {
return ( return (
<div className="px-3 py-1 h-max text-sm font-semibold text-gray-100 bg-[#1E88E5] rounded-full"> <div className="text-md h-max rounded-full bg-[#1E88E5] px-5 py-2 font-semibold text-gray-100">
{children} {children}
</div> </div>
); );

2
src/components/Button.tsx
View File

@@ -33,7 +33,7 @@ const Button = forwardRef(
disabled={loading || props.disabled} disabled={loading || props.disabled}
className={ className={
// eslint-disable-next-line @typescript-eslint/restrict-plus-operands // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
"transition-all " + props.className "shadow-2xl transition-all " + props.className
} }
onClick={onClick} onClick={onClick}
> >

16
src/components/ChatWindow.tsx
View File

@@ -1,27 +1,23 @@
import cx from "classnames"; import cx from "classnames";
import { ReactNode } from "react"; import type { ReactNode } from "react";
interface ChatWindowProps { interface ChatWindowProps {
children?: ReactNode; children?: ReactNode;
} }
const ChatWindow = ({ children }: ChatWindowProps) => { const ChatWindow = ({ children }: ChatWindowProps) => {
return ( return (
<div className="border-translucent flex h-80 w-full max-w-screen-md flex-col rounded-3xl drop-shadow-lg bg-black text-white"> <div className="border-translucent flex h-80 w-full max-w-screen-md flex-col rounded-3xl bg-black/50 text-white drop-shadow-lg">
<MacWindowHeader /> <MacWindowHeader />
{children} {children}
</div> </div>
) );
} };
const MacWindowHeader = () => { const MacWindowHeader = () => {
return ( return (
<div <div
className={cx( className={cx("flex gap-1 rounded-t-3xl p-3", "flex gap-1 rounded-t-3xl")}
"flex gap-1 rounded-t-3xl border-b-[1px] p-3",
"flex gap-1 rounded-t-3xl border-b-[1px] p-3",
"border-gray-200 bg-gray-100",
"border-white/25 bg-black"
)}
> >
<div className="h-3 w-3 rounded-full bg-red-500"></div> <div className="h-3 w-3 rounded-full bg-red-500"></div>
<div className="h-3 w-3 rounded-full bg-yellow-500"></div> <div className="h-3 w-3 rounded-full bg-yellow-500"></div>

6
src/pages/index.tsx
View File

@@ -37,10 +37,12 @@ const Home: NextPage = () => {
<Drawer /> <Drawer />
<div <div
id="content" id="content"
className="flex h-screen w-full flex-col items-center justify-center" className="flex h-screen w-full flex-col items-center justify-center gap-10"
> >
<div id="title" className="flex items-center gap-4"> <div id="title" className="flex items-center gap-4">
<div className="text-4xl font-bold text-[#C0C0C0]">AgentGPT</div> <div className="font-mono text-6xl font-bold text-[#C0C0C0]">
AgentGPT
</div>
<Badge>Beta 🚀</Badge> <Badge>Beta 🚀</Badge>
</div> </div>