Scoped global styling to all markdown

Make React compatible with markdown-style HTML by added components
with identical styling to markdown. This is done while CSS scoping
is maintained. Additional style is loaded through the markdown loader
by injecting default-styling tags into the components. This allows
default-margin to be added to these elements in addition to the styling
found in the React elements. The homepage reflects the domain, as defined
by an environmental variable.

2 files changed, 0 insertions, 111 deletions

diff --git a/components/Typography/index.tsx b/components/Typography/index.tsx
deleted file mode 100644
index b9babc0..0000000
--- a/components/Typography/index.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import React from 'react';
-import styles from './typo.module.scss';
-import clsx from 'clsx';
-
-
-type Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'body';
-type Align = 'inherit' | 'left' | 'center' | 'right';
-
-interface TypographyProps extends React.HTMLAttributes<HTMLElement> {
-    variant?: Variant;
-    align?: Align;
-    gutter?: boolean;
-}
-
-const variantTagMap: Record<Variant, keyof JSX.IntrinsicElements> = {
-    h1: 'h1',
-    h2: 'h2',
-    h3: 'h3',
-    h4: 'h4',
-    h5: 'h5',
-    h6: 'h6',
-    body: 'p'
-};
-
-const Typography: React.FC<TypographyProps> = ({
-    variant = 'body',
-    align = 'inherit',
-    gutter = false,
-    className,
-    ...props
-}) => {
-    const Tag = variantTagMap[variant] as keyof React.ReactHTML;
-
-    const typographyClassName = clsx(
-        styles[`typo-${variant}`],
-        {
-            [`align-${align}`]: align !== 'inherit',
-            [styles['typo-gutter']]: gutter
-        },
-        className
-    );
-
-    return <Tag className={typographyClassName} {...props} />;
-};
-
-export default Typography;
-
diff --git a/components/Typography/typo.module.scss b/components/Typography/typo.module.scss
deleted file mode 100644
index 934333d..0000000
--- a/components/Typography/typo.module.scss
+++ /dev/null
@@ -1,64 +0,0 @@
-.typo-h1 {
-    font-size: 2.8rem;
-    font-weight: 300;
-    line-height: 1.167;
-    letter-spacing: -0.01562em;
-    // margin-top: 1.0rem;
-    // margin-bottom: 1rem;
-
-    padding-bottom: 0.4rem;
-    border-bottom: 0.12rem solid rgb(53, 53, 53);
-}
-
-.typo-h2 {
-    font-size: 2.3rem;
-    font-weight: 300;
-    line-height: 1.2;
-    letter-spacing: -0.00833em;
-
-    // margin-top: 1.6rem;
-    // margin-bottom: 0.8rem;
-}
-
-.typo-h3 {
-    font-size: 1.3rem;
-    font-weight: 400;
-    line-height: 1.167;
-    letter-spacing: 0em;
-
-    // margin-top: 1.3rem;
-    // margin-bottom: 0.5rem;
-}
-
-.typo-h4 {
-    font-size: 1.25rem;
-}
-
-.typo-h5 {
-    font-size: 1.15rem;
-}
-
-.typo-h6 {
-    font-size: 1.10rem;
-}
-
-.typo-h4, .typo-h5, .typo-h6 {
-    // margin-top: 0.8rem;
-    // margin-bottom: 0.6rem;
-}
-
-.typo-p {
-    font-size: 1rem;
-    letter-spacing: 0.00938em;
-    font-weight: 300;
-}
-
-.typo-p {
-    font-size: 1rem;
-    line-height: 1.5;
-    // margin-bottom: 1em;
-}
-
-.typo-gutter {
-    margin-bottom: 0.35em;
-}