Added LayerOptionsMenu component

+Added LayerOptionsMenu component in the side menu which holds all layer-specific options together
This commit is contained in:
izawartka 2025-06-25 15:24:57 +02:00
parent 9b9262973f
commit 4729aaf998
3 changed files with 20 additions and 4 deletions

View 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>
);
}

View File

@ -18,6 +18,12 @@
gap: 1em;
}
.layer-options-menu {
display: flex;
flex-direction: column;
gap: 1em;
}
.side-menu .hidden {
visibility: hidden;
}

View File

@ -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>