Darken bg on hover
This commit is contained in:
parent
67a9189057
commit
cf7ac8c8a1
|
@ -11,7 +11,7 @@ export function MenuButton(props: {
|
||||||
return (
|
return (
|
||||||
<Menu as="div" className={clsx('relative z-40 flex-shrink-0', className)}>
|
<Menu as="div" className={clsx('relative z-40 flex-shrink-0', className)}>
|
||||||
<div>
|
<div>
|
||||||
<Menu.Button className="flex rounded-full">
|
<Menu.Button className="w-full rounded-full">
|
||||||
<span className="sr-only">Open user menu</span>
|
<span className="sr-only">Open user menu</span>
|
||||||
{buttonContent}
|
{buttonContent}
|
||||||
</Menu.Button>
|
</Menu.Button>
|
||||||
|
|
|
@ -28,7 +28,7 @@ export function getNavigationOptions(user?: User | null) {
|
||||||
export function ProfileSummary(props: { user: User | undefined }) {
|
export function ProfileSummary(props: { user: User | undefined }) {
|
||||||
const { user } = props
|
const { user } = props
|
||||||
return (
|
return (
|
||||||
<Row className="group avatar items-center gap-4 py-6 text-gray-600 group-hover:text-gray-900">
|
<Row className="group avatar my-3 items-center gap-4 rounded-md py-3 text-gray-600 group-hover:bg-gray-100 group-hover:text-gray-900">
|
||||||
<Avatar avatarUrl={user?.avatarUrl} username={user?.username} noLink />
|
<Avatar avatarUrl={user?.avatarUrl} username={user?.username} noLink />
|
||||||
|
|
||||||
<div className="truncate text-left">
|
<div className="truncate text-left">
|
||||||
|
|
|
@ -36,7 +36,7 @@ function SidebarItem(props: { item: Item; currentPage: string }) {
|
||||||
className={clsx(
|
className={clsx(
|
||||||
item.href == currentPage
|
item.href == currentPage
|
||||||
? 'bg-gray-200 text-gray-900'
|
? 'bg-gray-200 text-gray-900'
|
||||||
: 'text-gray-600 hover:bg-gray-50',
|
: 'text-gray-600 hover:bg-gray-100',
|
||||||
'group flex items-center rounded-md px-3 py-2 text-sm font-medium'
|
'group flex items-center rounded-md px-3 py-2 text-sm font-medium'
|
||||||
)}
|
)}
|
||||||
aria-current={item.href == currentPage ? 'page' : undefined}
|
aria-current={item.href == currentPage ? 'page' : undefined}
|
||||||
|
@ -58,7 +58,7 @@ function SidebarItem(props: { item: Item; currentPage: string }) {
|
||||||
|
|
||||||
function MoreButton() {
|
function MoreButton() {
|
||||||
return (
|
return (
|
||||||
<a className="group flex items-center rounded-md px-3 py-2 text-sm font-medium text-gray-600 hover:cursor-pointer hover:bg-gray-50">
|
<a className="group flex items-center rounded-md px-3 py-2 text-sm font-medium text-gray-600 hover:cursor-pointer hover:bg-gray-100">
|
||||||
<DotsHorizontalIcon
|
<DotsHorizontalIcon
|
||||||
className="-ml-1 mr-3 h-6 w-6 flex-shrink-0 text-gray-400 group-hover:text-gray-500"
|
className="-ml-1 mr-3 h-6 w-6 flex-shrink-0 text-gray-400 group-hover:text-gray-500"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
@ -128,7 +128,7 @@ export default function Sidebar() {
|
||||||
<a
|
<a
|
||||||
key={fold.name}
|
key={fold.name}
|
||||||
href={`/fold/${fold.slug}`}
|
href={`/fold/${fold.slug}`}
|
||||||
className="group flex items-center rounded-md px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-50 hover:text-gray-900"
|
className="group flex items-center rounded-md px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 hover:text-gray-900"
|
||||||
>
|
>
|
||||||
<span className="truncate"> {fold.name}</span>
|
<span className="truncate"> {fold.name}</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user