Browse Source

feat: adjust save relay button style

imwald
codytseng 5 months ago committed by Silberengel
parent
commit
1221e45c6b
  1. 2
      src/components/RelayInfo/index.tsx
  2. 12
      src/components/SaveRelayDropdownMenu/index.tsx

2
src/components/RelayInfo/index.tsx

@ -149,7 +149,7 @@ function RelayControls({ url }: { url: string }) {
<Button variant="ghost" size="titlebar-icon" onClick={handleCopyUrl}> <Button variant="ghost" size="titlebar-icon" onClick={handleCopyUrl}>
{copiedUrl ? <Check /> : <Copy />} {copiedUrl ? <Check /> : <Copy />}
</Button> </Button>
<SaveRelayDropdownMenu urls={[url]} atTitlebar /> <SaveRelayDropdownMenu urls={[url]} bigButton />
</div> </div>
) )
} }

12
src/components/SaveRelayDropdownMenu/index.tsx

@ -27,10 +27,10 @@ import DrawerMenuItem from '../DrawerMenuItem'
export default function SaveRelayDropdownMenu({ export default function SaveRelayDropdownMenu({
urls, urls,
atTitlebar = false bigButton = false
}: { }: {
urls: string[] urls: string[]
atTitlebar?: boolean bigButton?: boolean
}) { }) {
const { t } = useTranslation() const { t } = useTranslation()
const { isSmallScreen } = useScreenSize() const { isSmallScreen } = useScreenSize()
@ -44,13 +44,13 @@ export default function SaveRelayDropdownMenu({
}, [relaySets, normalizedUrls]) }, [relaySets, normalizedUrls])
const [isDrawerOpen, setIsDrawerOpen] = useState(false) const [isDrawerOpen, setIsDrawerOpen] = useState(false)
const trigger = atTitlebar ? ( const trigger = bigButton ? (
<Button variant="ghost" size="titlebar-icon" onClick={() => setIsDrawerOpen(true)}> <Button variant="ghost" size="titlebar-icon" onClick={() => setIsDrawerOpen(true)}>
<Star className={alreadySaved ? 'fill-primary stroke-primary' : ''} /> <Star className={alreadySaved ? 'fill-primary stroke-primary' : ''} />
</Button> </Button>
) : ( ) : (
<button <button
className="enabled:hover:text-primary [&_svg]:size-5" className="enabled:hover:text-primary [&_svg]:size-5 pr-0 pt-0.5"
onClick={(e) => { onClick={(e) => {
e.stopPropagation() e.stopPropagation()
setIsDrawerOpen(true) setIsDrawerOpen(true)
@ -62,7 +62,7 @@ export default function SaveRelayDropdownMenu({
if (isSmallScreen) { if (isSmallScreen) {
return ( return (
<> <div>
{trigger} {trigger}
<div onClick={(e) => e.stopPropagation()}> <div onClick={(e) => e.stopPropagation()}>
<Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}> <Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
@ -84,7 +84,7 @@ export default function SaveRelayDropdownMenu({
</DrawerContent> </DrawerContent>
</Drawer> </Drawer>
</div> </div>
</> </div>
) )
} }

Loading…
Cancel
Save