jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Fixed chat message size

Browse source
This commit is contained in:
Lucas Oliveira 2023-08-04 12:47:21 -03:00 • committed by Gabriel Luiz Freitas Almeida
commit a35445ec28
3 changed files with 27 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/frontend/src/components/codeTabsComponent/index.tsx
View file

@ -132,21 +132,25 @@ export default function CodeTabsComponent({
}}
>
<div className="api-modal-tablist-div">
<TabsList>
{tabs.map((tab, index) => (
<TabsTrigger
className={
isMessage ? "data-[state=active]:bg-primary-foreground" : ""
}
key={index}
value={index.toString()}
>
{tab.name}
</TabsTrigger>
))}
</TabsList>
{tabs.length > 0 && tabs[0].name !== "" ? (
<TabsList>
{tabs.map((tab, index) => (
<TabsTrigger
className={
isMessage ? "data-[state=active]:bg-primary-foreground" : ""
}
key={index}
value={index.toString()}
>
{tab.name}
</TabsTrigger>
))}
</TabsList>
) : (
<div></div>
)}
{Number(activeTab) < 4 && (
<div className="float-right mx-1 flex gap-2">
<div className="float-right mx-1 mb-1 mt-2 flex gap-2">
<button
className="flex items-center gap-1.5 rounded bg-none p-1 text-xs text-gray-500 dark:text-gray-300"
onClick={copyToClipboard}

6
src/frontend/src/modals/formModal/chatMessage/index.tsx
View file

@ -88,8 +88,8 @@ export default function ChatMessage({
<ReactMarkdown
remarkPlugins={[remarkGfm, remarkMath]}
rehypePlugins={[rehypeMathjax]}
className="markdown prose inline-block text-primary word-break-break-word dark:prose-invert
sm:w-[30vw] sm:max-w-[30vw] lg:w-[40vw] lg:max-w-[40vw]"
className="markdown prose min-w-full text-primary word-break-break-word
dark:prose-invert"
components={{
pre({ node, ...props }) {
return <>{props.children}</>;
@ -187,7 +187,7 @@ export default function ChatMessage({
}
/>
</button>
<span className="prose inline-block text-primary word-break-break-word dark:prose-invert">
<span className="prose text-primary word-break-break-word dark:prose-invert">
{promptOpen
? template?.split("\n")?.map((line, index) => {
const regex = /{([^}]+)}/g;

12
src/frontend/src/style/applies.css
View file

@ -336,7 +336,7 @@
@apply flex h-7 w-7 items-center justify-center rounded-full text-2xl;
}
.card-component-title-size {
@apply inline-block w-full flex-1 word-break-break-word truncate-doubleline;
@apply w-full flex-1 word-break-break-word truncate-doubleline;
}
.card-component-delete-button {
@apply flex self-start;
@ -544,7 +544,7 @@
@apply focus:outline-none focus:ring-1 focus:ring-primary focus:ring-offset-1;
}
.toggle-component-span {
@apply pointer-events-none relative inline-block h-5 w-5 transform rounded-full shadow ring-0 transition duration-200 ease-in-out;
@apply pointer-events-none relative h-5 w-5 transform rounded-full shadow ring-0 transition duration-200 ease-in-out;
}
.toggle-component-second-span {
@apply absolute inset-0 flex h-full w-full items-center justify-center transition-opacity;
@ -590,13 +590,13 @@
@apply flex-max-width items-center text-start;
}
.chat-message-modal-text {
@apply relative inline-block w-full text-start text-sm font-normal text-muted-foreground;
@apply relative w-full text-start text-sm font-normal text-muted-foreground;
}
.chat-message-modal-icon-div {
@apply absolute -left-2 -top-1 cursor-pointer;
}
.chat-message-modal-thought {
@apply chat-message-modal-thought-cursor ml-3 inline-block h-full w-[95%] rounded-md border border-ring bg-muted px-2 pb-3 pt-3 text-start text-muted-foreground;
@apply chat-message-modal-thought-cursor ml-3 h-full w-[95%] rounded-md border border-ring bg-muted px-2 pb-3 pt-3 text-start text-muted-foreground;
}
.chat-message-modal-thought-cursor {
@apply cursor-pointer overflow-scroll scrollbar-hide;
@ -608,7 +608,7 @@
@apply mt-1 animate-pulse cursor-default;
}
.chat-message-modal-alert {
@apply inline-block px-3 text-start text-muted-foreground;
@apply px-3 text-start text-muted-foreground;
}
.file-card-modal-image-div {
@ -913,7 +913,7 @@
@apply rounded-md border border-ring/60;
}
.form-modal-chat-thought-size {
@apply inline-block h-full w-[95%];
@apply h-full w-[95%];
}
.form-modal-chat-thought {
@apply form-modal-chat-thought-border form-modal-chat-thought-size cursor-pointer overflow-scroll bg-background px-2 py-2 text-start text-primary scrollbar-hide;