diff --git a/index.html b/index.html index ec129ff..93462b2 100644 --- a/index.html +++ b/index.html @@ -1,23 +1,21 @@ - - - - - SGPT - - - - - - -
- - - + + + + + + SGPT + + + + + + + +
+ + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 89ceb19..4f14235 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,8 +16,7 @@ "react-dom": "^18.2.0", "react-icons": "^4.7.1", "react-router-dom": "^6.8.2", - "sort-by": "^0.0.2", - "tailwindcss-brand-colors": "^0.3.3" + "sort-by": "^0.0.2" }, "devDependencies": { "@types/react": "^18.0.27", @@ -1603,11 +1602,6 @@ "postcss": "^8.0.9" } }, - "node_modules/tailwindcss-brand-colors": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/tailwindcss-brand-colors/-/tailwindcss-brand-colors-0.3.3.tgz", - "integrity": "sha512-qNgt9e3q/1cF31jzQO5SRTfgJehqNKulgQx/ePpQgvxh8W5ATHzttW5MEOEZa6uyL4z92bk1YFHU2g6WfE9j6Q==" - }, "node_modules/tailwindcss/node_modules/postcss-import": { "version": "14.1.0", "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-14.1.0.tgz", diff --git a/package.json b/package.json index 6245e4d..e759d44 100644 --- a/package.json +++ b/package.json @@ -17,8 +17,7 @@ "react-dom": "^18.2.0", "react-icons": "^4.7.1", "react-router-dom": "^6.8.2", - "sort-by": "^0.0.2", - "tailwindcss-brand-colors": "^0.3.3" + "sort-by": "^0.0.2" }, "devDependencies": { "@types/react": "^18.0.27", diff --git a/public/robot-logo.png b/public/robot-logo.png new file mode 100644 index 0000000..ce70b6b Binary files /dev/null and b/public/robot-logo.png differ diff --git a/src/assets/react.svg b/src/assets/react.svg deleted file mode 100644 index 6c87de9..0000000 --- a/src/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/shared/components/Header.tsx b/src/shared/components/Header.tsx index a0fd101..c8cc984 100644 --- a/src/shared/components/Header.tsx +++ b/src/shared/components/Header.tsx @@ -30,9 +30,17 @@ const menuItems = [ const Header = (props: Props) => { const [isScrolled, setIsScrolled] = React.useState(false); + const [isOpenMenu, setIsOpenMenu] = React.useState(false); + const [isMobile, setIsMobile] = React.useState(false); React.useEffect(() => { - // check is mobile or tablet + // check is mobile + if (window.innerWidth <= 768) { + setIsMobile(true); + } else { + setIsMobile(false); + } + if (window.innerWidth <= 1024) { setIsScrolled(true); } else { @@ -77,36 +85,86 @@ const Header = (props: Props) => { -
- + { + // Mobile menu + isMobile ? ( +
setIsOpenMenu(!isOpenMenu)} + > +
+
+
+
+ ) : ( +
+ -
- +
- - -
-
+ + ) : null + } ) : ( diff --git a/src/shared/components/home/FirstSection.tsx b/src/shared/components/home/FirstSection.tsx index 6aceaae..8780622 100644 --- a/src/shared/components/home/FirstSection.tsx +++ b/src/shared/components/home/FirstSection.tsx @@ -13,6 +13,39 @@ import { import { MdContentCopy } from "react-icons/md"; import { useSprings, useSpring, animated } from "@react-spring/web"; +const socials = [ + { + name: "Telegram", + icon: , + link: "https://twitter.com/SGPT_SmartAi", + background: "bg-[#2ca5e0]", + }, + { + name: "Twitter", + icon: , + link: "https://twitter.com/SGPT_SmartAi", + background: "bg-[#1da1f2]", + }, + { + name: "Discord", + icon: , + link: "https://discord.com/invite/NNHV8JHBhk", + background: "bg-[#7289da]", + }, + { + name: "Facebook", + icon: , + link: "https://www.facebook.com/SGPTSmartAi", + background: "bg-[#3b5998]", + }, + { + name: "Instagram", + icon: , + link: "https://www.instagram.com/sgpt_smartai/", + background: "bg-[#e1306c]", + }, +]; + const FirstSection = () => { const address = "0x3c97331438e90680a17c35905ffc2b8ef760f844"; const truncateAddress = (address: string) => { @@ -56,36 +89,18 @@ const FirstSection = () => {

Join Our Community

- - - - - + {socials.map((social) => ( + + ))}
diff --git a/tailwind.config.cjs b/tailwind.config.cjs index c421b56..f57a2db 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -14,6 +14,5 @@ module.exports = { tailwindcss: {}, autoprefixer: {}, }, - require("tailwindcss-brand-colors"), ], };