maintenance

src/components/layout/index.tsx

@@ -0,0 +1,57 @@
+/**
+ * Copyright 2024 Phenix Real Time Solutions, Inc. Confidential and Proprietary. All Rights Reserved.
+ */
+import * as styled from 'styled-components';
+import Theme from 'theme';
+
+interface IColumn {
+  align?: string;
+  size?: number;
+  padding?: string;
+}
+
+const {footerHeight} = Theme;
+
+export const AppContainer = styled.default.div`
+  margin: 3.5rem 0 ${footerHeight};
+  height: calc(100vh - 3.5rem - ${footerHeight});
+  overflow: auto;
+  display: flex;
+  overflow-x: hidden;
+`;
+
+export const Body = styled.default.div`
+  width: 100%;
+  margin: 4rem 0;
+  padding: 0 ${Theme.spacing.xlarge};
+  background: ${Theme.colors.gray900};
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  min-height: calc(100vh - 2rem);
+  overflow: auto;
+  max-height: calc(100vh - 2rem);
+  max-width: calc(100vw - 2rem);
+`;
+
+export const Row = styled.default.div`
+  display: flex;
+`;
+
+export const Column = styled.default.div<IColumn>`
+  flex: ${({size}): number => size || 1};
+  text-align: ${({align}): string => align || 'right'};
+  ${({padding}) =>
+    padding &&
+    styled.css`
+      padding: ${padding};
+    `}
+`;
+
+export const Main = styled.default.div`
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 2rem;
+`;