cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-09-19 17:47:18 -04:00
Code Issues Projects Releases Packages Wiki Activity

fix: bottom nav button alignment

Browse source 
fixes #679
This commit is contained in:
Paul Makles 2022-06-14 17:16:18 +01:00
parent b44779c89a
commit 220a28a151
1 changed files with 14 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/components/navigation/BottomNavigation.tsx
View file

@ -3,7 +3,7 @@ import { observer } from "mobx-react-lite";
import { useHistory, useLocation } from "react-router";
import styled, { css } from "styled-components/macro";
import { IconButton } from "@revoltchat/ui";
import { Centred, IconButton } from "@revoltchat/ui";
import ConditionalLink from "../../lib/ConditionalLink";
@ -27,6 +27,11 @@ const Navbar = styled.div`
const Button = styled.a<{ active: boolean }>`
flex: 1;
color: var(--foreground);
a {
color: inherit !important;
}
> a,
> div,
@ -64,7 +69,7 @@ export default observer(() => {
<Base>
<Navbar>
<Button active={homeActive}>
<IconButton
<Centred
onClick={() => {
if (settingsActive) {
if (history.length > 0) {
@ -81,13 +86,13 @@ export default observer(() => {
}
}}>
<Message size={24} />
</IconButton>
</Centred>
</Button>
<Button active={friendsActive}>
<ConditionalLink active={friendsActive} to="/friends">
<IconButton>
<Centred>
<Group size={25} />
</IconButton>
</Centred>
</ConditionalLink>
</Button>
{/*<Button active={searchActive}>
@ -108,16 +113,16 @@ export default observer(() => {
<ConditionalLink
active={discoverActive}
to="/discover/servers">
<IconButton>
<Centred>
<Compass size={24} />
</IconButton>
</Centred>
</ConditionalLink>
</Button>
<Button active={settingsActive}>
<ConditionalLink active={settingsActive} to="/settings">
<IconButton>
<Centred>
<UserIcon target={user} size={26} status={true} />
</IconButton>
</Centred>
</ConditionalLink>
</Button>
</Navbar>