Siddhesh.More/rubix
1
0
Fork 0
mirror of https://github.com/WDI-Ideas/rubix.git synced 2026-04-28 18:05:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

conflict merge community banner

Browse Source
This commit is contained in:
YasinShaikh123
2024-04-17 18:50:35 +05:30
parent 83a836741c 1172d9c37f
commit 0a822b3c04
12 changed files with 187 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/BuildPage/BuildBanner.jsx
View File

@@ -16,7 +16,7 @@ const BannerContent = [
},
];
const BuildBanner = () => {
const BuildBanner = () => {
return (
<Box
height={"100vh"}
@@ -87,12 +87,15 @@ const BuildBanner = () => {
{BannerContent[0].heading2}
</span>
</Text>
<Box marginTop={"1.5rem"} width={"80%"}
sx={{
"@media (max-width: 500px)": {
width: "100%",
},
}}>
<Box
marginTop={"1.5rem"}
width={"80%"}
sx={{
"@media (max-width: 500px)": {
width: "100%",
},
}}
>
<Text
color={"#fff"}
fontSize={"20px"}

4
src/components/Card/CommCard.jsx
View File

@@ -6,7 +6,7 @@ import linkedin from "../../assets/images/linkedin.png";
import games from "../../assets/images/discot.png";
import { Link } from "react-router-dom";
const CommCard = ({ id, imageUrl, name, jobTitle, description, location }) => {
const CommCard = ({ id, imageUrl, name, jobTitle, description, link }) => {
return (
<Box
// height={"100vh"}
@@ -47,7 +47,7 @@ const CommCard = ({ id, imageUrl, name, jobTitle, description, location }) => {
borderLeft: "1px solid #ffffff70",
}}
>
<Link>
<Link to={link} target="_blank">
<img
src={linkedin}
style={{ minWidth: "34px", height: "34px", marginBottom: "10px" }}

119
src/components/Community/CommunityBanner.jsx
View File

@@ -1,7 +1,7 @@
/* eslint-disable react/prop-types */
/* eslint-disable react/no-unknown-property */
import { Box, Button, Container, Text } from "@chakra-ui/react";
import banner from "../../assets/images/communityBanner.webp";
import { Link } from "react-router-dom";
const BannerContent = [
{
@@ -18,7 +18,7 @@ const BannerContent = [
},
];
const CommunityBanner = () => {
const CommunityBanner = ({ onClick }) => {
return (
<Box
height={"100vh"}
@@ -125,65 +125,64 @@ const CommunityBanner = () => {
{BannerContent[1].subheading}
</Text>
</Box>
<Link to="" target="_blank">
<Button
position={"relative"}
backgroundColor={"transparent"}
cursor={"pointer"}
transition="0.3s ease-in-out"
color={"#fff"}
width={"280px"}
height={"54px"}
fontFamily={"Poppins"}
fontWeight={"400"}
border={"1px solid white"}
borderRadius={"10px"}
fontSize={"18px"}
zIndex={"1"}
overflow={"hidden"}
marginTop={"2rem"}
sx={{
"::before": {
content: '""',
position: "absolute",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
width: "65px",
height: "65px",
borderRadius: "50%",
transition: "0.35s linear",
zIndex: -1,
bgGradient:
"radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
opacity: "0",
},
"&:hover::before": {
width: "100%",
height: "120%",
borderRadius: "0px",
opacity: "1",
},
"@media (max-width: 500px)": {
fontSize: "14px",
width: "230px",
height: "44px",
marginTop: "2rem",
bgGradient:
"radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
color: "#000",
fontWeight: "600",
},
}}
_hover={{
<Button
onClick={onClick}
position={"relative"}
backgroundColor={"transparent"}
cursor={"pointer"}
transition="0.3s ease-in-out"
color={"#fff"}
width={"280px"}
height={"54px"}
fontFamily={"Poppins"}
fontWeight={"400"}
border={"1px solid white"}
borderRadius={"10px"}
fontSize={"18px"}
zIndex={"1"}
overflow={"hidden"}
marginTop={"2rem"}
sx={{
"::before": {
content: '""',
position: "absolute",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
width: "65px",
height: "65px",
borderRadius: "50%",
transition: "0.35s linear",
zIndex: -1,
bgGradient:
"radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
opacity: "0",
},
"&:hover::before": {
width: "100%",
height: "120%",
borderRadius: "0px",
opacity: "1",
},
"@media (max-width: 500px)": {
fontSize: "14px",
width: "230px",
height: "44px",
marginTop: "2rem",
bgGradient:
"radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
color: "#000",
border: "1px solid white",
zIndex: 1,
}}
>
{BannerContent[2].btn}
</Button>
</Link>
fontWeight: "600",
},
}}
_hover={{
color: "#000",
border: "1px solid white",
zIndex: 1,
}}
>
{BannerContent[2].btn}
</Button>
</Box>
</Container>
</Box>

7
src/components/Community/CommunityCard.jsx
View File

@@ -1,3 +1,4 @@
/* eslint-disable react/prop-types */
/* eslint-disable no-unused-vars */
import {
Box,
@@ -46,7 +47,7 @@ const individuals = [
{
location: "india",
name: "Hari Krishnan",
jobTitle: "Chief Growth Officer",
jobTitle: "Head of Technology",
description:
"Deeply passionate about Cryptography, Zero Knowledge Proofs, and Number Theory.",
imageUrl: imgthree,
@@ -77,7 +78,7 @@ const individuals = [
description:
"A motivated and responsible B tech Graduate, with a strong work ethic.",
imageUrl: imgfive,
link: ` https://www.linkedin.com/in/allen-iype-p-cherian/`,
link: `https://www.linkedin.com/in/allen-iype-p-cherian/`,
},
{
location: "india",
@@ -158,6 +159,7 @@ const CommunityCard = () => {
textAlign={"center"}
textTransform={"capitalize"}
color={"#fff"}
id="rubix-community"
sx={{
"@media (max-width: 435px)": {
fontSize: "35px",
@@ -182,6 +184,7 @@ const CommunityCard = () => {
jobTitle={item.jobTitle}
description={item.description}
imageUrl={item.imageUrl}
link={item.link}
/>
))}
</SimpleGrid>

16
src/components/MobileComponent/MobileCommunityCard.jsx
View File

@@ -108,14 +108,14 @@ const individuals = [
"A highly keen blockchain engineer with a zeal for innovation who brings new ideas to the table.",
imageUrl: imgnine,
},
{
location: "india",
name: "Maneesha Panda",
jobTitle: "Blockchain Engineer",
description:
"A highly keen blockchain engineer with a zeal for innovation who brings new ideas to the table.",
imageUrl: imgnine,
},
// {
// location: "india",
// name: "Maneesha Panda",
// jobTitle: "Blockchain Engineer",
// description:
// "A highly keen blockchain engineer with a zeal for innovation who brings new ideas to the table.",
// imageUrl: imgnine,
// },
];
const MobileCommunityCard = () => {

87
src/components/MobileMenu/MobileMenu.jsx
View File

@@ -48,12 +48,6 @@ export const MobileMenu = () => {
padding: "15px 0",
};
const innerLink = {
color: location.pathname === "/LearnPage" ? "rgb(222, 133, 142)" : "#fff",
display: "block",
padding: "15px 0",
};
return (
<>
<Box
@@ -106,7 +100,7 @@ export const MobileMenu = () => {
display={"flex"}
justifyContent={"space-between"}
alignItems={"center"}
padding={"1rem 1rem"}
padding={"2rem 1rem"}
marginBottom={"4rem"}
gap={"2rem"}
sx={{
@@ -148,7 +142,18 @@ export const MobileMenu = () => {
<AccordionIcon color={"#fff"} fontSize={"28px"} />
</AccordionButton>
<AccordionPanel pb={4}>
<Link to="/LearnPage" style={innerLink} onClick={handleClick}>
<Link
to="/LearnPage"
style={{
color:
location.pathname === "/LearnPage"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
Learn
</Link>
<Link
@@ -197,7 +202,18 @@ export const MobileMenu = () => {
<AccordionIcon color={"#fff"} fontSize={"28px"} />
</AccordionButton>
<AccordionPanel pb={4}>
<Link to="/BuildPage" style={innerLink} onClick={handleClick}>
<Link
to="/BuildPage"
style={{
color:
location.pathname === "/BuildPage"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
Build
</Link>
<Link
@@ -246,14 +262,32 @@ export const MobileMenu = () => {
<AccordionIcon color={"#fff"} fontSize={"28px"} />
</AccordionButton>
<AccordionPanel pb={4}>
<Link to="/fin-tech" style={innerLink} onClick={handleClick}>
<Link
to="/fin-tech"
style={{
color:
location.pathname === "/fin-tech"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
FinTech
</Link>
<Link
to="/ad-tech"
// target="_blank"
// rel="noopener noreferrer"
style={innerLink}
style={{
color:
location.pathname === "/ad-tech"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
AdTech
@@ -262,7 +296,14 @@ export const MobileMenu = () => {
to="/mar-tech"
// target="_blank"
// rel="noopener noreferrer"
style={innerLink}
style={{
color:
location.pathname === "/mar-tech"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
MarTech
@@ -271,7 +312,14 @@ export const MobileMenu = () => {
to="/health-tech"
// target="_blank"
// rel="noopener noreferrer"
style={innerLink}
style={{
color:
location.pathname === "/health-tech"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
HealthTech
@@ -295,7 +343,18 @@ export const MobileMenu = () => {
<AccordionIcon color={"#fff"} fontSize={"28px"} />
</AccordionButton>
<AccordionPanel pb={4}>
<Link to="/community" style={innerLink} onClick={handleClick}>
<Link
to="/community"
style={{
color:
location.pathname === "/community"
? "rgb(222, 133, 142)"
: "#fff",
display: "block",
padding: "15px 0",
}}
onClick={handleClick}
>
Community
</Link>
</AccordionPanel>

4
src/components/NavBar/NavBar.jsx
View File

@@ -91,7 +91,7 @@ const NavBar = () => {
<>
{!isMobile ? (
<>
<Box position={"fixed"} zIndex={"999"} width={"100%"}>
<Box position={"fixed"} zIndex={"999"} width={"100%"} id="navbar">
<Box
backgroundColor={"#141315"}
// position={"fixed"}
@@ -479,7 +479,7 @@ const NavBar = () => {
location.pathname === "/fin-tech" ||
location.pathname === "/ad-tech" ||
location.pathname === "/mar-tech" ||
location.pathname === "/heath-tech"
location.pathname === "/health-tech"
? active
: linkStyle
}

1
src/components/SubnetsComponent/NewSubnetComp.jsx
View File

@@ -1,3 +1,4 @@
/* eslint-disable no-unused-vars */
// / eslint-disable no-unused-vars /
// / eslint-disable no-unused-vars /;
import { Box, Container, Image, Stack, Text } from "@chakra-ui/react";

12
src/index.css
View File

@@ -35,6 +35,12 @@
color: #fff !important;
}
.rubix-section-title {
font-size: 22px !important;
font-family: "Mona Sans" !important;
color: #fff !important;
}
.link {
color: #ffff;
}
@@ -107,7 +113,7 @@ span.swiper-pagination-bullet {
}
.swiper-pagination-bullet-active {
background: #fff ;
background: #fff;
}
/* html {
font-family: "Mona Sans";
@@ -180,7 +186,7 @@ span.swiper-pagination-bullet {
}
.swiper-button-next {
right: -8px;
right: -8px;
}
.swiper-button-prev {
@@ -212,4 +218,4 @@ span.swiper-pagination-bullet {
.rubix-text-small {
font-size: 14px !important;
}
}
}

22
src/pages/Community.jsx
View File

@@ -9,7 +9,6 @@ import LearnMore from "../components/Community/LearnMore";
import Footer from "../components/Footer/Footer";
import MobileCommunityCard from "../components/MobileComponent/MobileCommunityCard";
import { useEffect, useState } from "react";
import MobilePlace from "../components/MobileComponent/MobilePlace";
const Community = () => {
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
@@ -27,17 +26,30 @@ const Community = () => {
}, []);
useEffect(() => {
// Scroll to the top of the page when the component mounts
window.scrollTo(0, 0);
}, []);
const isMobile = windowWidth <= 996;
const scrollToNextSection = () => {
const navbarHeight = document.getElementById("navbar").offsetHeight;
const nextSection = document.getElementById("rubix-community");
if (nextSection) {
const scrollPosition = nextSection.offsetTop - 0.9 * navbarHeight;
window.scrollTo({ top: scrollPosition, behavior: "smooth" });
// nextSection.scrollIntoView({ behavior: "smooth" });
}
};
return (
<>
<CommunityBanner />
{!isMobile ? <CommunityCard /> : <MobileCommunityCard />}
{!isMobile ? <Place /> : <MobilePlace />}
<CommunityBanner onClick={scrollToNextSection} />
{!isMobile ? (
<CommunityCard id="next-section" />
) : (
<MobileCommunityCard />
)}
<Place />
<Connect />
{/* <Happen />
<Insights /> */}

1
src/pages/Contact.jsx
View File

@@ -1,5 +1,6 @@
import { useEffect } from "react";
import Form from "../components/Contact/Form";
// eslint-disable-next-line no-unused-vars
import Footer from "../components/Footer/Footer";
const Contact = () => {

3
src/pages/UseCases.jsx
View File

@@ -2,9 +2,6 @@
/* eslint-disable react/prop-types */
import { useEffect } from "react";
import UseCase from "../components/UseCase/UseCase";
// import { useCase } from "../data/useCase";
// import banner from "../assets/images/usecase-bg.png";
import Footer from "../components/Footer/Footer";
const UseCases = ({
bannerHeading,