diff --git a/ExtraModules.d.ts b/ExtraModules.d.ts index e687735..2c4b23e 100644 --- a/ExtraModules.d.ts +++ b/ExtraModules.d.ts @@ -15,3 +15,4 @@ declare module 'koa-session'; declare module 'koa-redis'; declare module 'koa-router'; declare module 'mongoose'; +declare module 'react-feather'; diff --git a/package.json b/package.json index 18fcb3d..f707ada 100644 --- a/package.json +++ b/package.json @@ -63,6 +63,7 @@ "react": "^16.4.2", "react-apollo": "^2.1.11", "react-dom": "^16.4.2", + "react-feather": "^1.1.3", "react-router-dom": "^4.3.1", "react-scripts-ts": "2.17.0", "reset.css": "^2.0.2", diff --git a/src/containers/NavBar/NavBar.css b/src/containers/NavBar/NavBar.css index 9939b08..bf29665 100644 --- a/src/containers/NavBar/NavBar.css +++ b/src/containers/NavBar/NavBar.css @@ -11,6 +11,11 @@ height: 100%; padding: var(--spc-small); + & svg { + width: 1rem; + height: 1rem; + } + & a { color: inherit; text-decoration: none; @@ -26,6 +31,7 @@ border-radius: 300px; border: 2px solid var(--col-maxContrast); margin: 0 var(--spc-small); + font-size: 0.8rem; &:hover { background: rgba(var(--rgb-bgAccentLowContrast), 0.1); diff --git a/src/containers/NavBar/index.tsx b/src/containers/NavBar/index.tsx index 628bfe4..22fc9d6 100644 --- a/src/containers/NavBar/index.tsx +++ b/src/containers/NavBar/index.tsx @@ -5,6 +5,7 @@ import { Query, QueryResult, ApolloConsumer } from 'react-apollo'; import { authStatus } from 'src/util/graphql/clientQueries'; import history from 'src/util/history'; import * as classnames from 'classnames'; +import { Home as HomeIcon, LogOut as LogoutIcon } from 'react-feather'; import NavRoutes from './NavRoutes'; @@ -24,7 +25,11 @@ class NavBar extends React.Component { return (