mirror/formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-01-25 10:30:30 -06:00
Code Issues Packages Projects Releases 119 Wiki Activity

fix Multi choice question: Option labels cut off #84

Browse Source
This commit is contained in:
Matthias Nannt
2022-09-23 12:59:10 +02:00
parent 0345247e9d
commit 6ae4566baf
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
components/editorjs/tools/MultipleChoiceQuestionComponent.tsx
View File

@@ -89,38 +89,38 @@ const SingleChoiceQuestion = (props) => {
</div>
)}
</div>
<div className="max-w-sm mt-2 space-y-2">
<div className="mt-2 space-y-2">
{choiceData.options.map((option, optionIdx) => (
<div
key={option.label}
className={classNames("relative flex items-start")}
className="relative flex items-start pr-2 hover:bg-gray-50 hover:rounded"
>
<span className="flex items-center text-sm">
<span className="flex items-center w-full text-sm ">
<span
className={classNames(
choiceData.multipleChoice ? "rounded-sm" : "rounded-full",
"flex items-center justify-center w-4 h-4 bg-white border border-gray-300"
"flex items-center justify-center w-4 h-4 border border-gray-300"
)}
aria-hidden="true"
>
<span className="rounded-full bg-white w-1.5 h-1.5" />
<span className="rounded-full w-1.5 h-1.5" />
</span>
<input
type="text"
defaultValue={option.label}
onBlur={onOptionChange(optionIdx, "label")}
className="p-0 ml-3 font-medium text-gray-900 border-0 border-transparent outline-none focus:ring-0 focus:outline-none placeholder:text-gray-300"
className="w-full p-0 ml-3 font-medium text-gray-900 bg-transparent border-0 border-transparent outline-none focus:ring-0 focus:outline-none placeholder:text-gray-300"
placeholder={`Option ${optionIdx + 1}`}
/>
{optionIdx !== 0 && (
<button
onClick={() => onDeleteOption(optionIdx)}
className="pl-4 right-3"
>
<TrashIcon className="w-4 h-4 text-gray-300" />
</button>
)}
</span>
{optionIdx !== 0 && (
<button
onClick={() => onDeleteOption(optionIdx)}
className="absolute p-1 right-3"
>
<TrashIcon className="w-4 h-4 text-gray-300" />
</button>
)}
</div>
))}
</div>