hide terminal scrollbar

This commit is contained in:
Olivier Gagnon 2021-09-14 14:44:23 -04:00
parent 25c4f9047f
commit cb3b5b10d7
9 changed files with 49 additions and 21 deletions

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

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

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

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

File diff suppressed because one or more lines are too long

13
dist/engineStyle.css vendored

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

@ -54,7 +54,9 @@
</table> </table>
</div> </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>
<div id="infiltration-container" class="generic-fullscreen-container"></div> <div id="infiltration-container" class="generic-fullscreen-container"></div>

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

@ -61,7 +61,9 @@
</table> </table>
</div> </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>
<div id="infiltration-container" class="generic-fullscreen-container"></div> <div id="infiltration-container" class="generic-fullscreen-container"></div>