move down dialog tree (#2799)

Co-authored-by: Chris Whitten <christopher.whitten@microsoft.com>
microsoft · Apr 28, 2020 · cba9ea0 · cba9ea0
1 parent 81367b1
commit cba9ea0
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 9 deletions.
diff --git a/Composer/packages/client/src/pages/language-generation/index.tsx b/Composer/packages/client/src/pages/language-generation/index.tsx
@@ -100,8 +100,6 @@ const LGPage: React.FC<LGPageProps> = props => {
   return (
     <Fragment>
       <div css={pageRoot} data-testid="LGPage">
-        <DialogTree navLinks={navLinks} onSelect={onSelect} dialogId={dialogId} />
-
         <div css={contentWrapper}>
           <ToolBar toolbarItems={toolbarItems} />
 
@@ -119,8 +117,9 @@ const LGPage: React.FC<LGPageProps> = props => {
               />
             </div>
           </div>
-          <div role="main" css={ContentStyle} data-testid="LGEditor">
-            <div css={contentEditor}>
+          <div role="main" css={ContentStyle}>
+            <DialogTree navLinks={navLinks} onSelect={onSelect} dialogId={dialogId} />
+            <div css={contentEditor} data-testid="LGEditor">
               <Suspense fallback={<LoadingSpinner />}>
                 <Router primary={false} component={Fragment}>
                   <CodeEditor path="/edit/*" dialogId={dialogId} />

diff --git a/Composer/packages/client/src/pages/language-understanding/index.tsx b/Composer/packages/client/src/pages/language-understanding/index.tsx
@@ -100,8 +100,6 @@ const LUPage: React.FC<LUPageProps> = props => {
 
   return (
     <div css={pageRoot} data-testid="LUPage">
-      <DialogTree navLinks={navLinks} onSelect={onSelect} dialogId={dialogId} />
-
       <div css={contentWrapper}>
         <ToolBar toolbarItems={toolbarItems} />
         <div css={ContentHeaderStyle}>
@@ -120,8 +118,9 @@ const LUPage: React.FC<LUPageProps> = props => {
             )}
           </div>
         </div>
-        <div role="main" css={ContentStyle} data-testid="LUEditor">
-          <div css={contentEditor}>
+        <div role="main" css={ContentStyle}>
+          <DialogTree navLinks={navLinks} onSelect={onSelect} dialogId={dialogId} />
+          <div css={contentEditor} data-testid="LUEditor">
             <Suspense fallback={<LoadingSpinner />}>
               <Router primary={false} component={Fragment}>
                 <CodeEditor path="/edit" dialogId={dialogId} />

diff --git a/Composer/packages/client/src/pages/language-understanding/styles.ts b/Composer/packages/client/src/pages/language-understanding/styles.ts
@@ -52,6 +52,7 @@ export const HeaderText = css`
 
 export const ContentStyle = css`
   margin-left: 2px;
+  height: calc(100vh - 180px);
   display: flex;
   border-top: 1px solid #dddddd;
   position: relative;
@@ -65,7 +66,6 @@ export const ContentStyle = css`
 export const contentEditor = css`
   flex: 4;
   margin: 20px;
-  height: calc(100vh - 200px);
   position: relative;
   overflow: visible;