lighter color for longform copy

Recidiviz · Jul 1, 2022 · 73de768 · 73de768
1 parent 1929007
commit 73de768
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/spotlight-client/src/PageTenant/PageTenant.tsx b/spotlight-client/src/PageTenant/PageTenant.tsx
@@ -16,7 +16,7 @@
 // =============================================================================
 
 import { RouteComponentProps } from "@reach/router";
-import { typography } from "@recidiviz/design-system";
+import { palette, typography } from "@recidiviz/design-system";
 import HTMLReactParser from "html-react-parser";
 import { observer } from "mobx-react-lite";
 import { rem } from "polished";
@@ -92,6 +92,7 @@ const Title = styled.h1`
 
 const Subtitle = styled.h2`
   ${typography.Body19}
+  color: ${palette.slate85};
 `;
 
 const PageTenant: React.FC<RouteComponentProps> = () => {

diff --git a/spotlight-client/src/UiLibrary/narrative.ts b/spotlight-client/src/UiLibrary/narrative.ts
@@ -15,10 +15,11 @@
 // along with this program.  If not, see <https://www.gnu.org/licenses/>.
 // =============================================================================
 
-import { typography } from "@recidiviz/design-system";
+import { palette, typography } from "@recidiviz/design-system";
 import { rem } from "polished";
 import styled from "styled-components/macro";
 import breakpoints from "./breakpoints";
+import colors from "./colors";
 import CopyBlock from "./CopyBlock";
 import { FullScreenSection } from "./PageSection";
 import PageTitle from "./PageTitle";
@@ -41,6 +42,7 @@ export const NarrativeTitle = styled(PageTitle)`
 
 export const NarrativeIntroCopy = styled(CopyBlock)`
   ${typography.Body19}
+  color: ${palette.slate85};
 
   @media screen and (min-width: ${breakpoints.tablet[0]}px) {
     ${typography.Body48}
@@ -49,6 +51,9 @@ export const NarrativeIntroCopy = styled(CopyBlock)`
 
 export const NarrativeSectionTitle = styled.h2`
   ${typography.Header24}
+  color: ${colors.text};
 `;
 
-export const NarrativeSectionBody = styled(CopyBlock)``;
+export const NarrativeSectionBody = styled(CopyBlock)`
+  color: ${palette.slate85};
+`;