mirror of https://github.com/portainer/portainer
fix(forms): increase-click-area-for-expandable-form-section EE-3314 (#7007)
* fix(forms): increase click area for form sectionpull/6977/merge
parent
9b58c2e466
commit
aea62723c0
|
@ -16,9 +16,10 @@ export function FormSection({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<FormSectionTitle>
|
<FormSectionTitle htmlFor={isFoldable ? `foldingButton${title}` : ''}>
|
||||||
{isFoldable && (
|
{isFoldable && (
|
||||||
<button
|
<button
|
||||||
|
id={`foldingButton${title}`}
|
||||||
type="button"
|
type="button"
|
||||||
onClick={() => setIsExpanded(!isExpanded)}
|
onClick={() => setIsExpanded(!isExpanded)}
|
||||||
className="border-0 mx-2 bg-transparent inline-flex justify-center items-center w-2"
|
className="border-0 mx-2 bg-transparent inline-flex justify-center items-center w-2"
|
||||||
|
|
|
@ -1,5 +1,22 @@
|
||||||
import { PropsWithChildren } from 'react';
|
import { PropsWithChildren } from 'react';
|
||||||
|
|
||||||
export function FormSectionTitle({ children }: PropsWithChildren<unknown>) {
|
interface Props {
|
||||||
|
htmlFor?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function FormSectionTitle({
|
||||||
|
children,
|
||||||
|
htmlFor,
|
||||||
|
}: PropsWithChildren<Props>) {
|
||||||
|
if (htmlFor) {
|
||||||
|
return (
|
||||||
|
<label
|
||||||
|
htmlFor={htmlFor}
|
||||||
|
className="col-sm-12 form-section-title cursor-pointer"
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</label>
|
||||||
|
);
|
||||||
|
}
|
||||||
return <div className="col-sm-12 form-section-title">{children}</div>;
|
return <div className="col-sm-12 form-section-title">{children}</div>;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue