1 files changed, 23 insertions, 0 deletions
diff --git a/components/ViewPort/index.tsx b/components/ViewPort/index.tsx
new file mode 100644
index 0000000..665ee00
--- /dev/null
+++ b/components/ViewPort/index.tsx
@@ -0,0 +1,23 @@
+import React, { FC } from "react"
+import styles from './index.module.scss';
+import clsx from 'clsx';
+
+export type Props = {
+    size?: "sm" | "md" | "lg";
+    className?: string;
+};
+
+const Viewport : FC<Props> = ({children, className, size}) => {
+    const _size : string = size || "md";
+    const sizeClass : string = styles['viewport-' + _size];
+
+    return (
+        <div
+            className={clsx(sizeClass, className)}
+        >
+            {children}
+        </div>
+    )
+};
+
+export default Viewport;
+\ No newline at end of file