This commit is contained in:
utin-francis-peter
2024-07-04 10:11:57 +01:00
8 changed files with 37 additions and 21 deletions

View File

@@ -19,7 +19,7 @@ export default function Hero({
}>;
return (
<div
className={`mt-14 mb-4 flex w-full flex-col justify-end text-black-1000 dark:text-bright-gray sm:w-full lg:mt-6`}
className={`mt-16 mb-4 flex w-full flex-col justify-end text-black-1000 dark:text-bright-gray sm:w-full lg:mt-6`}
>
<div className="flex h-full w-full flex-col items-center justify-center">
<div className="flex items-center">

View File

@@ -191,11 +191,11 @@ export default function Conversation() {
};
return (
<div className="flex h-screen flex-col gap-1">
<div className="flex h-screen flex-col gap-7 pb-2">
<div
onWheel={handleUserInterruption}
onTouchMove={handleUserInterruption}
className="flex h-[90%] w-full justify-center overflow-y-auto p-4 md:h-[83vh]"
className="flex h-[90%] w-full flex-1 justify-center overflow-y-auto p-4 md:h-[83vh]"
>
{queries.length > 0 && !hasScrolledToLast && (
<button
@@ -234,8 +234,8 @@ export default function Conversation() {
{queries.length === 0 && <Hero handleQuestion={handleQuestion} />}
</div>
<div className="bottom-safe fixed flex w-11/12 flex-col items-end self-center rounded-2xl bg-opacity-0 pb-1 sm:w-6/12">
<div className="flex h-full w-full items-center rounded-full border border-silver bg-white dark:bg-raisin-black">
<div className="flex w-11/12 flex-col items-end self-center rounded-2xl bg-opacity-0 pb-1 sm:w-6/12">
<div className="flex h-full w-full items-center rounded-[40px] border border-silver bg-white py-1 dark:bg-raisin-black">
<div
id="inputbox"
ref={inputRef}

View File

@@ -42,7 +42,7 @@ const ConversationBubble = forwardRef<
bubble = (
<div ref={ref} className={`flex flex-row-reverse self-end ${className}`}>
<Avatar className="mt-2 text-2xl" avatar="🧑‍💻"></Avatar>
<div className="ml-10 mr-2 flex items-center rounded-3xl bg-purple-30 p-3.5 text-white">
<div className="ml-10 mr-2 flex items-center rounded-[28px] bg-purple-30 py-[14px] px-[19px] text-white">
<ReactMarkdown className="whitespace-pre-wrap break-normal leading-normal">
{message}
</ReactMarkdown>
@@ -68,7 +68,7 @@ const ConversationBubble = forwardRef<
/>
<div
className={`ml-2 mr-5 flex max-w-[90vw] rounded-3xl bg-gray-1000 p-3.5 dark:bg-gun-metal md:max-w-[70vw] lg:max-w-[50vw] ${
className={`ml-2 mr-5 flex max-w-[90vw] rounded-[28px] bg-gray-1000 py-[14px] px-7 dark:bg-gun-metal md:max-w-[70vw] lg:max-w-[50vw] ${
type === 'ERROR'
? 'relative 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'

View File

@@ -409,9 +409,9 @@ template {
width: 0;
}
.bottom-safe {
/* .bottom-safe {
bottom: env(safe-area-inset-bottom, 0);
}
} */
.inputbox-style[contenteditable] {
padding-left: 36px;

View File

@@ -55,7 +55,7 @@ function Upload({
}
}, []);
function ProgressBar({ progress }: { progress: number }) {
function ProgressBar({ progressPercent }: { progressPercent: number }) {
return (
<div className="my-5 w-[50%]">
<div
@@ -65,9 +65,9 @@ function Upload({
className={`h-full border-none p-1 w-${
progress || 0
}% flex items-center justify-center bg-purple-30 outline-none transition-all`}
style={{ width: `${progress || 0}%` }}
style={{ width: `${progressPercent || 0}%` }}
>
{progress >= 5 && `${progress}%`}
{progressPercent >= 5 && `${progressPercent}%`}
</div>
</div>
</div>
@@ -93,7 +93,7 @@ function Upload({
{/* <p className="mt-10 text-2xl">{progress?.percentage || 0}%</p> */}
{/* progress bar */}
<ProgressBar progress={progress?.percentage as number} />
<ProgressBar progressPercent={progress?.percentage as number} />
<button
onClick={() => {