From cc1b71651dec21205f44f27ac59840edb3e616ad Mon Sep 17 00:00:00 2001
From: Fred Carlsen <fred@sjelfull.no>
Date: Mon, 10 Dec 2018 15:19:52 +0100
Subject: Add active styling to chapter link

---
 packages/website/ts/@next/components/chapter_link.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
 create mode 100644 packages/website/ts/@next/components/chapter_link.tsx

(limited to 'packages/website/ts/@next/components/chapter_link.tsx')

diff --git a/packages/website/ts/@next/components/chapter_link.tsx b/packages/website/ts/@next/components/chapter_link.tsx
new file mode 100644
index 000000000..786c76bec
--- /dev/null
+++ b/packages/website/ts/@next/components/chapter_link.tsx
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { NavLink as ReactRouterLink } from 'react-router-dom';
+import styled from 'styled-components';
+
+export const ChapterLink = styled(ReactRouterLink).attrs({
+    activeStyle: { opacity: 1 },
+})`
+    font-size: 1.222222222rem;
+    display: block;
+    opacity: 0.5;
+    margin-bottom: 1.666666667rem;
+
+    &:hover {
+        opacity: 1;
+    }
+`;
-- 
cgit v1.2.3

