style:

filipowm · Aug 1, 2020 · 06cdd62 · 06cdd62
1 parent 892a19b
commit 06cdd62
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 32 deletions.
diff --git a/src/components/MdxComponents/accordion.js b/src/components/MdxComponents/accordion.js
@@ -5,11 +5,12 @@ import Collapsible from 'react-collapsible';
 import { ChevronUp, ChevronDown } from 'react-feather';
 import { renderToStaticMarkup } from 'react-dom/server';
 import emoji from '../../utils/emoji';
+import { shadowAround } from '../../styles';
 
 const AccordionWrapper = styled.div`
 margin: 10px 0;
 & > div {
-    box-shadow: 0 0 6px 0 ${(props) => props.theme.header.shadow};
+    ${(props) => shadowAround(props.theme)};
     border-radius: 4px;
 
     & > span {

diff --git a/src/components/MdxComponents/linkCard.js b/src/components/MdxComponents/linkCard.js
@@ -8,44 +8,44 @@ import { shadowAround } from '../../styles';
 import { decreaseIntensivity } from '../../utils/colors';
 
 const BigLinkWrapper = styled.div`
-display: flex;
-cursor: pointer;
-width: 100%;
-padding: 16px;
-margin: 10px 0;
-border-radius: 4px;
-border: 1px solid transparent;
-align-items: center;
-transition: ${(props) => props.theme.transitions.hover};
-&:hover {
-  border: 1px solid ${(props) => props.theme.colors.primary};
-}
+  display: flex;
+  cursor: pointer;
+  width: 100%;
+  padding: 16px;
+  margin: 10px 0;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  align-items: center;
+  transition: ${(props) => props.theme.transitions.hover};
+  &:hover {
+    border: 1px solid ${(props) => props.theme.colors.primary};
+  }
 `;
 
 const LinkPath = styled.div`
-color: ${(props) => decreaseIntensivity(props.theme.colors.fontLight, 0.25)};
-font-size: 9pt;
-padding-left: 16px;
+  color: ${(props) => decreaseIntensivity(props.theme.colors.fontLight, 0.25)};
+  font-size: 9pt;
+  padding-left: 16px;
 `;
 
 const Title = styled.div`
-flex: 1 0;
-padding: 0 14px;
-color: ${(props) => props.theme.colors.primary};
-font-size: 12pt;
-font-weight: 500;
+  flex: 1 0;
+  padding: 0 14px;
+  color: ${(props) => props.theme.colors.primary};
+  font-size: 12pt;
+  font-weight: 500;
 `;
 
 export default ({ title, url }) => {
-    const theme = useTheme();
-    const path = url.replace(/(https:\/\/)|(http:\/\/)/, "");
-    return (
-      <Link to={url}>
-        <BigLinkWrapper css={shadowAround}>
-          <ArrowRight color={theme.colors.primary} size={23} />
-          <Title>{emoji.emojify(title)}</Title>
-          <LinkPath>{path}</LinkPath>
-        </BigLinkWrapper>
-      </Link>
-    );
+  const theme = useTheme();
+  const path = url.replace(/(https:\/\/)|(http:\/\/)/, '');
+  return (
+    <Link to={url}>
+      <BigLinkWrapper css={shadowAround}>
+        <ArrowRight color={theme.colors.primary} size={23} />
+        <Title>{emoji.emojify(title)}</Title>
+        <LinkPath>{path}</LinkPath>
+      </BigLinkWrapper>
+    </Link>
+  );
 };