Remove the ability to hide the channel sidebar on mobile

This commit is contained in:
brecert 2021-09-07 10:57:40 -04:00
parent ed56967e10
commit 04158302ac
No known key found for this signature in database
GPG key ID: 1B2E56B9EC985B96
3 changed files with 21 additions and 8 deletions

View file

@ -89,6 +89,10 @@ const TextChannel = observer(({ channel }: { channel: ChannelI }) => {
} }
}} }}
toggleChannelSidebar={() => { toggleChannelSidebar={() => {
if (isTouchscreenDevice) {
return
}
setChannels(!showChannels); setChannels(!showChannels);
if (showChannels) { if (showChannels) {

View file

@ -3,7 +3,7 @@ import { Notepad, Group } from "@styled-icons/boxicons-solid";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { Channel } from "revolt.js/dist/maps/Channels"; import { Channel } from "revolt.js/dist/maps/Channels";
import { User } from "revolt.js/dist/maps/Users"; import { User } from "revolt.js/dist/maps/Users";
import styled from "styled-components"; import styled, { css } from "styled-components";
import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice"; import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
@ -69,9 +69,11 @@ const IconConainer = styled.div`
cursor: pointer; cursor: pointer;
color: var(--secondary-foreground); color: var(--secondary-foreground);
&:hover { ${!isTouchscreenDevice && css`
color: var(--foreground); &:hover {
} color: var(--foreground);
}
`}
` `
export default observer(({ channel, toggleSidebar, toggleChannelSidebar }: ChannelHeaderProps) => { export default observer(({ channel, toggleSidebar, toggleChannelSidebar }: ChannelHeaderProps) => {

View file

@ -11,7 +11,8 @@ import Header from "../../components/ui/Header";
import CategoryButton from "../../components/ui/fluent/CategoryButton"; import CategoryButton from "../../components/ui/fluent/CategoryButton";
import { dispatch, getState } from "../../redux"; import { dispatch, getState } from "../../redux";
import { useState } from "preact/hooks"; import { useState } from "preact/hooks";
import styled from "styled-components"; import styled, { css } from "styled-components";
import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
const CHANNELS_SIDEBAR_KEY = "sidebar_channels"; const CHANNELS_SIDEBAR_KEY = "sidebar_channels";
@ -19,9 +20,11 @@ const IconConainer = styled.div`
cursor: pointer; cursor: pointer;
color: var(--secondary-foreground); color: var(--secondary-foreground);
&:hover { ${!isTouchscreenDevice && css`
color: var(--foreground); &:hover {
} color: var(--foreground);
}
`}
` `
export default function Home() { export default function Home() {
@ -30,6 +33,10 @@ export default function Home() {
); );
const toggleChannelSidebar = () => { const toggleChannelSidebar = () => {
if (isTouchscreenDevice) {
return
}
setChannels(!showChannels); setChannels(!showChannels);
if (showChannels) { if (showChannels) {