style: fix style for timelinemarker guide

nexxtway · Jan 15, 2021 · 2986bfd · 2986bfd
1 parent 81a2004
commit 2986bfd
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/components/TimelineMarker/styled/columnLeft.js b/src/components/TimelineMarker/styled/columnLeft.js
@@ -1,5 +1,8 @@
 import styled from 'styled-components';
 import attachThemeAttrs from '../../../styles/helpers/attachThemeAttrs';
+import { getContrastText, replaceAlpha } from '../../../styles/helpers/color';
+
+const getColor = props => replaceAlpha(getContrastText(props.palette.background.main), 0.1);
 
 const StyledColumnLeft = attachThemeAttrs(styled.div)`
     display: flex;
@@ -9,7 +12,7 @@ const StyledColumnLeft = attachThemeAttrs(styled.div)`
 
     ::before {
         content: '';
-        background-color: ${props => props.palette.background.highlight};
+        background-color: ${props => getColor(props)};
         height: 100%;
         width: 1px;
         position: absolute;