import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import styled from 'styled-components';
import { navbarHeight } from '../../../style/theme';
const LayoutContainer = styled.div `
  display: flex;
  flex-direction: column;
  height: 100vh;
  box-sizing: border-box;
  background: ${props => props.variant === 'transparent' ? 'transparent' : props.theme.backgroundLevel1};
`;
const Navigation = styled.div `
  height: ${navbarHeight};
`;
export function Layout({ children: app, headerNavigation, variant, }) {
    return (_jsxs(LayoutContainer, { className: "layout-container", variant: variant, children: [_jsx(Navigation, { children: headerNavigation }), app] }));
}
