Skip to content

Commit

Permalink
Update
Browse files Browse the repository at this point in the history
  • Loading branch information
@ajaynegi45
ajaynegi45 committed Dec 6, 2024
1 parent bf10fef commit bc5a638
Show file tree
Hide file tree
Showing 10 changed files with 222 additions and 138 deletions.
155 changes: 113 additions & 42 deletions src/app/auth/page.module.css
View file
Original file line number Diff line number Diff line change
@@ -1,93 +1,164 @@

.authenticationContainer{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 85vh;
}

.container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 8px;
height: 100%;
width: 100%;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
width: 100%; /* Make the container take full available width */
max-width: 500px; /* Limit the container width to 500px */
/*min-width: 300px; !* Ensure it doesn't go below 300px *!*/
margin: 0 auto; /* Center it horizontally */
padding: 40px 30px; /* Add padding */
background-color: #fff; /* Soft white background */
border-radius: 12px; /* Rounded corners for the form */
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
font-family: 'Inter', sans-serif;
position: relative;
}

/* Title of the page */
.title {
text-align: center;
margin-bottom: 20px;
padding: 2px;
font-size: 2rem;
font-weight: 600;
color: #333;
margin-bottom: 24px;
}

/* Form layout */
.form {
display: flex;
flex-direction: column;
gap: 16px; /* Adds space between each form element */
}

/* Error message styling */
.errors {
color: red;
font-weight: 600;
padding: 2px;
color: #e74c3c;
font-size: 0.875rem;
font-weight: 500;
margin-top: -12px;
margin-bottom: 10px;
}

/* Input field styles */
.input {
width: 100%;
height: 3rem;
padding: 10px 18px;
font-size: 1rem;
line-height: 1.5rem;
padding: 10px 18px 10px 18px;
border: 1px solid var(--line-grey);
border-radius: 5px;
border-radius: 8px; /* Rounded corners */
border: 1px solid #ddd; /* Light border color */
outline: none;
border-radius: 4px;
margin: 4px;
background-color: #f9f9f9;
transition: all 0.3s ease;
}

/* Focus effect for input fields */
.input:focus {
border-color: var(--green); /* Blue border on focus */
box-shadow: 0 0 5px rgb(30, 124, 84);
}

/* Label for the checkbox (alerts) */
.label {
padding: 2px;
font-size: 0.875rem;
color: #555;
}

/* Style for alert checkbox */
.alerts {
margin: 4px;
margin-top: 10px;
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 8px;
margin-top: 16px;
font-size: 0.875rem;
}



/* Button styles */
.button {
color: white;
height: 3rem;
font-size: 1rem;
line-height: 1.5rem;
padding: 10px 18px 10px 18px;
border-radius: 5px;
background-color: var(--black);
transition: 0.2s ease-in-out;
font-weight: 600;
padding: 10px 18px;
background-color: var(--black); /* Blue background */
color: white;
border: none;
border-radius: 8px; /* Rounded corners */
cursor: pointer;
transition: 0.3s ease-in-out;
}

.button:hover {
background-color: var(--slate-black);
cursor: pointer;
background-color: var(--slate-black); /* Darker blue on hover */
}

.button:disabled {
background-color: #d6d6d6;
cursor: not-allowed;
}

/* Toggle between Login/Signup */
.toggle {
text-align: center;
margin-top: 10px;
font-size: 0.875rem;
/*color: #007bff;*/
color: var(--green);
cursor: pointer;
margin-top: 16px;
}

.toggle:hover {
text-decoration: underline;
cursor: pointer;
color: var(--slate-black);
color: #007bff;
}

/* Password container to hold the toggle button */
.passwordContainer {
position: relative;

}

.passwordToggle {
position: absolute;
height: 100%;
display: flex;
top: 0;
align-items: center;
right: 1rem
right: 1rem;
top: 50%;
transform: translateY(-50%);
border: none;
background: none;
cursor: pointer;
}

/* Image for eye icon */
.image {
height: 25px;
width: 25px;
}
width: 20px;
height: 20px;
}


/* Placeholder styling for inputs */
.input::placeholder {
color: #aaa; /* Light grey placeholder text */
opacity: 1;
}

/* Responsive design: Stack elements on small screens */
@media (max-width: 480px) {
.container {
padding: 20px;
}

.title {
font-size: 1.5rem;
}

.button {
padding: 10px;
}
}
5 changes: 4 additions & 1 deletion src/app/auth/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,7 @@ export default function Auth() {
};

return (
<section className={styles.authenticationContainer}>
<div className={styles.container}>
<h2 className={styles.title}>{isSignup ? "Sign Up" : "Login"}</h2>
<form onSubmit={handleSubmit(onSubmit)} className={styles.form}>
Expand Down Expand Up @@ -212,11 +213,12 @@ export default function Auth() {

<div className={styles.alerts}>
<input
id="alerts-checkbox"
disabled={isLoading}
type="checkbox"
{...register("alerts")}
/>
<label className={styles.label}>
<label className={styles.label} htmlFor="alerts-checkbox">
Get Upcoming Uttarakhand Festival & Fair Alerts!
</label>
</div>
Expand Down Expand Up @@ -284,5 +286,6 @@ export default function Auth() {
: "Don't have an account? Sign Up"}
</p>
</div>
</section>
);
}
124 changes: 67 additions & 57 deletions src/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,10 @@ import Notify_Banner from "/public/notify-early-banner.jpg"
import PahadiWomen from "/public/bhotiaWoman.webp"
import Faq from "@/components/Faq";
import Proverbs from "@/components/ui/Proverbs";
import {getUpcomingFestival} from "@/utils/festivals";

export default function Home() {
const festival = getUpcomingFestival();
return (
<>
<header className={styles.headerContainer}>
Expand Down Expand Up @@ -47,73 +49,81 @@ export default function Home() {

<Proverbs/>

<section className={styles["home-story-container"]}>


<div className={styles["why-built-it-container"]}>
<div className={styles["built-image-container"]}>
<Image src={Srinagar} alt="TREKKING" width="300" height={"211"} loading={"eager"}
priority={true} placeholder={"blur"}/>
<p className={styles["journey-image-description"]}>A Painting of a Rope bridge across Alaknanda
River,
Srinagar, in the times of Garhwal Kingdom, 1784-94. Photo Src: British Library</p>
</div>
<div className={styles["built-text-container"]}>
<p className={styles["why-built-it-title"]}>WHY WE BUILD IT</p>
<p className={styles["built-description-container"]}>A concerning trend is emerging in
Uttarakhand, where the younger generation is gradually
forgetting their cultural heritage and traditional rituals. This decline in cultural
knowledge is evident across generations, with each successive generation possessing less
knowledge than the previous one. For instance, the amount of cultural knowledge possessed by
grandparents is significantly more than that of their children, and the cultural knowledge
of today&apos;s youth is likely to be even less than that of their parents. If this trend
continues, there is a risk that the cultural heritage of Uttarakhand may eventually
disappear from the society. This loss would not only erase the region&apos;s rich cultural
identity but also deprive future generations of their cultural roots and traditions.</p>
</div>
</div>

<div className={styles["journey-container"]}>
<p>Explore, Learn and Discover the Beauty of Uttarakhand&apos;s Culture</p>

<div>

<div className={styles["journey-left-container"]}>
<div><h3>EXPLORE UTTARAKHAND</h3></div>
<div><p className={styles["built-description-container"]}>To address this problem, we have
come up with a solution to digitize this cultural
knowledge. Since today&apos;s generation is more comfortable with technology, we aim to
provide a platform where they can learn about their cultural heritage using their
devices, from anywhere in the world. By doing so, we hope to make cultural knowledge
more accessible and engaging for the younger generation, and thus help preserve the rich
cultural heritage of Uttarakhand.</p></div>
<Link href={"/explore"}>Start Your Journey</Link>
</div>

<div className={styles["journey-right-container"]}>
<Image src={GoriGanga} alt="TREKKING" width="350" height={"256"} loading={"eager"}
priority={true} placeholder={"blur"}/>
<p className={styles["journey-image-description"]}>Water-colour painting of the River Gori
in Uttar Pradesh by James Manson (1791-1862), c.1826. </p>
</div>
</div>
</div>

</section>
{/*<section className={styles["home-story-container"]}>*/}
{/* */}
{/* <div className={styles["why-built-it-container"]}>*/}
{/* <div className={styles["built-image-container"]}>*/}
{/* <Image src={Srinagar} alt="TREKKING" width="300" height={"211"} loading={"eager"}*/}
{/* priority={true} placeholder={"blur"}/>*/}
{/* <p className={styles["journey-image-description"]}>A Painting of a Rope bridge across Alaknanda*/}
{/* River,*/}
{/* Srinagar, in the times of Garhwal Kingdom, 1784-94. Photo Src: British Library</p>*/}
{/* </div>*/}
{/* <div className={styles["built-text-container"]}>*/}
{/* <p className={styles["why-built-it-title"]}>WHY WE BUILD IT</p>*/}
{/* <p className={styles["built-description-container"]}>A concerning trend is emerging in*/}
{/* Uttarakhand, where the younger generation is gradually*/}
{/* forgetting their cultural heritage and traditional rituals. This decline in cultural*/}
{/* knowledge is evident across generations, with each successive generation possessing less*/}
{/* knowledge than the previous one. For instance, the amount of cultural knowledge possessed by*/}
{/* grandparents is significantly more than that of their children, and the cultural knowledge*/}
{/* of today&apos;s youth is likely to be even less than that of their parents. If this trend*/}
{/* continues, there is a risk that the cultural heritage of Uttarakhand may eventually*/}
{/* disappear from the society. This loss would not only erase the region&apos;s rich cultural*/}
{/* identity but also deprive future generations of their cultural roots and traditions.</p>*/}
{/* </div>*/}
{/* </div>*/}

{/* <div className={styles["journey-container"]}>*/}
{/* <p>Explore, Learn and Discover the Beauty of Uttarakhand&apos;s Culture</p>*/}

{/* <div>*/}

{/* <div className={styles["journey-left-container"]}>*/}
{/* <div><h3>EXPLORE UTTARAKHAND</h3></div>*/}
{/* <div><p className={styles["built-description-container"]}>To address this problem, we have*/}
{/* come up with a solution to digitize this cultural*/}
{/* knowledge. Since today&apos;s generation is more comfortable with technology, we aim to*/}
{/* provide a platform where they can learn about their cultural heritage using their*/}
{/* devices, from anywhere in the world. By doing so, we hope to make cultural knowledge*/}
{/* more accessible and engaging for the younger generation, and thus help preserve the rich*/}
{/* cultural heritage of Uttarakhand.</p></div>*/}
{/* <Link href={"/explore"}>Start Your Journey</Link>*/}
{/* </div>*/}

{/* <div className={styles["journey-right-container"]}>*/}
{/* <Image src={GoriGanga} alt="TREKKING" width="350" height={"256"} loading={"eager"}*/}
{/* priority={true} placeholder={"blur"}/>*/}
{/* <p className={styles["journey-image-description"]}>Water-colour painting of the River Gori*/}
{/* in Uttar Pradesh by James Manson (1791-1862), c.1826. </p>*/}
{/* </div>*/}
{/* </div>*/}
{/* </div>*/}

{/*</section>*/}


{/* UPCOMING FESTIVAL */}
{/*<SectionCard*/}
{/* cardTitle={"UPCOMING FESTIVAL"}*/}
{/* title={"Egaas Bagwal"}*/}
{/* subTitle={"12 NOVEMBER · UTTARAKHAND"}*/}
{/* description={"Egaas Bagwal is a unique festival celebrated 11 days after Diwali in the hilly regions of Uttarakhand. According to local belief, Lord Rama returned from exile late to these areas, which is why people here celebrate Egaas with great enthusiasm. The festival involves preparing traditional delicacies, performing joyful folk dances, and lighting up homes, much like Diwali. A standout tradition is spinning a flaming rope called \"Bhailo\", where villagers twirl a fire-lit rope, creating a mesmerizing display symbolizing light’s triumph over darkness. Egaas Bagwal reflects Uttarakhand’s rich cultural heritage, offering a glimpse into the community’s deep-rooted traditions and festive spirit. For the people of Uttarakhand, it’s not just a festival, but a meaningful tribute to their ancestors and the vibrant life of the hills."}*/}
{/* image={GheeSankranti}*/}
{/* readMoreLink={""}*/}
{/* location={""}*/}
{/*/>*/}

<SectionCard
cardTitle={"UPCOMING FESTIVAL"}
title={"Egaas Bagwal"}
subTitle={"12 NOVEMBER · UTTARAKHAND"}
description={"Egaas Bagwal is a unique festival celebrated 11 days after Diwali in the hilly regions of Uttarakhand. According to local belief, Lord Rama returned from exile late to these areas, which is why people here celebrate Egaas with great enthusiasm. The festival involves preparing traditional delicacies, performing joyful folk dances, and lighting up homes, much like Diwali. A standout tradition is spinning a flaming rope called \"Bhailo\", where villagers twirl a fire-lit rope, creating a mesmerizing display symbolizing light’s triumph over darkness. Egaas Bagwal reflects Uttarakhand’s rich cultural heritage, offering a glimpse into the community’s deep-rooted traditions and festive spirit. For the people of Uttarakhand, it’s not just a festival, but a meaningful tribute to their ancestors and the vibrant life of the hills."}
title={festival.name}
subTitle={festival.date+" · UTTARAKHAND"}
description={festival.description}
image={GheeSankranti}
readMoreLink={""}
location={""}
/>


{/* UPCOMING FAIR */}
<SectionCard
cardTitle={"UPCOMING FAIR"}
Expand Down
Loading

0 comments on commit bc5a638

Please sign in to comment.