diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx index 81da691f..802b5a48 100644 --- a/src/components/AppLayout.tsx +++ b/src/components/AppLayout.tsx @@ -8,6 +8,7 @@ import { IconContext } from "react-icons"; const DEFAULT_LIST_WIDTH = 200; const DEFAULT_DRAWER_WIDTH = 370; const DEFAULT_SIDEBAR_WIDTH = DEFAULT_LIST_WIDTH + DEFAULT_DRAWER_WIDTH; +const PANEL_STYLE: React.CSSProperties = { overflow: "hidden" }; const SIDEBAR_LAYOUT_ID = "maputnik:sidebar-layout"; const SIDEBAR_INNER_LAYOUT_ID = "maputnik:sidebar-inner-layout"; @@ -64,6 +65,7 @@ export const AppLayout: React.FC = (props) => { id={SIDEBAR_PANEL_ID} data-wd-key="sidebar-panel" className={props.codeEditor ? "maputnik-layout-code-editor" : "maputnik-layout-sidebar"} + style={PANEL_STYLE} defaultSize={`${DEFAULT_SIDEBAR_WIDTH}px`} minSize="280px" onResize={({inPixels}) => setSidebarWidth(inPixels)} @@ -83,6 +85,7 @@ export const AppLayout: React.FC = (props) => { id={LIST_PANEL_ID} data-wd-key="layer-list-panel" className="maputnik-layout-list" + style={PANEL_STYLE} defaultSize={`${DEFAULT_LIST_WIDTH}px`} minSize="100px" > @@ -97,6 +100,7 @@ export const AppLayout: React.FC = (props) => { @@ -113,7 +117,7 @@ export const AppLayout: React.FC = (props) => { title={t("Drag to resize the sidebar")} aria-label={t("Drag to resize the sidebar")} /> - + {props.map} diff --git a/src/styles/_layout.scss b/src/styles/_layout.scss index 54c7efd3..f3625a37 100644 --- a/src/styles/_layout.scss +++ b/src/styles/_layout.scss @@ -47,7 +47,6 @@ height: 100%; // scroll-container is position: absolute position: relative; - overflow: hidden; } &-sidebar,