Use term "My dashboard", remove bg, mobile icon

Author: LanesGood

public/static/osmteams_logo--neg.svg

@@ -93,13 +93,13 @@ export default function PageHeader() {
               spacing={4}
               display={{ base: 'none', md: 'flex' }}
             >
-              {Links.map((link) => (
-                <NavLink href={link.url} passHref key={link.url} legacyBehavior>
+              {isAuthenticated && (
+                <NavLink href={'/dashboard'} passHref legacyBehavior>
                   <Button
                     as='a'
                     variant='outline'
-                    textTransform={'lowercase'}
                     size='sm'
+                    textTransform={'lowercase'}
                     _hover={{ background: 'brand.200', textDecoration: 'none' }}
                     sx={{
                       '.active&': {
@@ -109,17 +109,17 @@ export default function PageHeader() {
                       },
                     }}
                   >
-                    {link.name}
+                    My Dashboard
                   </Button>
                 </NavLink>
-              ))}
-              {isAuthenticated && (
-                <NavLink href={'/dashboard'} passHref legacyBehavior>
+              )}
+              {Links.map((link) => (
+                <NavLink href={link.url} passHref key={link.url} legacyBehavior>
                   <Button
                     as='a'
                     variant='outline'
-                    size='sm'
                     textTransform={'lowercase'}
+                    size='sm'
                     _hover={{ background: 'brand.200', textDecoration: 'none' }}
                     sx={{
                       '.active&': {
@@ -129,10 +129,10 @@ export default function PageHeader() {
                       },
                     }}
                   >
-                    Dashboard
+                    {link.name}
                   </Button>
                 </NavLink>
-              )}
+              ))}
             </HStack>
           </HStack>
           <Flex alignItems={'center'} ml={'auto'}>
@@ -186,7 +186,7 @@ export default function PageHeader() {
 
                     <MenuItem bg='inherit'>
                       <NavLink href='/dashboard'>
-                        <span>Dashboard</span>
+                        <span>My Dashboard</span>
                       </NavLink>
                     </MenuItem>
                     <MenuDivider />
@@ -223,27 +223,36 @@ export default function PageHeader() {
                     color='brand.600'
                     fontFamily='mono'
                     size='sm'
+                    display='flex'
+                    alignItems='center'
+                    gap={1}
                     as='a'
                     _hover={{ textDecoration: 'none' }}
                   >
+                    <Image
+                      src='/static/osmteams_logo--pos.svg'
+                      alt={'OSM Teams Logo'}
+                      width='48'
+                      height='48'
+                    />
                     osm_teams
                   </Heading>
                 </NavLink>
                 <List spacing='8' mt={8}>
+                  {isAuthenticated && (
+                    <ListItem>
+                      <NavLink href={'/dashboard'}>
+                        <span>My Dashboard</span>
+                      </NavLink>
+                    </ListItem>
+                  )}
                   {Links.map((link) => (
                     <ListItem key={link.url}>
                       <NavLink href={link.url}>
                         <span>{link.name}</span>
                       </NavLink>
                     </ListItem>
                   ))}
-                  {isAuthenticated && (
-                    <ListItem>
-                      <NavLink href={'/dashboard'}>
-                        <span>Dashboard</span>
-                      </NavLink>
-                    </ListItem>
-                  )}
                 </List>
               </DrawerBody>
             </DrawerContent>

public/static/osmteams_logo--pos.svg

@@ -36,9 +36,9 @@ const VHS = keyframes`
   }
 `
 const Links = [
+  { url: '/dashboard', name: 'My Dashboard' },
   { url: '/teams', name: 'Explore all teams' },
   { url: '/teams/create', name: 'Create new team' },
-  { url: '/dashboard', name: 'dashboard' },
 ]
 
 export default function Home() {
@@ -97,7 +97,7 @@ export default function Home() {
           transition={'text-shadow 0.5s ease'}
           variant='outline'
           colorScheme={'white'}
-          fontSize={[null, '0.8rem', '1rem', '1.25rem']}
+          fontSize={['0.75rem', '0.8rem', '1rem', '1.25rem']}
           whiteSpace='pre'
         >
           {title}