Adjust styling and stop link reloading full page

Author: leandrumartin

docusaurus.config.js

@@ -188,7 +188,7 @@ const config = {
           {
             type: 'custom-SlackButton',
             position: 'right',
-            className: 'navbar__item navbar__link button button--secondary button--lg',
+            className: 'navbar__item navbar__link',
           },
           {
             type: 'doc',

src/components/SlackButton.js

@@ -1,10 +1,15 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
 function SlackButton({ className }) {
   return (
-    <a className={className} title={"Open link to Slack channel in a new tab"} onClick={() => {
-      window.open('https://join.slack.com/t/oswslu/shared_invite/zt-24f0qhjbo-NkSfQ4LOg5wXxBdxP4vzfA', '_blank').focus()
-    }}>Contribute</a>
+    <Link
+      className={className + ' button button--secondary button--lg'}
+      title={"Open link to Slack channel in a new tab"}
+      to='/connect_with/community'
+    >
+      Contribute
+    </Link>
   )
 }