diff --git a/src/frontend/src/components/codeTabsComponent/index.tsx b/src/frontend/src/components/codeTabsComponent/index.tsx index 8d68641bb..9ccdb38e4 100644 --- a/src/frontend/src/components/codeTabsComponent/index.tsx +++ b/src/frontend/src/components/codeTabsComponent/index.tsx @@ -175,13 +175,21 @@ export default function CodeTabsComponent({ key={index} // Remember to add a unique key prop > {index < 4 ? ( - - {tab.code} - + <> + {tab.description && ( +
+ )} + + {tab.code} + + ) : index === 4 ? ( <>
diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index 219104ae0..add06a6fc 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -73,6 +73,8 @@ const ApiModal = forwardRef( }, { name: "Chat Widget HTML", + description: + "Insert this code anywhere in your <body> tag. To use with react and other libs, check our documentation.", mode: "html", image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png", language: "py", @@ -124,6 +126,8 @@ const ApiModal = forwardRef( }, { name: "Chat Widget HTML", + description: + "Insert this code anywhere in your <body> tag. To use with react and other libs, check our documentation.", mode: "html", image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png", language: "py", @@ -163,6 +167,8 @@ const ApiModal = forwardRef( }, { name: "Chat Widget HTML", + description: + "Insert this code anywhere in your <body> tag. To use with react and other libs, check our documentation.", mode: "html", image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png", language: "py", diff --git a/src/frontend/src/style/applies.css b/src/frontend/src/style/applies.css index 4257a29c1..57c28f3b0 100644 --- a/src/frontend/src/style/applies.css +++ b/src/frontend/src/style/applies.css @@ -757,6 +757,9 @@ .node-modal-button-box { @apply flex-max-width flex-row-reverse bg-input px-4 pb-3 } + .link-color{ + @apply text-foreground font-semibold + } .node-modal-button { @apply inline-flex w-full justify-center rounded-md border border-transparent bg-status-red px-4 py-2 text-base font-medium text-background shadow-sm hover:bg-ring sm:ml-3 sm:w-auto sm:text-sm } diff --git a/src/frontend/src/utils/utils.ts b/src/frontend/src/utils/utils.ts index ef4109752..d0edc4403 100644 --- a/src/frontend/src/utils/utils.ts +++ b/src/frontend/src/utils/utils.ts @@ -397,9 +397,11 @@ export function getWidgetCode(flow: FlowType, tabsState?: TabsState): string { const flowName = flow.name; const inputs = buildInputs(tabsState, flow.id); - return ` - - + return ` + +