import classNames from "classnames";
import React from "react";
type Props = {
  /**
   * Content of component
   */
  children: React.ReactNode;
  /**
   * Display variants of container
   */
  variant?: "straight" | "wide";
  /**
   * Component styling
   */
  className?: string;
};
/**
 * Main container to handle page content max-width on
 * different screen sizes
 */
export default function Container({ children, variant, className }: Props) {
  const wideClass = variant == "straight" ? "container" : "container-wide";
  return (
    <div className={classNames("mx-auto", wideClass, className)}>
      {children}
    </div>
  );
}