📝 (webflow) Add bind commands to button instructions
This commit is contained in:
@@ -32,7 +32,7 @@ export const WebflowBubbleInstructions = () => {
|
||||
onThemeChange={setTheme}
|
||||
/>
|
||||
<Text>
|
||||
Add an <Code>embed</Code> element from the <Code>components</Code>{' '}
|
||||
Add an <Code>Embed</Code> element from the <Code>components</Code>{' '}
|
||||
section and paste this code:
|
||||
</Text>
|
||||
<JavascriptBubbleSnippet
|
||||
|
||||
@@ -2,29 +2,39 @@ import { OrderedList, ListItem, Code, Stack, Text } from '@chakra-ui/react'
|
||||
import { useState } from 'react'
|
||||
import { PopupSettings } from '../../../settings/PopupSettings'
|
||||
import { JavascriptPopupSnippet } from '../../Javascript/JavascriptPopupSnippet'
|
||||
import { TextLink } from '@/components/TextLink'
|
||||
|
||||
export const WebflowPopupInstructions = () => {
|
||||
const [inputValue, setInputValue] = useState<number>()
|
||||
|
||||
return (
|
||||
<OrderedList spacing={4} pl={5}>
|
||||
<ListItem>
|
||||
Press <Code>A</Code> to open the <Code>Add elements</Code> panel
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Stack spacing={4}>
|
||||
<PopupSettings
|
||||
onUpdateSettings={(settings) =>
|
||||
setInputValue(settings.autoShowDelay)
|
||||
}
|
||||
/>
|
||||
<Text>
|
||||
Add an <Code>embed</Code> element from the <Code>components</Code>{' '}
|
||||
section and paste this code:
|
||||
</Text>
|
||||
<JavascriptPopupSnippet autoShowDelay={inputValue} />
|
||||
</Stack>
|
||||
</ListItem>
|
||||
</OrderedList>
|
||||
<>
|
||||
<OrderedList spacing={4} pl={5}>
|
||||
<ListItem>
|
||||
Press <Code>A</Code> to open the <Code>Add elements</Code> panel
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Stack spacing={4}>
|
||||
<PopupSettings
|
||||
onUpdateSettings={(settings) =>
|
||||
setInputValue(settings.autoShowDelay)
|
||||
}
|
||||
/>
|
||||
<Text>
|
||||
Add an <Code>Embed</Code> element from the <Code>components</Code>{' '}
|
||||
section and paste this code:
|
||||
</Text>
|
||||
<JavascriptPopupSnippet autoShowDelay={inputValue} />
|
||||
</Stack>
|
||||
</ListItem>
|
||||
</OrderedList>
|
||||
<Text fontSize="sm" colorScheme="gray" pl="5">
|
||||
Check out the{' '}
|
||||
<TextLink href="https://docs.typebot.io/embed/webflow#popup" isExternal>
|
||||
Webflow embed documentation
|
||||
</TextLink>{' '}
|
||||
for more options.
|
||||
</Text>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@ export const WebflowStandardInstructions = () => (
|
||||
<ListItem>
|
||||
<Stack spacing={4}>
|
||||
<Text>
|
||||
Add an <Code>embed</Code> element from the <Code>components</Code>{' '}
|
||||
Add an <Code>Embed</Code> element from the <Code>components</Code>{' '}
|
||||
section and paste this code:
|
||||
</Text>
|
||||
<JavascriptStandardSnippet />
|
||||
|
||||
@@ -30,15 +30,15 @@ export const PopupSettings = ({ onUpdateSettings, ...props }: Props) => {
|
||||
<Heading size="sm">Popup settings</Heading>
|
||||
|
||||
<HStack pl={4}>
|
||||
<p>Auto show</p>
|
||||
<Text flexShrink={0}>Auto show</Text>
|
||||
<Switch
|
||||
isChecked={isEnabled}
|
||||
onChange={(e) => setIsEnabled(e.target.checked)}
|
||||
/>
|
||||
{isEnabled && (
|
||||
<>
|
||||
<Text>after</Text>
|
||||
<NumberInput
|
||||
label="After"
|
||||
size="sm"
|
||||
w="70px"
|
||||
defaultValue={inputValue}
|
||||
|
||||
Reference in New Issue
Block a user