hope/dog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

icons

Browse Source
This commit is contained in:
Peter Hoppe
2023-02-25 00:10:25 +01:00
parent a4455f7450
commit bbb3fd7c45
11 changed files with 127 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
extern/feathericons.com/command.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-command"><path d="M18 3a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3H6a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3V6a3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3h12a3 3 0 0 0 3-3 3 3 0 0 0-3-3z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 421 B

1
extern/feathericons.com/grid.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-grid"><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg>
Side by Side

After

Width:  |  Height:  |  Size: 404 B

1
extern/feathericons.com/key.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-key"><path d="M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 352 B

1
extern/feathericons.com/lock.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-lock"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 321 B

1
extern/feathericons.com/log-in.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-log-in"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"></path><polyline points="10 17 15 12 10 7"></polyline><line x1="15" y1="12" x2="3" y2="12"></line></svg>
Side by Side

After

Width:  |  Height:  |  Size: 368 B

1
extern/feathericons.com/log-out.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-log-out"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
Side by Side

After

Width:  |  Height:  |  Size: 367 B

1
extern/feathericons.com/trash-2.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>
Side by Side

After

Width:  |  Height:  |  Size: 448 B

1
extern/feathericons.com/user-minus.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-minus"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="23" y1="11" x2="17" y2="11"></line></svg>
Side by Side

After

Width:  |  Height:  |  Size: 365 B

1
extern/feathericons.com/user.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
Side by Side

After

Width:  |  Height:  |  Size: 313 B

20
src/components/DogNavbar.tsx
View File

@ -1,6 +1,7 @@
import { Button, Navbar, Text } from '@mantine/core'
import { Button, Navbar, Text, ThemeIcon } from '@mantine/core'
import React, { useState } from 'react'
import { Link } from 'react-router-dom'
import { IconGrid, IconUser, IconUserMinus } from '../services/Icons';
import { logOut } from '../services/PhpApi'
import Footer2 from './Footer2'
@ -22,17 +23,22 @@ function DogNavbar({hasUser, onLogout}:{hasUser: boolean, onLogout: () => void})
<div style={{display: 'flex', flexDirection:'column' }}>
{!hasUser && <Text component={Link} variant='link' to='/login'>Login</Text>}
{!hasUser && <Text component={Link} variant='link' to='/reg'>Register</Text>}
{!hasUser && <Text component={Link} variant='link' to='/wantnewpw'>PW neu</Text>}
{hasUser && <Text component={Link} variant='link' to='/profil'>Profil</Text>}
{hasUser && <Text component={Link} variant='link' to='/qr'>QrCode</Text>}
{hasUser && <>
<IconUser/>
<Text component={Link} variant='link' to='/profil'>Profil</Text></>}
{hasUser && <Text component={Link} variant='link' to='/wantnewpw'>PW neu</Text>}
{hasUser && <>
<IconGrid/>
<Text component={Link} variant='link' to='/qr'>QrCode</Text></>}
</div>
</Navbar.Section>
<Navbar.Section className='InputForm' >
{hasUser && <Button sx = {{ padding: '0px 6px;'}} onClick={(e)=>{onLogout()}}>Logout</Button>}
</Navbar.Section>
<div style={{height: '10%' }}></div>
<Navbar.Section className='InputForm' >
{hasUser && <Button sx = {{ padding: '0px 6px;'}} onClick={(e)=>{}}>Account löschen</Button>}
</Navbar.Section>
<Navbar.Section className='InputForm' >
{hasUser && <Button sx = {{ padding: '0px 6px;'}} onClick={(e)=>{onLogout()}}>Logout</Button>}
</Navbar.Section>
<Navbar.Section> </Navbar.Section>
<Navbar.Section><Text component={Link} variant='link' to='/impressum'>Impressum</Text></Navbar.Section>
</Navbar> )

105
src/services/Icons.tsx Normal file
View File

@ -0,0 +1,105 @@
import React from 'react'
const WWW_ROOT: string = process.env.REACT_APP_WWW_ROOT!;
export type TIcon =
{
name: string,
icon: JSX.Element
};
const IconArray: TIcon[] =
[
{
name: "user",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/user.svg'}
width='32px'
height='32px'
/>
},
{
name: "grid",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/grid.svg'}
width='32px'
height='32px'
/>
},
{
name: "user-minus",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/user-minus.svg'}
width='32px'
height='32px'
/>
},
{
name: "log-in",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/log-in.svg'}
width='32px'
height='32px'
/>
},
{
name: "log-out",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/log-out.svg'}
width='32px'
height='32px'
/>
},
{
name: "lock",
icon:
<img style={{background: 'none'}}
src = {WWW_ROOT+'uploads/lock.svg'}
width='32px'
height='32px'
/>
}
];
export function IconUser()
{
return (
IconArray.find((i) => i.name === 'user')!.icon )
}
export function IconUserMinus()
{
return (
IconArray.find((i) => i.name === 'user-minus')!.icon )
}
export function IconLogIn()
{
return (
IconArray.find((i) => i.name === 'log-in')!.icon )
}
export function IconLogOut()
{
return (
IconArray.find((i) => i.name === 'log-out')!.icon )
}
export function IconLock()
{
return (
IconArray.find((i) => i.name === 'lock')!.icon )
}
export function IconGrid()
{
return (
IconArray.find((i) => i.name === 'grid')!.icon )
}