Merge pull request #1245 from danielyxie/dev

hide terminal scrollbar

css/interactivetutorial.scss

@@ -8,7 +8,7 @@
 
 #interactive-tutorial-container {
   display: none;
-  position: absolute; /* Stay in place */
+  position: fixed; /* Stay in place */
   right: 0;
   top: 0;
   height: 450px;

css/menupages.scss

@@ -6,9 +6,9 @@
 
 .generic-menupage-container {
   padding-left: 2px;
-  margin-left: 10%;
   -ms-overflow-style: none; /* for Internet Explorer, Edge */
   scrollbar-width: none; /* for Firefox */
+  flex-grow: 1;
 }
 
 #generic-react-container {

css/popupboxes.scss

@@ -93,6 +93,7 @@
 }
 
 .log-box-header {
+  z-index: 1300;
   background-color: #333;
   border: 1px solid var(--my-highlight-color);
   display: flex;

css/terminal.scss

@@ -5,6 +5,12 @@
   width: 99%;
   overflow: auto;
   overflow-y: scroll;
+
+  scrollbar-width: "none"; // firefox
+}
+
+#terminal-container::-webkit-scrollbar {
+  display: none;
 }
 
 #terminal {

dist/engineStyle.css

@@ -1343,7 +1343,11 @@ button {
   height: 100%;
   width: 99%;
   overflow: auto;
-  overflow-y: scroll; }
+  overflow-y: scroll;
+  scrollbar-width: "none"; }
+
+#terminal-container::-webkit-scrollbar {
+  display: none; }
 
 #terminal {
   padding-top: 10px;
@@ -1637,11 +1641,11 @@ button {
     terminal which has its own page) */
 .generic-menupage-container {
   padding-left: 2px;
-  margin-left: 10%;
   -ms-overflow-style: none;
   /* for Internet Explorer, Edge */
   scrollbar-width: none;
-  /* for Firefox */ }
+  /* for Firefox */
+  flex-grow: 1; }
 
 #generic-react-container {
   padding: 10px;
@@ -2446,6 +2450,7 @@ input[type="checkbox"] {
   border: 2px solid var(--my-highlight-color); }
 
 .log-box-header {
+  z-index: 1300;
   background-color: #333;
   border: 1px solid var(--my-highlight-color);
   display: flex;
@@ -2600,7 +2605,7 @@ input[type="checkbox"] {
 
 #interactive-tutorial-container {
   display: none;
-  position: absolute;
+  position: fixed;
   /* Stay in place */
   right: 0;
   top: 0;

index.html

@@ -54,7 +54,9 @@
           </table>
         </div>
 
-        <div id="generic-react-container" style="flex-grow: 1"></div>
+        <div class="generic-menupage-container">
+          <div id="generic-react-container"></div>
+        </div>
       </div>
 
       <div id="infiltration-container" class="generic-fullscreen-container"></div>

src/Sidebar/ui/Sidebar2Root.tsx

@@ -378,10 +378,12 @@ export function SidebarRoot(props: IProps): React.ReactElement {
                 onClick={clickTerminal}
               >
                 <ListItemIcon>
-                  <LastPageIcon color={activeTab !== "Terminal" ? "secondary" : "primary"} />
+                  <LastPageIcon color={flashTerminal ? "error" : activeTab !== "Terminal" ? "secondary" : "primary"} />
                 </ListItemIcon>
                 <ListItemText>
-                  <Typography color={activeTab !== "Terminal" ? "secondary" : "primary"}>Terminal</Typography>
+                  <Typography color={flashTerminal ? "error" : activeTab !== "Terminal" ? "secondary" : "primary"}>
+                    Terminal
+                  </Typography>
                 </ListItemText>
               </ListItem>
               <ListItem
@@ -408,10 +410,14 @@ export function SidebarRoot(props: IProps): React.ReactElement {
                 onClick={clickActiveScripts}
               >
                 <ListItemIcon>
-                  <StorageIcon color={activeTab !== "ActiveScripts" ? "secondary" : "primary"} />
+                  <StorageIcon
+                    color={flashActiveScripts ? "error" : activeTab !== "ActiveScripts" ? "secondary" : "primary"}
+                  />
                 </ListItemIcon>
                 <ListItemText>
-                  <Typography color={activeTab !== "ActiveScripts" ? "secondary" : "primary"}>
+                  <Typography
+                    color={flashActiveScripts ? "error" : activeTab !== "ActiveScripts" ? "secondary" : "primary"}
+                  >
                     Active Scripts
                   </Typography>
                 </ListItemText>
@@ -504,10 +510,12 @@ export function SidebarRoot(props: IProps): React.ReactElement {
               onClick={clickHacknet}
             >
               <ListItemIcon>
-                <AccountTreeIcon color={activeTab !== "Hacknet" ? "secondary" : "primary"} />
+                <AccountTreeIcon color={flashHacknet ? "error" : activeTab !== "Hacknet" ? "secondary" : "primary"} />
               </ListItemIcon>
               <ListItemText>
-                <Typography color={activeTab !== "Hacknet" ? "secondary" : "primary"}>Hacknet</Typography>
+                <Typography color={flashHacknet ? "error" : activeTab !== "Hacknet" ? "secondary" : "primary"}>
+                  Hacknet
+                </Typography>
               </ListItemText>
             </ListItem>
             <ListItem
@@ -545,10 +553,12 @@ export function SidebarRoot(props: IProps): React.ReactElement {
               onClick={clickCity}
             >
               <ListItemIcon>
-                <LocationCityIcon color={activeTab !== "City" ? "secondary" : "primary"} />
+                <LocationCityIcon color={flashCity ? "error" : activeTab !== "City" ? "secondary" : "primary"} />
               </ListItemIcon>
               <ListItemText>
-                <Typography color={activeTab !== "City" ? "secondary" : "primary"}>City</Typography>
+                <Typography color={flashCity ? "error" : activeTab !== "City" ? "secondary" : "primary"}>
+                  City
+                </Typography>
               </ListItemText>
             </ListItem>
             <ListItem
@@ -658,7 +668,7 @@ export function SidebarRoot(props: IProps): React.ReactElement {
               className={clsx(classes.nested, {
                 [classes.active]: activeTab === "Milestones",
               })}
-              onClick={clickTutorial}
+              onClick={clickMilestones}
             >
               <ListItemIcon>
                 <CheckIcon color={activeTab !== "Milestones" ? "secondary" : "primary"} />
@@ -673,13 +683,15 @@ export function SidebarRoot(props: IProps): React.ReactElement {
               className={clsx(classes.nested, {
                 [classes.active]: activeTab === "Tutorial",
               })}
-              onClick={clickMilestones}
+              onClick={clickTutorial}
             >
               <ListItemIcon>
-                <HelpIcon color={activeTab !== "Tutorial" ? "secondary" : "primary"} />
+                <HelpIcon color={flashTutorial ? "error" : activeTab !== "Tutorial" ? "secondary" : "primary"} />
               </ListItemIcon>
               <ListItemText>
-                <Typography color={activeTab !== "Tutorial" ? "secondary" : "primary"}>Tutorial</Typography>
+                <Typography color={flashTutorial ? "error" : activeTab !== "Tutorial" ? "secondary" : "primary"}>
+                  Tutorial
+                </Typography>
               </ListItemText>
             </ListItem>
             {/*<ListItem

src/index.html

@@ -61,7 +61,9 @@
           </table>
         </div>
 
-        <div id="generic-react-container" style="flex-grow: 1"></div>
+        <div class="generic-menupage-container">
+          <div id="generic-react-container"></div>
+        </div>
       </div>
 
       <div id="infiltration-container" class="generic-fullscreen-container"></div>