awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-15 14:27:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): fine tuning components library with exiting app design

Browse Source
This commit is contained in:
akhilmhdh
2023-02-03 22:21:09 +05:30
parent 3859a7e09b
commit 48cd84ce77
14 changed files with 192 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/v2/Select/Select.tsx
+12 -10
View File
@@ -22,21 +22,23 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
<SelectPrimitive.Trigger
ref={ref}
className={twMerge(
`inline-flex items-center justify-between data-[placeholder]:text-gray-500
px-3 py-2 font-inter text-sm text-bunker-200 font-normal rounded-md bg-mineshaft-800 outline-none`,
`inline-flex items-center justify-between rounded-md
bg-mineshaft-800 px-3 py-2 font-inter text-sm font-normal text-bunker-200 outline-none data-[placeholder]:text-gray-500`,
className
)}
>
<SelectPrimitive.Value placeholder={placeholder} />
{!props.disabled && <SelectPrimitive.Icon className="ml-3">
<FontAwesomeIcon icon={faChevronDown} size="sm" />
</SelectPrimitive.Icon>}
{!props.disabled && (
<SelectPrimitive.Icon className="ml-3">
<FontAwesomeIcon icon={faChevronDown} size="sm" />
</SelectPrimitive.Icon>
)}
</SelectPrimitive.Trigger>
<SelectPrimitive.Portal>
<SelectPrimitive.Content
// position="popper"
sideOffset={4}
className="overflow-hidden text-bunker-100 rounded-md shadow-md font-inter bg-mineshaft-800"
className="overflow-hidden rounded-md bg-mineshaft-800 font-inter text-bunker-100 shadow-md"
style={{ width: 'var(--radix-select-trigger-width) + 6' }}
>
<SelectPrimitive.ScrollUpButton>
@@ -75,11 +77,11 @@ export const SelectItem = forwardRef<HTMLDivElement, SelectItemProps>(
<SelectPrimitive.Item
{...props}
className={twMerge(
`text-sm rounded-sm transition-all hover:bg-mineshaft-500
flex items-center pl-10 pr-4 py-2 cursor-pointer rounded-md
select-none outline-none relative`,
`relative flex cursor-pointer
select-none items-center rounded-md py-2 pl-10 pr-4 text-sm
outline-none transition-all hover:bg-mineshaft-500`,
isSelected && 'bg-primary',
isDisabled && 'text-gray-600 hover:bg-transparent cursor-not-allowed hover:text-gray-600',
isDisabled && 'cursor-not-allowed text-gray-600 hover:bg-transparent hover:text-gray-600',
className
)}
ref={forwardedRef}