From 2c08f9773caac4f103c3b79e3451bf74a7eb2ca1 Mon Sep 17 00:00:00 2001
From: Jean-Philippe Sirois <jp@veksen.net>
Date: Wed, 26 Aug 2020 17:48:21 -0400
Subject: [PATCH] ui(about): restyle discord `join us` button

---
 src/components/DiscordButton/index.tsx  | 1 +
 src/components/DiscordButton/styles.tsx | 3 +--
 src/components/Home/styles.tsx          | 1 +
 src/components/Markdown/styles.tsx      | 2 +-
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/DiscordButton/index.tsx b/src/components/DiscordButton/index.tsx
index 4471143..9508f9d 100644
--- a/src/components/DiscordButton/index.tsx
+++ b/src/components/DiscordButton/index.tsx
@@ -4,6 +4,7 @@ import * as SC from "./styles"
 export const DiscordButton: FC = ({ children }) => {
   return (
     <SC.DiscordButtonWrapper
+      className="button"
       rel="noreferrer"
       href="https://discord.gg/programming"
     >
diff --git a/src/components/DiscordButton/styles.tsx b/src/components/DiscordButton/styles.tsx
index 6b9dcd4..cc90516 100644
--- a/src/components/DiscordButton/styles.tsx
+++ b/src/components/DiscordButton/styles.tsx
@@ -2,8 +2,7 @@ import styled from "styled-components"
 import DiscordLogo from "../../images/discord-logo.svg"
 
 export const DiscordButtonWrapper = styled.a`
-  margin-top: 32px;
-  display: flex;
+  display: inline-flex;
   align-items: center;
   font-family: "Montserrat", sans-serif;
   font-size: 24px;
diff --git a/src/components/Home/styles.tsx b/src/components/Home/styles.tsx
index 8438f99..75342e5 100644
--- a/src/components/Home/styles.tsx
+++ b/src/components/Home/styles.tsx
@@ -94,6 +94,7 @@ export const Menu = styled.nav`
   display: flex;
   justify-content: flex-start;
   flex-wrap: wrap;
+  margin-bottom: 32px;
 `
 
 export const MenuItemText = styled.div`
diff --git a/src/components/Markdown/styles.tsx b/src/components/Markdown/styles.tsx
index 30f506c..c39a773 100644
--- a/src/components/Markdown/styles.tsx
+++ b/src/components/Markdown/styles.tsx
@@ -167,7 +167,7 @@ export const MarkdownWrapper = styled.div`
     padding-left: ${BASE_LINE_HEIGHT}px;
   }
 
-  a:not(.anchor) {
+  a:not(.anchor):not(.button) {
     display: inline-block;
     position: relative;
     font-weight: 700;