Add discord logo in dashboard (#252)

shravan20 · Oct 4, 2023 · 0b7f964 · 0b7f964
1 parent 395a4e0
commit 0b7f964
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 1 deletion.
diff --git a/frontend/src/assets/discord_logo.png b/frontend/src/assets/discord_logo.png
diff --git a/frontend/src/components/Dashboard/discord.js b/frontend/src/components/Dashboard/discord.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import DiscordLogo from '../../assets/discord_logo.png';
+
+const DiscordButton = () => {
+    const discordUrl = 'https://discord.gg/2nN2VqwNaK';
+
+    const handleDiscordButtonClick = () => {
+        window.location.href = discordUrl;
+    };
+
+    return (
+        <button
+            style={{
+                backgroundColor: 'black',
+                color: 'white',
+                padding: '10px 20px',
+                borderRadius: '5px',
+                border: 'none',
+                cursor: 'pointer',
+            }}
+            onClick={handleDiscordButtonClick}
+        >
+            <img
+                src={DiscordLogo}
+                alt="Discord Logo"
+                style={{
+                    marginRight: '10px',
+                    width: '70px',
+                    height: '30px',
+                }}
+            />
+        </button>
+    );
+};
+
+export default DiscordButton;
diff --git a/frontend/src/components/Dashboard/index.js b/frontend/src/components/Dashboard/index.js
@@ -13,7 +13,7 @@ import { getAppBarStyles } from '../../util/styles/componentStyles';
 import MoonIcon from '../../assets/moon.svg';
 import LightIcon from '../../assets/sun.svg';
 import Home from '../Pages/Home';
-
+import DiscordButton from './discord';
 function ElevationScroll(props) {
     const { children, window } = props;
     // Note that you normally won't need to set the window ref as useScrollTrigger
@@ -54,6 +54,7 @@ function Dashboard(props) {
                                 >
                                     {dashConstants.APP_NAME}
                                 </Typography>
+                                <DiscordButton />
                                 <IconButton>
                                     <a
                                         href='https://www.producthunt.com/posts/dynamic-github-profile-readme-quotes?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-dynamic-github-profile-readme-quotes'