From 0d27df0a2b40fedc9e155d09bab9bfcfdcd5c616 Mon Sep 17 00:00:00 2001 From: Rutik Date: Sun, 30 Jun 2024 19:42:05 +0530 Subject: [PATCH] Implemented fix for widget functionality, added initial version route in frontend API, and adjusted color scheme --- frontend/.gitignore | 2 +- frontend/src/App.jsx | 2 + .../ResumeUpload/ResumeUpload.module.css | 16 ++--- .../ThemeSwitcher/ThemeSwitcher.module.css | 6 +- .../src/components/Navbar/Navbar.module.css | 4 +- .../components/Widget/FixWidget/FixWidget.jsx | 33 +++++++++ .../Widget/FixWidget/FixWidget.module.css | 67 +++++++++++++++++++ frontend/src/components/Widget/User/User.jsx | 2 +- .../components/Widget/User/User.module.css | 8 ++- frontend/src/utility/envHelper/envHelper.js | 4 +- 10 files changed, 124 insertions(+), 20 deletions(-) create mode 100644 frontend/src/components/Widget/FixWidget/FixWidget.jsx create mode 100644 frontend/src/components/Widget/FixWidget/FixWidget.module.css diff --git a/frontend/.gitignore b/frontend/.gitignore index 6a7e46b..2fc25c2 100644 --- a/frontend/.gitignore +++ b/frontend/.gitignore @@ -25,4 +25,4 @@ npm-debug.log* yarn-debug.log* -yarn-error.log* +yarn-error.log* \ No newline at end of file diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index e5d97f2..3fbb951 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -22,6 +22,7 @@ import { import { ThemeProvider } from './context/exports' import { getConfig, isLoggedIn } from "./utility/exports"; import Layout from "./Layout"; +import FixWidget from "./components/Widget/FixWidget/FixWidget" export const Config = getConfig(); @@ -70,6 +71,7 @@ const App = () => { /> } /> + diff --git a/frontend/src/components/Buttons/ResumeUpload/ResumeUpload.module.css b/frontend/src/components/Buttons/ResumeUpload/ResumeUpload.module.css index 681b645..356c3d7 100644 --- a/frontend/src/components/Buttons/ResumeUpload/ResumeUpload.module.css +++ b/frontend/src/components/Buttons/ResumeUpload/ResumeUpload.module.css @@ -2,7 +2,7 @@ display: flex; align-items: center; padding: 20px; - border: 0.01px solid var(--color-gray); + border: 1px solid var(--input-border-color); border-radius: 8px; background-color: var(--secondary-color); color: var(--text-color); @@ -40,6 +40,10 @@ margin-right: 20px; } +.fileInput { + display: none; +} + .buttonContainer { display: flex; align-items: center; @@ -52,23 +56,15 @@ font-size: 20px; } -.fileInput { - display: none; -} - .browseButton { padding: 10px 20px; - border: 0.1px solid var(--color-gray); + border: 1px solid var(--input-border-color); border-radius: 4px; background-color: var(--button-bg-color); cursor: pointer; color: var(--text-color); } -.deleteButton:hover { - background-color: var(--button-bg-color-hover); -} - .deleteButton svg { margin-right: 5px; } diff --git a/frontend/src/components/Buttons/ThemeSwitcher/ThemeSwitcher.module.css b/frontend/src/components/Buttons/ThemeSwitcher/ThemeSwitcher.module.css index 65e6605..9f2bc25 100644 --- a/frontend/src/components/Buttons/ThemeSwitcher/ThemeSwitcher.module.css +++ b/frontend/src/components/Buttons/ThemeSwitcher/ThemeSwitcher.module.css @@ -38,7 +38,7 @@ } input:checked + .slider { - background-color: #4caf50; + background-color: #4b9f3a; } input:checked + .slider:before { @@ -63,7 +63,7 @@ input:checked + .slider:before { background: none; cursor: pointer; color: var(--icon-color); - transition: background-color 0.5s ease; + transition: background-color 0.5s ease; } .themeSwitcherSwitch[data-active="true"] { @@ -76,4 +76,4 @@ input:checked + .slider:before { width: 32px; height: 28px; } -} \ No newline at end of file +} diff --git a/frontend/src/components/Navbar/Navbar.module.css b/frontend/src/components/Navbar/Navbar.module.css index fe23450..9d4eca7 100644 --- a/frontend/src/components/Navbar/Navbar.module.css +++ b/frontend/src/components/Navbar/Navbar.module.css @@ -2,8 +2,8 @@ width: 100vw; /* position: sticky; top: 0; - left: 0; - z-index: 1000; */ + left: 0; */ + z-index: 1; background-color: var(--navbar-bg-color); padding: 10px 20px; display: flex; diff --git a/frontend/src/components/Widget/FixWidget/FixWidget.jsx b/frontend/src/components/Widget/FixWidget/FixWidget.jsx new file mode 100644 index 0000000..9a9ee5f --- /dev/null +++ b/frontend/src/components/Widget/FixWidget/FixWidget.jsx @@ -0,0 +1,33 @@ +import React from "react"; +import { FaRocket } from "react-icons/fa"; +import { PiRocketLaunch } from "react-icons/pi"; +import styles from "./FixWidget.module.css"; + +const FixWidget = () => { + const handleClick = () => { + window.open("https://referral-network-hub.vercel.app/", "_blank"); + }; + + return ( + <> +
+
+ +
+
+
+
+

+ Be the first to experience our latest updates!{" "} + + Sign up now for early access{" "} + + +

+
+
+ + ); +}; + +export default FixWidget; diff --git a/frontend/src/components/Widget/FixWidget/FixWidget.module.css b/frontend/src/components/Widget/FixWidget/FixWidget.module.css new file mode 100644 index 0000000..50e47d7 --- /dev/null +++ b/frontend/src/components/Widget/FixWidget/FixWidget.module.css @@ -0,0 +1,67 @@ +.widgetContainer { + position: fixed; + bottom: 20px; + right: 20px; + z-index: 1000; +} + +.widget { + width: 50px; + height: 50px; + background-color: #ffd700; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + transition: transform 0.2s; +} + +.widget:hover { + transform: scale(1.1); +} + +.icon { + color: #000; +} + +.blueIcon { + color: #0062ff; + vertical-align: middle; + font-size: 24px; +} + +.desktopWidget { + display: none; + background-color: var(--bg-component-yellow); + color: #000; + padding: 20px; + border-radius: 8px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + font-family: poppins; + letter-spacing: 0.5px; + text-align: center; +} + +.desktopWidget span { + color: #0062ff; + font-weight: 500; + cursor: pointer; +} + +@media (min-width: 768px) { + .widget { + display: none; + } + .desktopWidget { + display: block; + } +} + +@media (max-width: 767px) { + .tooltip { + top: -40px; + left: 50%; + transform: translateX(-50%); + } +} diff --git a/frontend/src/components/Widget/User/User.jsx b/frontend/src/components/Widget/User/User.jsx index c4bb9c4..5e772b0 100644 --- a/frontend/src/components/Widget/User/User.jsx +++ b/frontend/src/components/Widget/User/User.jsx @@ -55,7 +55,7 @@ const Widget = React.forwardRef((props, ref) => {

Pune, Maharashtra

-
+
My Account diff --git a/frontend/src/components/Widget/User/User.module.css b/frontend/src/components/Widget/User/User.module.css index bb21cbf..a5e4f9f 100644 --- a/frontend/src/components/Widget/User/User.module.css +++ b/frontend/src/components/Widget/User/User.module.css @@ -49,9 +49,15 @@ color: gray; } +.fullDivider { + border-top: 1px solid var(--input-border-color); + margin: 10px 0; +} + .divider { - border-top: 1px solid #eee; + border-top: 1px solid var(--input-border-color); margin: 10px 0; + width: 50%; } .menuItem { diff --git a/frontend/src/utility/envHelper/envHelper.js b/frontend/src/utility/envHelper/envHelper.js index ff5807a..eac64b0 100644 --- a/frontend/src/utility/envHelper/envHelper.js +++ b/frontend/src/utility/envHelper/envHelper.js @@ -25,9 +25,9 @@ export const getConfig = () => { return { endpoint: REACT_ENV === "development" - ? "http://localhost:8082/api/" + ? "http://localhost:8082/api/v1" : REACT_ENV === "deployment" - ? "https://referralnetworkhub.onrender.com/api/" + ? "https://referralnetworkhub.onrender.com/api/v1" : "", }; };