abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-06 17:11:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove the ability to hide the channel sidebar on mobile

Browse Source
This commit is contained in:
brecert
2021-09-07 10:57:40 -04:00
parent ed56967e10
commit 04158302ac
3 changed files with 21 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/channels/Channel.tsx
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) {

10
src/pages/channels/ChannelHeader.tsx
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) => {

15
src/pages/home/Home.tsx
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) {