diff --git a/_components/header.tsx b/_components/header.tsx
index 93d38f8..ed3ccca 100644
--- a/_components/header.tsx
+++ b/_components/header.tsx
@@ -1,17 +1,14 @@
export interface Props {
heading: string;
subheading?: string;
+ comp: any;
}
export default function(props: Props) {
return (
{ props.heading }
-
-
-
-
-
+ {props.comp.separator()}
{ props.subheading }
)
diff --git a/_components/separator.tsx b/_components/separator.tsx
new file mode 100644
index 0000000..265f28a
--- /dev/null
+++ b/_components/separator.tsx
@@ -0,0 +1,9 @@
+export default function () {
+ return (
+
+
+
+
+
+ );
+}
diff --git a/_includes/styles/base.scss b/_includes/styles/base.scss
index 3c45d7d..02fbcfa 100644
--- a/_includes/styles/base.scss
+++ b/_includes/styles/base.scss
@@ -89,21 +89,6 @@ .page-header {
.subheading {
font-style: italic;
}
- .separator {
- margin: 1rem 0;
- span {
- display: inline-block;
- vertical-align: middle;
- }
- .outer-outline {
- width: 40%;
- border: 1px solid var(--color-black);
- }
- .icon {
- font-size: 2rem;
- color: var(--color-black);
- }
- }
}
@for $i from 1 to 3 {
diff --git a/_includes/styles/components/separator.scss b/_includes/styles/components/separator.scss
new file mode 100644
index 0000000..c722492
--- /dev/null
+++ b/_includes/styles/components/separator.scss
@@ -0,0 +1,15 @@
+.separator {
+ margin: 1rem 0;
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ }
+ .outer-outline {
+ width: 40%;
+ border: 1px solid var(--color-black);
+ }
+ .icon {
+ font-size: 2rem;
+ color: var(--color-black);
+ }
+}
diff --git a/styles/main.scss b/styles/main.scss
index f20f5a0..4190d35 100644
--- a/styles/main.scss
+++ b/styles/main.scss
@@ -9,3 +9,4 @@
// Components
@import "styles/components/navbar";
+@import "styles/components/separator";