Updates to SemiCollapsibleText component.

The more/less toggles should be inline with the text. The caller should pass in the first and second halves of the content to be displayed.
2019-06-12 10:50:12 -04:00
parent e383f6f6ba
commit 4ab0975b13
4 changed files with 38 additions and 24 deletions
--- a/styles/core/_util.scss
+++ b/styles/core/_util.scss
@@ -47,17 +47,26 @@
  }
 }

-.semi-collapsed {
-  overflow: hidden;
-  height: 5.1rem;
+.section-description {
+  font-size: $lead-font-size;
 }

 .more {
-  margin-top: -4.4rem;
-  padding-left: 1.25rem;
-  background-color: $color-offwhite;
-  position: relative;
  cursor: pointer;
+  margin-left: 1rem;
+
+  .icon {
+    width: 1rem;
+    margin: 0 0 0 0.5rem;
+
+    svg * {
+      fill: $color-blue;
+    }
+
+    svg > path {
+      transform: translate(0,5px);
+    }
+  }
 }

 .green {