fix: use outline none (#5486)

* fix: use outline none

* fix: dropdown trigger ui bugs

* Update packages/ui/Dropdown.tsx

Co-authored-by: Omar López <zomars@me.com>
pull/5465/head^2
Udit Takkar 2022-11-12 00:51:56 +05:30 committed by GitHub
parent 3c8cb3a9ea
commit 30eea089ba
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 4 deletions

View File

@ -53,7 +53,7 @@ type DropdownMenuItemProps = ComponentProps<typeof DropdownMenuPrimitive["Checkb
export const DropdownMenuItem = forwardRef<HTMLDivElement, DropdownMenuItemProps>(
({ className = "", ...props }, forwardedRef) => (
<DropdownMenuPrimitive.Item
className={`text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 ${className}`}
className={`text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none ${className}`}
{...props}
ref={forwardedRef}
/>

View File

@ -240,10 +240,10 @@ function UserDropdown({ small }: { small?: boolean }) {
return (
<Dropdown open={menuOpen}>
<DropdownMenuTrigger asChild onClick={() => setMenuOpen((menuOpen) => !menuOpen)}>
<button className="group flex w-full cursor-pointer appearance-none items-center rounded-full p-2 text-left outline-none hover:bg-gray-100 sm:pl-3 md:rounded-none lg:pl-2">
<button className="group flex w-full cursor-pointer appearance-none items-center rounded-full p-2 text-left outline-none hover:bg-gray-200 sm:pl-3 md:rounded lg:pl-2">
<span
className={classNames(
small ? "h-8 w-8" : "h-9 w-9 ltr:mr-2 rtl:ml-3",
small ? "h-6 w-6" : "h-8 w-8 ltr:mr-2 rtl:ml-3",
"relative flex-shrink-0 rounded-full bg-gray-300 "
)}>
{
@ -267,7 +267,7 @@ function UserDropdown({ small }: { small?: boolean }) {
<span className="block truncate font-medium text-gray-900">
{user.name || "Nameless User"}
</span>
<span className="block truncate font-normal text-neutral-500">
<span className="block truncate font-normal text-gray-900">
{user.username
? process.env.NEXT_PUBLIC_WEBSITE_URL === "https://cal.com"
? `cal.com/${user.username}`