Use tabWidth 4 without actual tabs.

This commit is contained in:
Paul
2021-07-05 11:25:20 +01:00
parent 7bd33d8d34
commit b5a11d5c8f
180 changed files with 16619 additions and 16622 deletions

View File

@@ -13,84 +13,84 @@ import UserIcon from "../common/user/UserIcon";
import IconButton from "../ui/IconButton";
const NavigationBase = styled.div`
z-index: 100;
height: 50px;
display: flex;
background: var(--secondary-background);
z-index: 100;
height: 50px;
display: flex;
background: var(--secondary-background);
`;
const Button = styled.a<{ active: boolean }>`
flex: 1;
flex: 1;
> a,
> div,
> a > div {
width: 100%;
height: 100%;
}
> a,
> div,
> a > div {
width: 100%;
height: 100%;
}
${(props) =>
props.active &&
css`
background: var(--hover);
`}
${(props) =>
props.active &&
css`
background: var(--hover);
`}
`;
interface Props {
lastOpened: LastOpened;
lastOpened: LastOpened;
}
export function BottomNavigation({ lastOpened }: Props) {
const user = useSelf();
const history = useHistory();
const path = useLocation().pathname;
const user = useSelf();
const history = useHistory();
const path = useLocation().pathname;
const channel_id = lastOpened["home"];
const channel_id = lastOpened["home"];
const friendsActive = path.startsWith("/friends");
const settingsActive = path.startsWith("/settings");
const homeActive = !(friendsActive || settingsActive);
const friendsActive = path.startsWith("/friends");
const settingsActive = path.startsWith("/settings");
const homeActive = !(friendsActive || settingsActive);
return (
<NavigationBase>
<Button active={homeActive}>
<IconButton
onClick={() => {
if (settingsActive) {
if (history.length > 0) {
history.goBack();
}
}
return (
<NavigationBase>
<Button active={homeActive}>
<IconButton
onClick={() => {
if (settingsActive) {
if (history.length > 0) {
history.goBack();
}
}
if (channel_id) {
history.push(`/channel/${channel_id}`);
} else {
history.push("/");
}
}}>
<Message size={24} />
</IconButton>
</Button>
<Button active={friendsActive}>
<ConditionalLink active={friendsActive} to="/friends">
<IconButton>
<Group size={25} />
</IconButton>
</ConditionalLink>
</Button>
<Button active={settingsActive}>
<ConditionalLink active={settingsActive} to="/settings">
<IconButton>
<UserIcon target={user} size={26} status={true} />
</IconButton>
</ConditionalLink>
</Button>
</NavigationBase>
);
if (channel_id) {
history.push(`/channel/${channel_id}`);
} else {
history.push("/");
}
}}>
<Message size={24} />
</IconButton>
</Button>
<Button active={friendsActive}>
<ConditionalLink active={friendsActive} to="/friends">
<IconButton>
<Group size={25} />
</IconButton>
</ConditionalLink>
</Button>
<Button active={settingsActive}>
<ConditionalLink active={settingsActive} to="/settings">
<IconButton>
<UserIcon target={user} size={26} status={true} />
</IconButton>
</ConditionalLink>
</Button>
</NavigationBase>
);
}
export default connectState(BottomNavigation, (state) => {
return {
lastOpened: state.lastOpened,
};
return {
lastOpened: state.lastOpened,
};
});