diff --git a/web/sidebar/community-drawer-item.css b/web/sidebar/community-drawer-item.css
index bcc7a37a3..0e32a1333 100644
--- a/web/sidebar/community-drawer-item.css
+++ b/web/sidebar/community-drawer-item.css
@@ -1,67 +1,61 @@
 .threadEntry {
   display: flex;
   flex-direction: row;
   padding-top: 8px;
   padding-bottom: 8px;
 }
 
-.active {
-  background-color: var(--active-drawer-item-bg);
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
-}
-
 .threadListContainer {
   display: flex;
   flex-direction: column;
 }
 
 .titleWrapper {
   overflow: hidden;
   width: 100%;
   display: flex;
   align-items: center;
 }
 
 .title {
   text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
   color: var(--drawer-item-color);
   font-size: var(--s-font-14);
   font-weight: var(--semi-bold);
   line-height: 22px;
   margin-left: 8px;
 }
 
 .activeTitle {
   color: var(--drawer-active-item-color);
 }
 
 .buttonContainer {
   width: 24px;
   align-items: center;
   justify-content: center;
   display: flex;
 }
 
 .communityBase {
   padding-top: 4px;
   padding-bottom: 2px;
   padding-right: 4px;
   overflow: hidden;
 }
 
 .communityExpanded {
   background-color: var(--drawer-open-community-bg);
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   padding-bottom: 4px;
 }
 
 .subchannelsButton {
   margin-bottom: 6px;
   margin-top: 4px;
   display: flex;
   align-items: center;
 }
diff --git a/web/sidebar/community-drawer-item.react.js b/web/sidebar/community-drawer-item.react.js
index 61596feaa..b94fa17ff 100644
--- a/web/sidebar/community-drawer-item.react.js
+++ b/web/sidebar/community-drawer-item.react.js
@@ -1,130 +1,126 @@
 // @flow
 
 import classnames from 'classnames';
 import * as React from 'react';
 
 import type { CommunityDrawerItemData } from 'lib/utils/drawer-utils.react.js';
 import { useResolvedThreadInfo } from 'lib/utils/entity-helpers.js';
 
 import type { HandlerProps } from './community-drawer-item-handlers.react.js';
 import { getCommunityDrawerItemHandler } from './community-drawer-item-handlers.react.js';
 import css from './community-drawer-item.css';
 import {
   getChildren,
   getExpandButton,
 } from './community-drawer-utils.react.js';
 import ThreadAvatar from '../components/thread-avatar.react.js';
 import type { NavigationTab } from '../types/nav-types.js';
 import { shouldRenderAvatars } from '../utils/avatar-utils.js';
 
 export type DrawerItemProps = {
   +itemData: CommunityDrawerItemData<string>,
   +paddingLeft: number,
   +expandable?: boolean,
   +handlerType: NavigationTab,
 };
 
 function CommunityDrawerItem(props: DrawerItemProps): React.Node {
   const {
     itemData: { threadInfo, itemChildren, hasSubchannelsButton, labelStyle },
     paddingLeft,
     expandable = true,
     handlerType,
   } = props;
 
   const [handler, setHandler] = React.useState({
     onClick: () => {},
     expanded: false,
     toggleExpanded: () => {},
   });
 
   const Handler = getCommunityDrawerItemHandler(handlerType);
 
   const children = React.useMemo(
     () =>
       getChildren({
         expanded: handler.expanded,
         hasSubchannelsButton,
         itemChildren,
         paddingLeft,
         threadInfo,
         expandable,
         handlerType,
       }),
     [
       handler.expanded,
       hasSubchannelsButton,
       itemChildren,
       paddingLeft,
       threadInfo,
       expandable,
       handlerType,
     ],
   );
 
   const itemExpandButton = React.useMemo(
     () =>
       getExpandButton({
         expandable,
         childrenLength: itemChildren.length,
         hasSubchannelsButton,
         onExpandToggled: handler.toggleExpanded,
         expanded: handler.expanded,
       }),
     [
       expandable,
       itemChildren.length,
       hasSubchannelsButton,
       handler.toggleExpanded,
       handler.expanded,
     ],
   );
 
   const { uiName } = useResolvedThreadInfo(threadInfo);
 
   const titleLabel = classnames({
     [css[labelStyle]]: true,
     [css.activeTitle]: handler.isActive,
   });
 
   const style = React.useMemo(() => ({ paddingLeft }), [paddingLeft]);
-  const threadEntry = classnames({
-    [css.threadEntry]: true,
-    [css.active]: handler.isActive,
-  });
 
   const titleStyle = React.useMemo(
     () => ({
       marginLeft: shouldRenderAvatars ? 8 : 0,
     }),
     [],
   );
 
   return (
     <>
       <Handler setHandler={setHandler} threadInfo={threadInfo} />
-      <div className={threadEntry} style={style}>
+      <div className={css.threadEntry} style={style}>
         {itemExpandButton}
         <a onClick={handler.onClick} className={css.titleWrapper}>
           <ThreadAvatar size="micro" threadInfo={threadInfo} />
           <div className={titleLabel} style={titleStyle}>
             {uiName}
           </div>
         </a>
       </div>
       <div className={css.threadListContainer}>{children}</div>
     </>
   );
 }
 
 export type CommunityDrawerItemChatProps = {
   +itemData: CommunityDrawerItemData<string>,
   +paddingLeft: number,
   +expandable?: boolean,
   +handler: React.ComponentType<HandlerProps>,
 };
 
 const MemoizedCommunityDrawerItem: React.ComponentType<DrawerItemProps> =
   React.memo(CommunityDrawerItem);
 
 export default MemoizedCommunityDrawerItem;