2
0

fix: 💄 1-line truncated texts

This commit is contained in:
Baptiste Arnaud
2022-06-18 07:58:51 +02:00
parent 283509ed59
commit e4ad23c2b9
14 changed files with 15 additions and 15 deletions

View File

@ -101,7 +101,7 @@ export const CredentialsDropdown = ({
textAlign="left"
{...props}
>
<Text noOfLines={0} overflowY="visible" h="20px">
<Text noOfLines={1} overflowY="visible" h="20px">
{currentCredential ? currentCredential.name : defaultCredentialsLabel}
</Text>
</MenuButton>

View File

@ -39,7 +39,7 @@ export const DropdownList = <T,>({
textAlign="left"
{...props}
>
<chakra.span noOfLines={0} display="block">
<chakra.span noOfLines={1} display="block">
{(currentItem ?? placeholder) as unknown as ReactNode}
</chakra.span>
</MenuButton>

View File

@ -4,7 +4,7 @@ import { Text } from '@chakra-ui/react'
type Props = { label?: string }
export const ConfigureContent = ({ label }: Props) => (
<Text color={label ? 'currentcolor' : 'gray.500'} noOfLines={0}>
<Text color={label ? 'currentcolor' : 'gray.500'} noOfLines={1}>
{label ?? 'Configure...'}
</Text>
)

View File

@ -6,7 +6,7 @@ type Props = {
}
export const FileInputContent = ({ options: { isMultipleAllowed } }: Props) => (
<Text noOfLines={0} pr="6">
<Text noOfLines={1} pr="6">
Collect {isMultipleAllowed ? 'files' : 'file'}
</Text>
)

View File

@ -13,7 +13,7 @@ export const PaymentInputContent = ({ block }: Props) => {
)
return <Text color="gray.500">Configure...</Text>
return (
<Text noOfLines={0} pr="6">
<Text noOfLines={1} pr="6">
Collect {block.options.amount} {block.options.currency}
</Text>
)

View File

@ -6,7 +6,7 @@ type Props = {
}
export const RatingInputContent = ({ block }: Props) => (
<Text noOfLines={0} pr="6">
<Text noOfLines={1} pr="6">
Rate from 1 to {block.options.length}
</Text>
)

View File

@ -36,7 +36,7 @@ export const ProviderWebhookContent = ({ block, configuredLabel }: Props) => {
if (isNotDefined(webhook?.body))
return <Text color="gray.500">Configure...</Text>
return (
<Text noOfLines={0} pr="6">
<Text noOfLines={1} pr="6">
{webhook?.url ? configuredLabel : 'Disabled'}
</Text>
)

View File

@ -22,7 +22,7 @@ export const ConditionNodeContent = ({ item }: Props) => {
byId(comparison.variableId)
)
return (
<Wrap key={comparison.id} spacing={1} noOfLines={0}>
<Wrap key={comparison.id} spacing={1} noOfLines={1}>
{idx > 0 && <Text>{item.content.logicalOperator ?? ''}</Text>}
{variable?.name && (
<Tag bgColor="orange.400" color="white">
@ -38,7 +38,7 @@ export const ConditionNodeContent = ({ item }: Props) => {
)}
{comparison?.value && (
<Tag bgColor={'gray.200'}>
<Text noOfLines={0}>{comparison.value}</Text>
<Text noOfLines={1}>{comparison.value}</Text>
</Tag>
)}
</Wrap>

View File

@ -174,7 +174,7 @@ export const CollaborationList = () => {
<Flex py="2" px="4" justifyContent="space-between">
<HStack minW={0}>
<EmojiOrImageIcon icon={workspace.icon} />
<Text fontSize="15px" noOfLines={0}>
<Text fontSize="15px" noOfLines={1}>
Everyone at {workspace.name}
</Text>
</HStack>

View File

@ -91,7 +91,7 @@ export const CollaboratorIdentityContent = ({
<Text
color="gray.500"
fontSize={name ? '14px' : 'inherit'}
noOfLines={0}
noOfLines={1}
>
{email}
</Text>

View File

@ -18,7 +18,7 @@ export const EditableTypebotName = ({ name, onNewName }: EditableProps) => {
<Tooltip label="Rename">
<Editable value={localName} onChange={setLocalName} onSubmit={onNewName}>
<EditablePreview
noOfLines={0}
noOfLines={1}
cursor="pointer"
maxW="200px"
overflow="hidden"