mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-06 13:27:22 +00:00
improvement: adjust select dropdown styling in add project modal
This commit is contained in:
@@ -271,6 +271,8 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
|
|||||||
value={value}
|
value={value}
|
||||||
onValueChange={onChange}
|
onValueChange={onChange}
|
||||||
className="w-full"
|
className="w-full"
|
||||||
|
position="popper"
|
||||||
|
dropdownContainerClassName="max-w-none"
|
||||||
>
|
>
|
||||||
{projectTemplates.length
|
{projectTemplates.length
|
||||||
? projectTemplates.map((template) => (
|
? projectTemplates.map((template) => (
|
||||||
@@ -306,6 +308,9 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
|
|||||||
onChange(e);
|
onChange(e);
|
||||||
}}
|
}}
|
||||||
className="mb-12 w-full bg-mineshaft-600"
|
className="mb-12 w-full bg-mineshaft-600"
|
||||||
|
position="popper"
|
||||||
|
dropdownContainerClassName="max-w-none -top-1"
|
||||||
|
side="top"
|
||||||
>
|
>
|
||||||
<SelectItem value={INTERNAL_KMS_KEY_ID} key="kms-internal">
|
<SelectItem value={INTERNAL_KMS_KEY_ID} key="kms-internal">
|
||||||
Default Infisical KMS
|
Default Infisical KMS
|
||||||
|
|||||||
@@ -20,6 +20,7 @@ type Props = {
|
|||||||
isMulti?: boolean;
|
isMulti?: boolean;
|
||||||
iconClassName?: string;
|
iconClassName?: string;
|
||||||
dropdownContainerStyle?: React.CSSProperties;
|
dropdownContainerStyle?: React.CSSProperties;
|
||||||
|
side: SelectPrimitive.SelectContentProps["side"];
|
||||||
};
|
};
|
||||||
|
|
||||||
export type SelectProps = Omit<SelectPrimitive.SelectProps, "disabled"> & Props;
|
export type SelectProps = Omit<SelectPrimitive.SelectProps, "disabled"> & Props;
|
||||||
@@ -37,6 +38,7 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
|
|||||||
containerClassName,
|
containerClassName,
|
||||||
iconClassName,
|
iconClassName,
|
||||||
dropdownContainerStyle,
|
dropdownContainerStyle,
|
||||||
|
side,
|
||||||
...props
|
...props
|
||||||
},
|
},
|
||||||
ref
|
ref
|
||||||
@@ -78,6 +80,7 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
|
|||||||
</SelectPrimitive.Trigger>
|
</SelectPrimitive.Trigger>
|
||||||
<SelectPrimitive.Portal>
|
<SelectPrimitive.Portal>
|
||||||
<SelectPrimitive.Content
|
<SelectPrimitive.Content
|
||||||
|
side={side}
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
"relative top-1 z-[100] max-w-sm overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 font-inter text-bunker-100 shadow-md",
|
"relative top-1 z-[100] max-w-sm overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 font-inter text-bunker-100 shadow-md",
|
||||||
position === "popper" && "max-h-72",
|
position === "popper" && "max-h-72",
|
||||||
|
|||||||
Reference in New Issue
Block a user