PC-940 Fix topbar when showing deployInstructions

Summary: Currently when a user has no clusters and we should the deploy instructions, the topbar is rendered in a weird position rather than the top of the page.

Test Plan: yarn dev

Reviewers: vihang, philkuz, zasgar

Reviewed By: vihang

JIRA Issues: PC-940

Differential Revision: https://phab.corp.pixielabs.ai/D8689

GitOrigin-RevId: bbb7be76af5a53ba6b2ab2c31aea6726ebb626bf

src/ui/src/containers/App/deploy-instructions.tsx

@@ -100,6 +100,8 @@ const useStyles = makeStyles((theme: Theme) => createStyles({
   },
   navBar: {
     left: 0,
+    top: 0,
+    width: '100%',
     position: 'absolute',
   },
 }));

src/ui/src/containers/App/topbar.tsx

@@ -210,6 +210,7 @@ export const TopBar = withStyles((theme: Theme) => createStyles({
   container: {
     zIndex: 1300,
     backgroundColor: theme.palette.background.paper,
+    position: 'absolute',
   },
   logo: {
     width: theme.spacing(8),