diff --git a/web/src/components/blocks/HorizontalRuleBlock.tsx b/web/src/components/blocks/HorizontalRuleBlock.tsx
index 4741763..4115cfd 100644
--- a/web/src/components/blocks/HorizontalRuleBlock.tsx
+++ b/web/src/components/blocks/HorizontalRuleBlock.tsx
@@ -1,6 +1,6 @@
import { HorizontalRuleBlock as HorizontalRuleBlockType } from "@/gql/graphql";
import Image from "../general/Image";
-import styles from "./imageWithTextBlock.module.scss";
+import styles from "./horizontalRuleBlock.module.scss";
export const HorizontalRuleBlock = ({
block,
@@ -20,5 +20,58 @@ export const HorizontalRuleBlock = ({
? block.color
: defaultColor;
- return
;
+ return (
+
+
+
+ );
};
diff --git a/web/src/components/blocks/horizontalRuleBlock.module.scss b/web/src/components/blocks/horizontalRuleBlock.module.scss
index e69de29..956b3f9 100644
--- a/web/src/components/blocks/horizontalRuleBlock.module.scss
+++ b/web/src/components/blocks/horizontalRuleBlock.module.scss
@@ -0,0 +1,38 @@
+.horizontalRuleBlock {
+ height: 3rem;
+ width: 100%;
+ //max-width: calc(var(--size-width-p) + (var(--spacing-sitepadding)/2));
+ max-width: var(--size-width-p);
+ margin: 1rem auto 4rem;
+ overflow: hidden;
+ position: relative;
+
+ &[data-color="deepBrick"] {
+ color: var(--color-deepBrick);
+ }
+
+ &[data-color="neufPink"] {
+ color: var(--color-neufPink);
+ }
+
+ &[data-color="goldenOrange"] {
+ color: var(--color-goldenOrange);
+ }
+
+ &[data-color="goldenBeige"] {
+ color: var(--color-goldenBeige);
+ }
+
+ &[data-color="chateauBlue"] {
+ color: var(--color-chateauBlue);
+ }
+
+ svg {
+ display: block;
+ height: 100%;
+ margin: 0 auto;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-52%);
+ }
+}
\ No newline at end of file
diff --git a/web/src/components/blocks/richTextBlock.module.scss b/web/src/components/blocks/richTextBlock.module.scss
index 025af0b..9b012a4 100644
--- a/web/src/components/blocks/richTextBlock.module.scss
+++ b/web/src/components/blocks/richTextBlock.module.scss
@@ -116,4 +116,13 @@
padding: .6rem 0;
max-width: var(--size-width-p);
}
+
+ hr {
+ margin: 2rem auto;
+ max-width: var(--size-width-p);
+ border: none;
+ height: 1px;
+ background: var(--color-text);
+ opacity: .2;
+ }
}
\ No newline at end of file