Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

About section #14

Merged
merged 2 commits into from
Oct 7, 2024
Merged

About section #14

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
60dce5a
about
GulistaKhatun06 Oct 7, 2024
36b6615
my commit
GulistaKhatun06 Oct 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/workflows/eslint.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,4 +42,4 @@ jobs:
run: npm install

- name: Run ESLint
run: npm run lint
run: npm run lint
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
},
"dependencies": {
"@vitejs/plugin-react": "^4.2.1",
"pnpm": "^9.12.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.22.2",
Expand Down
4 changes: 4 additions & 0 deletions src/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import { Routes, Route } from "react-router-dom";

import { Home, Error, Event, Faq, Team } from "./Pages";
import AboutNits from "./Components/About/NitsHacks/NitsHacks";
import AboutTech from "./Components/About/Tecno/Tecno";

const App = () => {
return (
Expand All @@ -10,6 +12,8 @@ const App = () => {
<Route path="/faq" element={<Faq />} />
<Route path="/team" element={<Team />} />
<Route path="*" element={<Error />} />
<Route path="/AboutNits" element={<AboutNits />} />
<Route path="/AboutTech" element={<AboutTech />} />
</Routes>
);
};
Expand Down
45 changes: 41 additions & 4 deletions src/Components/About/NitsHacks/NitsHacks.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,47 @@
import styles from "./NitsHacks.module.scss";

const NitsHacks = () => {
return (
<div className={styles.NitsHacks}>
<h1 className={styles.heading}>About NitsHacks</h1>
<div className={styles.aboutDesc}>Write here</div>
<div className={styles.nitsParent}>
<div className={styles.NitsHacks}>
<h1 className={styles.heading}>ABOUT NITS HACKS</h1>
<div className={styles.line}>
<hr className={styles.smallest} />
<hr className={styles.small} />
<hr className={styles.large} />
<hr className={styles.largest} />
</div>
<div className={styles.main}>
<p className={styles.p}>
NITS HACKS is a distinguished hackathon hosted by NIT Silchar, recognized as
one of the top events in northeastern India. This dynamic platform brings
together tech enthusiasts, encouraging collaboration and highlighting their
problem-solving expertise. Beyond just a competition, NITS HACKS focuses on
cultivating essential soft skills for newcomers while offering valuable
technical learning experiences for aspiring students. Participants tackle
real-world challenges, guiding them in designing and developing innovative
technology projects from scratch. The event not only celebrates innovation.
but also helps shape the future generation of tech leaders.
</p>
<div className={styles.footer}>
<div className={styles.element}>
<div className={styles.footer1}>
<hr className={styles.line1} />
<hr className={styles.line2} />
</div>
<div className={styles.brochure}>
<a className={styles.btn} href="/download">
<img
src="https://media.istockphoto.com/id/844294300/vector/download-icon-isolated-vector.jpg?s=612x612&w=0&k=20&c=VCmvy8uEoTQnt9W0kZzjEBplN_opDkGKF_eQTLfkivs="
className={styles.icon}
alt="img"
/>
BROCHURE
</a>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
Expand Down
166 changes: 163 additions & 3 deletions src/Components/About/NitsHacks/NitsHacks.module.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,168 @@
.NitsHacks {
.heading {
font-size: 1.5rem;
width: 652px;
height: 65px;
size: 64px;
background-color: black;
color: var(--gdsc-yellow-1-100);
line-height: 89.13px;
font-family: --gdsc-font-1;
left: 9px;
font-weight: 400;
font-style: Star Jedi;
}
.aboutDesc {
font-size: 0.8rem;
.line {
display: flex;
flex-direction: row;
margin-top: 5px;
}
hr.smallest {
height: 3px;
width: 9px;
border-radius: 3px;
background-color: white;
}
hr.small {
height: 3px;
width: 15px;
border-radius: 3px;
background-color: white;
}
hr.large {
height: 3px;
width: 29px;
border-radius: 3px;
background-color: white;
}
hr.largest {
height: 3px;
width: 1425px;
border-radius: 3px;
background-color: white;
}

.p {
display: flex;
width: 100%;
background-color: black;
height: 450px;
font-size: 20px;
align-items: center;
justify-content: center;
font-weight: 400;
line-height: 1.8;
font-family: Outfit;
}
.icon {
height: 30px;
width: 20px;
background-color: white;
margin-right: 10px;
}

.main {
border-top: 3px solid grey;
border-left: 3px solid grey;
border-right: 3px solid grey;
border-radius: 7px;
margin-top: 44px;
width: 100%;
}
.footer {
height: 150px;
width: 100%;
}
.brochure {
display: flex;

height: 50px;
width: 400px;
align-items: center;
padding-top: 10px;
padding-right: 55px;
padding-bottom: 16px;
// padding-left:55px;
gap: 10px;
background-color: grey;
margin-top: 20px;
.btn {
color: #000;
width: 100px;
border-radius: 5px;
height: 40px;
width: 180px;
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
font-size: 20px;
font-weight: bold;
font-family: var(--gdsc-font-1);
background-color: white;
margin-left: 55px;
}
}
a {
text-decoration: none;
}
}
.footer1 {
display: flex;
gap: 5px;
margin-left: 1000px;
margin-top: 8px;
background-color: grey;
}
hr.line1 {
width: 19px;
height: 8px;
border: 2px solid red;
background-color: white;
}
hr.line2 {
width: 241px;
height: 8px;
border: 2px solid red;
background-color: white;
}
//}
.element {
width: 100%; /* Adjust the width */
height: 150px; /* Adjust the height */
background-color: grey; /* Adjust the background color */
clip-path: polygon(0% 0%, 100% 0%, 100% 185%, 80% 70%, 45% 70%, 40% 100%, 0% 100%);
}

@media screen and (max-width: 600px) {
.heading {
padding-left: 50px;
font-size: 30px;
}

.p {
font-size: 2px;
color: white;
overflow-y: scroll;
left: 0px;
margin-left: px;
margin-right: 5px;
flex-wrap: wrap;
}

hr.line1 {
width: 6px;
height: 3px;
border: 2px solid red;
background-color: white;
}
hr.lin2 {
width: 77px;
height: 3px;
border: 2px solid red;
background-color: white;
}
.brochure {
justify-content: flex-start;
margin-left: 2rem;
}
}
34 changes: 32 additions & 2 deletions src/Components/About/Tecno/Tecno.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,38 @@ import styles from "./Tecno.module.scss";
const Tecno = () => {
return (
<div className={styles.Tecno}>
<h1 className={styles.heading}>About Tecnoesis</h1>
<div className={styles.TecnoDesc}>Write about tecnoesis</div>
<h1 className={styles.heading}>ABOUT TECHNOESIS</h1>
<div className={styles.line}>
<hr className={styles.smallest} />
<hr className={styles.small} />
<hr className={styles.large} />
<hr className={styles.largest} />
</div>
<div className={styles.main}>
<p className={styles.p}>
TECNOESIS is the annual techno-managerial event of NIT Silchar, promising all
tech geeks the ideal niche of fascinating events, workshops, competitions and
interactions worth a lifetime. This mega event has left its mark as of the most
prominent techfests across the country. The cauldron of enthusiasm and knowledge
attracts various students, presenting the chance to let their minds run wild
with ideads, fostering the inventors of the future.
</p>

<div className={styles.footer}>
<div className={styles.element}>
<div className={styles.footer1}>
<hr className={styles.line1} />
<hr className={styles.line2} />
</div>

<div className={styles.brochure}>
<a className={styles.btn} href="https://tecnoesis.co.in/">
Visit Technoesis
</a>
</div>
</div>
</div>
</div>
</div>
);
};
Expand Down
Loading
Loading