diff --git a/src/components/navigation/left/ServerListSidebar.tsx b/src/components/navigation/left/ServerListSidebar.tsx
index 40689779..f710de12 100644
--- a/src/components/navigation/left/ServerListSidebar.tsx
+++ b/src/components/navigation/left/ServerListSidebar.tsx
@@ -13,6 +13,7 @@ import PaintCounter from "../../../lib/PaintCounter";
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
import { useApplicationState } from "../../../mobx/State";
+import { SIDEBAR_CHANNELS } from "../../../mobx/stores/Layout";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { useClient } from "../../../context/revoltjs/RevoltClient";
@@ -168,6 +169,14 @@ const SettingsButton = styled.div`
`;
function Swoosh() {
+ const sidebarOpen = useApplicationState().layout.getSectionState(
+ SIDEBAR_CHANNELS,
+ true,
+ );
+ const fill = sidebarOpen
+ ? "var(--sidebar-active)"
+ : "var(--primary-background)";
+
return (
diff --git a/src/pages/channels/Channel.tsx b/src/pages/channels/Channel.tsx
index 8695f5c3..4364c206 100644
--- a/src/pages/channels/Channel.tsx
+++ b/src/pages/channels/Channel.tsx
@@ -20,7 +20,7 @@ import AgeGate from "../../components/common/AgeGate";
import MessageBox from "../../components/common/messaging/MessageBox";
import JumpToBottom from "../../components/common/messaging/bars/JumpToBottom";
import TypingIndicator from "../../components/common/messaging/bars/TypingIndicator";
-import Header from "../../components/ui/Header";
+import Header, { PageHeader } from "../../components/ui/Header";
import RightSidebar from "../../components/navigation/RightSidebar";
import ChannelHeader from "./ChannelHeader";
@@ -145,12 +145,11 @@ function VoiceChannel({ channel }: { channel: ChannelI }) {
function ChannelPlaceholder() {
return (
-
+