diff --git a/web/sidebar/left-layout-aside.css b/web/sidebar/left-layout-aside.css
--- a/web/sidebar/left-layout-aside.css
+++ b/web/sidebar/left-layout-aside.css
@@ -17,21 +17,12 @@
   cursor: pointer;
 }
 
-.navigationPanelTab svg {
-  padding-right: 12px;
-  color: var(--color-disabled);
-  stroke: var(--color-disabled);
-  fill: var(--color-disabled);
-}
-
 .navigationPanelTab p {
   color: var(--color-disabled);
 }
 
 .navigationPanelTab:hover p,
-.navigationPanelTab:hover svg,
-div.current_tab p,
-div.current_tab svg {
+div.current_tab p {
   color: var(--fg);
   stroke: var(--fg);
   fill: var(--fg);
@@ -41,24 +32,3 @@
   display: flex;
   align-content: center;
 }
-
-.chatIconWrapper {
-  position: relative;
-}
-
-span.chatBadge {
-  position: absolute;
-  top: -4px;
-  left: 13px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  color: var(--fg);
-  background: var(--unread-bg);
-  border-radius: 13px;
-  font-size: 8px;
-  line-height: 1.25;
-}
diff --git a/web/topbar/app-switcher.react.js b/web/topbar/app-switcher.react.js
--- a/web/topbar/app-switcher.react.js
+++ b/web/topbar/app-switcher.react.js
@@ -11,9 +11,9 @@
 import { updateNavInfoActionType } from '../redux/action-types';
 import { useSelector } from '../redux/redux-utils';
 import { navTabSelector } from '../selectors/nav-selectors.js';
-import css from '../sidebar/left-layout-aside.css';
 import NavigationPanel from '../sidebar/navigation-panel.react';
 import SWMansionIcon from '../SWMansionIcon.react';
+import css from './topbar.css';
 
 function AppSwitcher(): React.Node {
   const activeChatThreadID = useSelector(
@@ -123,7 +123,7 @@
   );
 
   return (
-    <NavigationPanel.Container tabSelector={navTabSelector}>
+    <NavigationPanel.Container tabSelector={navTabSelector} horizontal={true}>
       {chatNavigationItem}
       {calendarNavigationItem}
       {appNavigationItem}
diff --git a/web/topbar/topbar.react.js b/web/topbar/topbar.react.js
--- a/web/topbar/topbar.react.js
+++ b/web/topbar/topbar.react.js
@@ -3,6 +3,7 @@
 import * as React from 'react';
 
 import type { NavInfo } from '../types/nav-types';
+import AppSwitcher from './app-switcher.react';
 import css from './topbar.css';
 
 type Props = {
@@ -14,7 +15,11 @@
     return null;
   }
 
-  return <div className={css.container}>dummy</div>;
+  return (
+    <div className={css.container}>
+      <AppSwitcher />
+    </div>
+  );
 }
 
 const MemoizedTopbar: React.ComponentType<Props> = React.memo<Props>(Topbar);