diff --git a/src/app/playground/page.js b/src/app/playground/page.js index c1121dd..2cc34ce 100644 --- a/src/app/playground/page.js +++ b/src/app/playground/page.js @@ -4,10 +4,14 @@ import React from 'react'; import Gallery from '@/components/gallery/gallery'; import Prizes from '@/components/prizes/prizes'; import Timeline from '@/components/timeline/timeline'; +import { AboutUsMain } from '@/components/aboutUs/AboutUsMain'; +import { StatsMain } from '@/components/stats/StatsMain'; const Playground = () => { return (
+ + diff --git a/src/components/aboutUs/AboutUsMain.Styles.jsx b/src/components/aboutUs/AboutUsMain.Styles.jsx new file mode 100644 index 0000000..175d5ed --- /dev/null +++ b/src/components/aboutUs/AboutUsMain.Styles.jsx @@ -0,0 +1,14 @@ +import styled from 'styled-components'; +import tw from 'twin.macro'; + +import { PrizesHeading, PrizesHeadingContainer } from '../prizes/styles'; + +export const SectionContainer = styled.div` + ${tw` + flex flex-col justify-center items-center pb-[141px] gap-[40px] sm:gap-[50px] md:gap-[67px] max-w-[1200px] + `} +`; +export const AboutUSHeadingContainer = styled(PrizesHeadingContainer)` + ${tw`max-w-[340px]`} +`; +export const AboutUsHeading = styled(PrizesHeading)``; diff --git a/src/components/aboutUs/AboutUsMain.jsx b/src/components/aboutUs/AboutUsMain.jsx new file mode 100644 index 0000000..cbb2f57 --- /dev/null +++ b/src/components/aboutUs/AboutUsMain.jsx @@ -0,0 +1,13 @@ +import { AboutUsHeading, AboutUSHeadingContainer, SectionContainer } from './AboutUsMain.Styles'; +import { AboutUsDescription } from './Description'; + +export const AboutUsMain = () => { + return ( + + + About Us + + + + ); +}; diff --git a/src/components/aboutUs/Description.jsx b/src/components/aboutUs/Description.jsx new file mode 100644 index 0000000..bf72e86 --- /dev/null +++ b/src/components/aboutUs/Description.jsx @@ -0,0 +1,6 @@ +import { DescriptioData } from '@/config/content/AboutUs/Data'; +import { DescriptionContainer } from './Description.styles'; + +export const AboutUsDescription = () => { + return {DescriptioData}; +}; diff --git a/src/components/aboutUs/Description.styles.jsx b/src/components/aboutUs/Description.styles.jsx new file mode 100644 index 0000000..e8fd4ee --- /dev/null +++ b/src/components/aboutUs/Description.styles.jsx @@ -0,0 +1,10 @@ +import styled from 'styled-components'; +import tw from 'twin.macro'; + +import { Paragraph } from '../shared/typography/Headings'; + +export const DescriptionContainer = styled(Paragraph)` + ${tw` + font-light text-[20px] leading-[32px] sm:text-[24px] sm:leading-[36px] md:text-[28px] md:leading-[44.8px] lg:text-[32px] lg:leading-[51.2px] + `} +`; diff --git a/src/components/stats/StatsMain.jsx b/src/components/stats/StatsMain.jsx new file mode 100644 index 0000000..e42674e --- /dev/null +++ b/src/components/stats/StatsMain.jsx @@ -0,0 +1,11 @@ +import { SectionContainer, StatsHeading, StatsHeadingContainer } from './StatsMain.style'; + +export const StatsMain = () => { + return ( + + + Stats HackNITR 6.0 + + + ); +}; diff --git a/src/components/stats/StatsMain.style.jsx b/src/components/stats/StatsMain.style.jsx new file mode 100644 index 0000000..b8aa628 --- /dev/null +++ b/src/components/stats/StatsMain.style.jsx @@ -0,0 +1,14 @@ +import styled from 'styled-components'; +import tw from 'twin.macro'; + +import { PrizesHeading, PrizesHeadingContainer } from '../prizes/styles'; + +export const SectionContainer = styled.div` + ${tw` + flex flex-col justify-center items-center gap-[40px] sm:gap-[50px] md:gap-[67px] max-w-[1200px] + `} +`; +export const StatsHeadingContainer = styled(PrizesHeadingContainer)` + ${tw`max-w-[608px]`} +`; +export const StatsHeading = styled(PrizesHeading)``; diff --git a/src/config/content/AboutUs/Data.js b/src/config/content/AboutUs/Data.js new file mode 100644 index 0000000..0366c89 --- /dev/null +++ b/src/config/content/AboutUs/Data.js @@ -0,0 +1,2 @@ +export const DescriptioData = + 'HackNITR 5.0 is a hackathon to encourage you to use your imagination and invention to develop cutting-edge technology-based solutions to challenges in the real world. It was a event large group of tech enthusiasts. The main goal is to grow our local community and give hackers an unforgettable experience. The plethora of fun and excitement is waiting for you from 12th Jan 2024.';