From 2e626d114a94adcb1b121613ea40b1a6f61bc889 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lo=C3=AFc=20F=C3=BCrhoff?= Date: Fri, 30 Apr 2021 11:03:54 +0200 Subject: [PATCH] feat: theme add links underline options --- src/components/Markdown/styled.elements.tsx | 5 +++-- src/theme.ts | 12 ++++++++++-- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/src/components/Markdown/styled.elements.tsx b/src/components/Markdown/styled.elements.tsx index 64a0be9a..bae99963 100644 --- a/src/components/Markdown/styled.elements.tsx +++ b/src/components/Markdown/styled.elements.tsx @@ -6,7 +6,7 @@ import { StyledComponent } from 'styled-components'; export const linksCss = css` a { - text-decoration: none; + text-decoration: ${props => props.theme.typography.links.textDecoration}; color: ${props => props.theme.typography.links.color}; &:visited { @@ -14,7 +14,8 @@ export const linksCss = css` } &:hover { - color: ${props => props.theme.typography.links.hover}; + color: ${props => props.theme.typography.links.hover.color}; + text-decoration: ${props => props.theme.typography.links.hover.textDecoration}; } } `; diff --git a/src/theme.ts b/src/theme.ts index 8856451f..45546a60 100644 --- a/src/theme.ts +++ b/src/theme.ts @@ -127,7 +127,11 @@ const defaultTheme: ThemeInterface = { links: { color: ({ colors }) => colors.primary.main, visited: ({ typography }) => typography.links.color, - hover: ({ typography }) => lighten(0.2, typography.links.color), + hover: { + color: ({ typography }) => lighten(0.2, typography.links.color), + textDecoration: ({ typography }) => typography.links.textDecoration, + }, + textDecoration: 'none' }, }, sidebar: { @@ -306,7 +310,11 @@ export interface ResolvedThemeInterface { links: { color: string; visited: string; - hover: string; + hover: { + color: string; + textDecoration: string; + }; + textDecoration: string; }; }; sidebar: {