ash/comicbox
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix(navbar): add separators between items, add a space between username and signout text

Browse source
This commit is contained in:
Ashhhleyyy 2022-08-01 16:31:47 +01:00
parent fee2e98a90
commit abadf0aae5
Signed by: ash
GPG key ID: 83B789081A0878FB
2 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
components/NavBar.tsx
View file

@ -8,12 +8,12 @@ export default function NavBar() {
return ( return (
<nav> <nav>
<ul className='flex flex-row h-12 bg-gray-900 justify-start items-center p-4 gap-1 shadow mb-4'> <ul className='flex flex-row h-12 bg-gray-900 justify-start items-center p-4 gap-1 shadow mb-4 dots-between'>
<li> <li className='no-dot'>
<LinkButton href='/'>Comicbox</LinkButton> <LinkButton href='/'>Comicbox</LinkButton>
</li> </li>
<li className='flex-1' aria-hidden /> <li className='flex-1 no-dot' aria-hidden />
<li> <li>
{status === 'loading' && <>...</>} {status === 'loading' && <>...</>}
@ -28,7 +28,7 @@ export default function NavBar() {
)} )}
{status === 'authenticated' && ( {status === 'authenticated' && (
<> <>
<span>{data?.user?.name}</span> <span>{data?.user?.name}</span>{' '}
<button onClick={() => signOut()}>(Log out)</button> <button onClick={() => signOut()}>(Log out)</button>
</> </>
)} )}

2
styles/globals.css
View file

@ -9,7 +9,7 @@
} }
@layer components { @layer components {
.dots-between > li:not(:last-child)::after { .dots-between > li:not(:last-child):not(.no-dot)::after {
content: '⦁'; content: '⦁';
padding: 0 8px; padding: 0 8px;
} }