Merge pull request #1302 from UN-OCHA/berliner/HPC-10022

HPC-10022: Copy gho-separator component from CM
UN-OCHA · Jan 29, 2025 · 44aee24 · 44aee24
2 parents afb9aec + be9ad2e
commit 44aee24
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 0 deletions.
diff --git a/html/themes/custom/common_design_subtheme/common_design_subtheme.libraries.yml b/html/themes/custom/common_design_subtheme/common_design_subtheme.libraries.yml
@@ -210,6 +210,10 @@ gho-related-articles:
   css:
     theme:
       components/gho-related-articles/gho-related-articles.css: {}
+gho-separator:
+  css:
+    theme:
+      components/gho-separator/gho-separator.css: {}
 gho-story:
   css:
     theme:

diff --git a/html/themes/custom/common_design_subtheme/components/gho-separator/README.md b/html/themes/custom/common_design_subtheme/components/gho-separator/README.md
@@ -0,0 +1,4 @@
+HPC Content Module - Separator Component
+==================================================
+
+It's a horizontal rule. Half or Full width of the `reading-width`.
diff --git a/html/themes/custom/common_design_subtheme/components/gho-separator/gho-separator.css b/html/themes/custom/common_design_subtheme/components/gho-separator/gho-separator.css
@@ -0,0 +1,14 @@
+.gho-separator {
+  margin: 2rem 0;
+}
+.gho-separator__separator {
+  width: 100%;
+  max-width: none;
+  height: 1px;
+  margin: 0;
+  border: none;
+  background: #d8d8d8;
+}
+.gho-separator__separator--half {
+  width: var(--reading-width);
+}