style: Beta UI fixes (#1199)

* fix(EditPresetDialog) endpoint menu

* style: update anthropic's icon & removed hover:bg in PresetItems

* style(OptionsPopover) rounded SaveAsPreset

* style(PresetItems) removed hover:bg

* style(NavLinks) match to openai

* style(NavLinks)

* fix(EditPresetDialog): remove empty cn call

---------

Co-authored-by: Danny Avila <110412045+danny-avila@users.noreply.github.com>
This commit is contained in:
Marco Beretta 2023-11-18 22:45:51 +01:00 committed by GitHub
parent 1fc896d0bd
commit ab5c81d063
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 17 additions and 26 deletions

View file

@ -8,7 +8,7 @@ import { ExportModel } from './ExportConversation';
import Settings from './Settings';
import NavLink from './NavLink';
import Logout from './Logout';
import { LinkIcon, DotsIcon, GearIcon } from '~/components';
import { LinkIcon, GearIcon } from '~/components';
import { useAuthContext } from '~/hooks/AuthContext';
import { useLocalize } from '~/hooks';
import { cn } from '~/utils/';
@ -50,15 +50,15 @@ export default function NavLinks() {
)}
<Menu.Button
className={cn(
'group-ui-open:bg-gray-800 rounded-sd flex w-full items-center gap-2.5 px-3 py-2 text-sm transition-colors duration-200 hover:bg-gray-800',
open ? 'bg-gray-800' : '',
'group-ui-open:bg-[#202123] duration-350 mt-text-sm mb-1 flex w-full items-center gap-2.5 rounded-lg px-2 py-1.5 transition-colors hover:bg-[#202123]',
open ? 'bg-[#202123]' : '',
)}
data-testid="nav-user"
>
<div className="-ml-0.9 -mt-0.8 h-9 w-8 flex-shrink-0">
<div className="-ml-0.9 -mt-0.8 h-8 w-7 flex-shrink-0">
<div className="relative flex">
<img
className="rounded-sm"
className="rounded-full"
src={
user?.avatar ||
`https://api.dicebear.com/6.x/initials/svg?seed=${
@ -70,15 +70,11 @@ export default function NavLinks() {
</div>
</div>
<div
className="grow overflow-hidden text-ellipsis whitespace-nowrap text-left font-bold text-white"
className="mt-2 grow overflow-hidden text-ellipsis whitespace-nowrap text-left font-bold text-white"
style={{ marginTop: '-4px', marginLeft: '2px' }}
>
{user?.name || localize('com_nav_user')}
</div>
<div style={{ marginBottom: '5px' }}>
<DotsIcon />
</div>
</Menu.Button>
<Transition
@ -90,7 +86,7 @@ export default function NavLinks() {
leaveFrom="translate-y-0 opacity-100"
leaveTo="translate-y-2 opacity-0"
>
<Menu.Items className="absolute bottom-full left-0 z-20 mb-2 w-full translate-y-0 overflow-hidden rounded-md bg-[#050509] py-1.5 opacity-100 outline-none">
<Menu.Items className="absolute bottom-full left-0 z-20 mb-1 mt-1 w-full translate-y-0 overflow-hidden rounded-lg bg-[#202123] py-1.5 opacity-100 outline-none">
<Menu.Item as="div">
<NavLink
className={cn(
@ -102,7 +98,7 @@ export default function NavLinks() {
clickHandler={clickHandler}
/>
</Menu.Item>
<div className="my-1.5 h-px bg-white/20" role="none" />
<div className="my-1 h-px bg-white/20" role="none" />
<Menu.Item as="div">
<NavLink
className="flex w-full cursor-pointer items-center gap-3 rounded-none px-3 py-3 text-sm text-white transition-colors duration-200 hover:bg-gray-700"
@ -119,7 +115,7 @@ export default function NavLinks() {
clickHandler={() => setShowSettings(true)}
/>
</Menu.Item>
<div className="my-1.5 h-px bg-white/20" role="none" />
<div className="my-1 h-px bg-white/20" role="none" />
<Menu.Item as="div">
<Logout />
</Menu.Item>