Added LayerOptionsMenu component
+Added LayerOptionsMenu component in the side menu which holds all layer-specific options together
This commit is contained in:
parent
9b9262973f
commit
4729aaf998
12
src/components/sidemenu/LayerOptionsMenu.js
Normal file
12
src/components/sidemenu/LayerOptionsMenu.js
Normal file
@ -0,0 +1,12 @@
|
||||
import ShowTrackHoverInfoCheckbox from "./ShowTrackHoverInfoCheckbox";
|
||||
import TrackColorMode from "./track-color-mode/TrackColorMode";
|
||||
|
||||
export default function LayerOptionsMenu() {
|
||||
return (
|
||||
<div className="layer-options-menu">
|
||||
<h3>Layer options</h3>
|
||||
<ShowTrackHoverInfoCheckbox />
|
||||
<TrackColorMode />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -18,6 +18,12 @@
|
||||
gap: 1em;
|
||||
}
|
||||
|
||||
.layer-options-menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1em;
|
||||
}
|
||||
|
||||
.side-menu .hidden {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@ -2,11 +2,10 @@ import {useContext} from 'react';
|
||||
import MainContext from '../../contexts/MainContext';
|
||||
import './SideMenu.css';
|
||||
import LayersMenu from './LayersMenu';
|
||||
import ShowTrackHoverInfoCheckbox from './ShowTrackHoverInfoCheckbox';
|
||||
import TrackColorMode from './track-color-mode/TrackColorMode';
|
||||
import SceneryInfoButton from './SceneryInfoButton';
|
||||
import DistanceMeterButton from './DistanceMeterButton';
|
||||
import InfoFooter from './InfoFooter';
|
||||
import LayerOptionsMenu from './LayerOptionsMenu';
|
||||
|
||||
export default function SideMenu() {
|
||||
const { sideMenuOpen } = useContext(MainContext);
|
||||
@ -19,8 +18,7 @@ export default function SideMenu() {
|
||||
<SceneryInfoButton />
|
||||
<DistanceMeterButton />
|
||||
<LayersMenu />
|
||||
<ShowTrackHoverInfoCheckbox />
|
||||
<TrackColorMode />
|
||||
<LayerOptionsMenu />
|
||||
<InfoFooter />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user