Page MenuHomePhabricator
Files F3357607

D6335.diff
No OneTemporary
Actions

D6335.diff
View Options

diff --git a/web/app.react.js b/web/app.react.js
--- a/web/app.react.js
+++ b/web/app.react.js
@@ -48,7 +48,9 @@
import history from './router-history';
import AccountSettings from './settings/account-settings.react';
import DangerZone from './settings/danger-zone.react';
+import AppSwitcher from './sidebar/app-switcher.react';
import LeftLayoutAside from './sidebar/left-layout-aside.react';
+import SettingsSwitcher from './sidebar/settings-switcher.react';
import Splash from './splash/splash.react';
import './typography.css';
import css from './style.css';
@@ -200,6 +202,13 @@
[css['electron-non-draggable']]: electron,
});
+ let navigationPanel;
+ if (tab === 'settings') {
+ navigationPanel = <SettingsSwitcher />;
+ } else {
+ navigationPanel = <AppSwitcher />;
+ }
+
return (
<div className={css.layout}>
<DisconnectedBarVisibilityHandler />
@@ -232,6 +241,7 @@
</header>
<InputStateContainer>
<div className={css['main-content-container']}>
+ <div className={css['topBar']}>{navigationPanel}</div>
<div className={css['main-content']}>{mainContent}</div>
</div>
</InputStateContainer>
diff --git a/web/calendar/filter-panel.css b/web/calendar/filter-panel.css
--- a/web/calendar/filter-panel.css
+++ b/web/calendar/filter-panel.css
@@ -1,7 +1,7 @@
div.container {
position: fixed;
width: 300px;
- top: 62px;
+ top: 126px;
bottom: 0;
background-attachment: fixed;
display: flex;
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
@@ -3,23 +3,21 @@
background: var(--bg);
border-right: 1px solid var(--border-color);
display: flex;
- width: 560px;
}
.navigationPanelContainer {
- width: 160px;
- margin-top: 12px;
+ flex-direction: row;
+ display: flex;
}
.navigationPanelTab {
display: flex;
flex-direction: row;
- padding: 12px 0 12px 28px;
+ padding: 16px;
cursor: pointer;
}
.navigationPanelTab svg {
- padding-right: 12px;
color: var(--color-disabled);
stroke: var(--color-disabled);
fill: var(--color-disabled);
@@ -27,6 +25,8 @@
.navigationPanelTab p {
color: var(--color-disabled);
+ margin-right: 8px;
+ margin-left: 8px;
}
.navigationPanelTab:hover p,
@@ -38,6 +38,11 @@
fill: var(--fg);
}
+div.current_tab {
+ border-bottom: 2px solid var(--tabs-header-active-border);
+ height: 58px;
+}
+
.container p {
display: flex;
align-content: center;
diff --git a/web/sidebar/left-layout-aside.react.js b/web/sidebar/left-layout-aside.react.js
--- a/web/sidebar/left-layout-aside.react.js
+++ b/web/sidebar/left-layout-aside.react.js
@@ -2,24 +2,13 @@
import * as React from 'react';
-import { useSelector } from '../redux/redux-utils';
-import AppSwitcher from './app-switcher.react';
import CommunityPicker from './community-picker.react';
import css from './left-layout-aside.css';
-import SettingsSwitcher from './settings-switcher.react';
function LeftLayoutAside(): React.Node {
- const navInfo = useSelector(state => state.navInfo);
- const navigationPanel = React.useMemo(() => {
- if (navInfo.tab === 'settings') {
- return <SettingsSwitcher />;
- }
- return <AppSwitcher />;
- }, [navInfo.tab]);
return (
<aside className={css.container}>
<CommunityPicker />
- {navigationPanel}
</aside>
);
}
diff --git a/web/style.css b/web/style.css
--- a/web/style.css
+++ b/web/style.css
@@ -54,7 +54,7 @@
div.layout {
height: 100vh;
display: grid;
- grid-template-columns: 560px repeat(12, 1fr);
+ grid-template-columns: 400px repeat(12, 1fr);
grid-template-rows: 65px calc(100vh - 65px);
grid-template-areas:
'nav nav nav nav nav nav nav nav nav nav nav nav nav'
@@ -97,6 +97,7 @@
grid-area: app;
display: flex;
overflow: hidden;
+ flex-direction: column;
}
div.main-content {
display: flex;
@@ -110,6 +111,10 @@
right: 0;
padding: 15px 16px;
}
+.topBar {
+ border-bottom: 1px solid var(--border);
+ height: 60px;
+}
span.loading-indicator-loading {
display: inline-block;
}

File Metadata

Mime Type
text/plain
Expires
Mon, Nov 25, 12:35 AM (20 h, 45 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2577810
Default Alt Text
D6335.diff (4 KB)

Event Timeline