add dark mode - conversation, bubble, UI fixes

This commit is contained in:
ManishMadan2882
2024-01-22 02:56:07 +05:30
parent 5136e7726d
commit 537a733157
20 changed files with 95 additions and 70 deletions

View File

@@ -64,7 +64,7 @@ const ConversationBubble = forwardRef<
bubble = (
<div
ref={ref}
className={`flex self-start ${className} group flex-col pr-20`}
className={`flex self-start ${className} group flex-col pr-20 dark:text-bright-gray`}
>
<div className="flex self-start">
<Avatar
@@ -79,7 +79,7 @@ const ConversationBubble = forwardRef<
/>
<div
className={`ml-2 mr-5 flex rounded-3xl bg-gray-1000 p-3.5 ${
className={`ml-2 mr-5 flex rounded-3xl bg-gray-1000 dark:bg-gun-metal p-3.5 ${
type === 'ERROR'
? 'flex-row items-center rounded-full border border-transparent bg-[#FFE7E7] p-2 py-5 text-sm font-normal text-red-3000 dark:border-red-2000 dark:text-white'
: 'flex-col rounded-3xl'
@@ -237,7 +237,7 @@ const ConversationBubble = forwardRef<
>
<div className="absolute left-6 top-4">
<div
className="flex items-center justify-center rounded-full p-2"
className="flex items-center justify-center rounded-full p-2 dark:bg-transparent"
style={{
backgroundColor: isLikeHovered
? isLikeClicked
@@ -307,13 +307,13 @@ const ConversationBubble = forwardRef<
</div>
{sources && openSource !== null && sources[openSource] && (
<div className="ml-10 mt-2 max-w-[800px] rounded-xl bg-blue-200 p-2">
<p className="m-1 w-3/4 truncate text-xs text-gray-500">
<div className="ml-10 mt-2 max-w-[800px] rounded-xl bg-blue-200 dark:bg-gun-metal p-2">
<p className="m-1 w-3/4 truncate text-xs text-gray-500 dark:text-bright-gray">
Source: {sources[openSource].title}
</p>
<div className="m-2 rounded-xl border-2 border-gray-200 bg-white p-2">
<p className="text-break text-black">
<div className="m-2 rounded-xl border-2 border-gray-200 dark:border-chinese-silver bg-white dark:bg-dark-charcoal p-2">
<p className="text-break text-black dark:text-bright-gray">
{sources[openSource].text}
</p>
</div>