my-links/inertia/components/layouts/dashboard_layout.tsx

import styled from '@emotion/styled';
import { ReactNode } from 'react';
import TransitionLayout from '~/components/layouts/_transition_layout';
import BaseLayout from './_base_layout';

const DashboardLayoutStyle = styled(TransitionLayout)(({ theme }) => ({
  height: '100%',
  width: theme.media.medium_desktop,
  maxWidth: '100%',
  padding: '0.75em 1em',
}));

const DashboardLayout = ({ children }: { children: ReactNode }) => (
  <BaseLayout>
    <DashboardLayoutStyle>{children}</DashboardLayoutStyle>
  </BaseLayout>
);

export default DashboardLayout;