Chattery AI

Model: Gemini 2.0 Flash

\n\n \n {messages.map((msg, index) => (\n \n {msg.role === \"bot\" && (\n \n )}\n

{msg.content}

\n {msg.file && (\n \n )}\n

\n ))}\n \n\n

\n Chattery AI can make mistakes, so double-check it.\n

\n \n );\n}\n\n// Client-side rendering\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\n// Server-side handler\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n \n \n \n Chattery AI / Gemini 2.0 Flash\n \n \n \n \n \n \n

\n \n \n \n `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}\n\n// CSS Styles\nconst css = `\n/* Import Google Font - Poppins */\n@import url(\"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap\");\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: \"Poppins\", sans-serif;\n}\n\n:root {\n /* Dark theme colors */\n --text-color: #edf3ff;\n --subheading-color: #97a7ca;\n --placeholder-color: #c3cdde;\n --primary-color: #101623;\n --secondary-color: #283045;\n --secondary-hover-color: #333e58;\n --scrollbar-color: #626a7f;\n}\n\nbody.light-theme {\n /* Light theme colors */\n --text-color: #090c13;\n --subheading-color: #7b8cae;\n --placeholder-color: #606982;\n --primary-color: #f3f7ff;\n --secondary-color: #dce6f9;\n --secondary-hover-color: #d2ddf2;\n --scrollbar-color: #a2aac2;\n}\n\nbody {\n color: var(--text-color);\n background: var(--primary-color);\n}\n\n.container {\n overflow-y: auto;\n padding: 32px 0 60px;\n height: 100vh;\n scrollbar-color: var(--scrollbar-color) transparent;\n}\n\n.container :where(.app-header, .message, .prompt-wrapper) {\n position: relative;\n margin: 0 auto;\n width: 100%;\n padding: 0 20px;\n max-width: 990px;\n}\n\n.container .app-header {\n margin-top: 3vh;\n}\n\n.app-header .heading {\n width: fit-content;\n font-size: 3rem;\n background: linear-gradient(to right, #1d7efd, #8f6fff);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.app-header .sub-heading {\n font-size: 2.6rem;\n margin-top: -5px;\n color: var(--subheading-color);\n}\n\n.container .chats-container {\n display: flex;\n gap: 20px;\n flex-direction: column;\n max-height: calc(100vh - 250px);\n overflow-y: auto;\n padding-bottom: 20px;\n}\n\n.chats-container .message {\n display: flex;\n gap: 11px;\n align-items: flex-start;\n}\n\n.chats-container .message .avatar {\n width: 43px;\n height: 43px;\n flex-shrink: 0;\n border-radius: 50%;\n padding: 6px;\n background: var(--secondary-color);\n border: 1px solid var(--secondary-hover-color);\n}\n\n.chats-container .message .message-text {\n padding: 12px 16px;\n word-wrap: break-word;\n white-space: pre-line;\n}\n\n.chats-container .user-message {\n align-self: flex-end;\n max-width: 75%;\n}\n\n.chats-container .user-message .message-text {\n background: var(--secondary-color);\n border-radius: 13px 13px 3px 13px;\n}\n\n.chats-container .bot-message .message-text {\n background: var(--secondary-hover-color);\n border-radius: 13px 13px 13px 3px;\n}\n\n.chats-container .message .img-attachment {\n max-width: 50%;\n border-radius: 13px;\n margin-top: 10px;\n}\n\n.container .prompt-container {\n position: fixed;\n width: 100%;\n left: 0;\n bottom: 0;\n padding: 16px 0;\n background: var(--primary-color);\n}\n\n.prompt-container .prompt-wrapper {\n display: flex;\n gap: 12px;\n align-items: center;\n max-width: 990px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n.prompt-container .prompt-form {\n flex-grow: 1;\n height: 56px;\n border-radius: 130px;\n background: var(--secondary-color);\n display: flex;\n align-items: center;\n}\n\n.prompt-form .prompt-input {\n flex-grow: 1;\n height: 100%;\n background: none;\n outline: none;\n border: none;\n font-size: 1rem;\n color: var(--text-color);\n padding-left: 24px;\n}\n\n.prompt-form .prompt-input::placeholder {\n color: var(--placeholder-color);\n}\n\n.prompt-form .prompt-actions {\n display: flex;\n align-items: center;\n gap: 5px;\n margin-right: 7px;\n}\n\n.prompt-wrapper button {\n width: 45px;\n height: 45px;\n border-radius: 50%;\n border: none;\n cursor: pointer;\n background: var(--secondary-color);\n color: var(--text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n}\n\n.prompt-form #send-prompt-btn {\n background: #1d7efd;\n color: white;\n}\n\n.prompt-container .disclaimer-text {\n text-align: center;\n font-size: 0.9rem;\n color: var(--placeholder-color);\n margin-top: 10px;\n}\n\n.file-upload-wrapper {\n position: relative;\n}\n\n.file-upload-wrapper .file-preview {\n max-width: 45px;\n max-height: 45px;\n border-radius: 50%;\n object-fit: cover;\n}\n\n@media (max-width: 768px) {\n .container {\n padding: 20px 0;\n }\n\n .app-header .heading {\n font-size: 2rem;\n }\n\n .app-header .sub-heading {\n font-size: 1.7rem;\n }\n}\n`;","createdAt",["D",1740378945072],"version",1,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount","commentCount","prCount","mergedPr",{"_129":130,"_131":132},"handle","srijanb69","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzJ0VFdDc2owTjdBeDBUNzZiTnRUN3RVc3hqaSJ9","forkedVal","interval","slug","srijanb69/ChatteryGen2Flash","description","@jsxImportSource https://esm.sh/react@18.2.0","versions",[141,144],{"_118":119,"_142":-5,"_116":143,"_113":111},"prId",["D",1740378945072],{"_118":32,"_142":-5,"_116":145,"_113":146},["D",1740378624562],"d47091ea-f278-11ef-bdfd-569c3dd06744","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.pulls._index",{"_96":97,"_95":154,"_129":130,"_137":138,"_99":100,"_162":32,"_163":32,"_51":52,"_164":165},{"_99":100,"_96":97,"_101":102,"_103":-5,"_104":-5,"_105":106,"_107":-5,"_108":109,"_110":111,"_112":26,"_113":111,"_114":115,"_116":155,"_118":119,"_120":26,"_121":32,"_122":32,"_123":32,"_124":32,"_125":32,"_126":32,"_127":-5,"_20":156,"_133":-5,"_134":-7,"_135":136,"_137":138,"_139":157},["D",1740378945072],{"_129":130,"_131":132},[158,160],{"_118":119,"_142":-5,"_116":159,"_113":111},["D",1740378945072],{"_118":32,"_142":-5,"_116":161,"_113":146},["D",1740378624562],"page","count","prs",[],"routes/_app","actionData","errors"]