From bc5a638a3962eb005643989119863dd8752ad280 Mon Sep 17 00:00:00 2001 From: ajaynegi45 Date: Fri, 6 Dec 2024 21:48:26 +0530 Subject: [PATCH] Update --- src/app/auth/page.module.css | 155 ++++++++++++++++++++++--------- src/app/auth/page.tsx | 5 +- src/app/page.tsx | 124 +++++++++++++------------ src/components/Faq.tsx | 36 +++---- src/components/ui/Faq.module.css | 6 +- src/components/ui/Footer.tsx | 4 +- src/components/ui/Proverbs.tsx | 6 -- src/lib/zod.ts | 3 +- src/utils/festivals.ts | 20 ++-- src/utils/proverbs.ts | 1 + 10 files changed, 222 insertions(+), 138 deletions(-) diff --git a/src/app/auth/page.module.css b/src/app/auth/page.module.css index 932218d..d055102 100644 --- a/src/app/auth/page.module.css +++ b/src/app/auth/page.module.css @@ -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; -} \ No newline at end of file + 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; + } +} diff --git a/src/app/auth/page.tsx b/src/app/auth/page.tsx index 7f27b4b..e2e19d1 100644 --- a/src/app/auth/page.tsx +++ b/src/app/auth/page.tsx @@ -124,6 +124,7 @@ export default function Auth() { }; return ( +

{isSignup ? "Sign Up" : "Login"}

@@ -212,11 +213,12 @@ export default function Auth() {
-
@@ -284,5 +286,6 @@ export default function Auth() { : "Don't have an account? Sign Up"}

+
); } diff --git a/src/app/page.tsx b/src/app/page.tsx index 15adca7..a1001ab 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -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 ( <>
@@ -47,73 +49,81 @@ export default function Home() { -
- - -
-
- TREKKING -

A Painting of a Rope bridge across Alaknanda - River, - Srinagar, in the times of Garhwal Kingdom, 1784-94. Photo Src: British Library

-
-
-

WHY WE BUILD IT

-

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'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's rich cultural - identity but also deprive future generations of their cultural roots and traditions.

-
-
- -
-

Explore, Learn and Discover the Beauty of Uttarakhand's Culture

- -
- -
-

EXPLORE UTTARAKHAND

-

To address this problem, we have - come up with a solution to digitize this cultural - knowledge. Since today'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.

- Start Your Journey -
- -
- TREKKING -

Water-colour painting of the River Gori - in Uttar Pradesh by James Manson (1791-1862), c.1826.

-
-
-
- -
+ {/*
*/} + {/* */} + {/*
*/} + {/*
*/} + {/* TREKKING*/} + {/*

A Painting of a Rope bridge across Alaknanda*/} + {/* River,*/} + {/* Srinagar, in the times of Garhwal Kingdom, 1784-94. Photo Src: British Library

*/} + {/*
*/} + {/*
*/} + {/*

WHY WE BUILD IT

*/} + {/*

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'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's rich cultural*/} + {/* identity but also deprive future generations of their cultural roots and traditions.

*/} + {/*
*/} + {/*
*/} + + {/*
*/} + {/*

Explore, Learn and Discover the Beauty of Uttarakhand's Culture

*/} + + {/*
*/} + + {/*
*/} + {/*

EXPLORE UTTARAKHAND

*/} + {/*

To address this problem, we have*/} + {/* come up with a solution to digitize this cultural*/} + {/* knowledge. Since today'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.

*/} + {/* Start Your Journey*/} + {/*
*/} + + {/*
*/} + {/* TREKKING*/} + {/*

Water-colour painting of the River Gori*/} + {/* in Uttar Pradesh by James Manson (1791-1862), c.1826.

*/} + {/*
*/} + {/*
*/} + {/*
*/} + + {/*
*/} {/* UPCOMING FESTIVAL */} + {/**/} + - {/* UPCOMING FAIR */} { const [faqs, setFaqs] = useState([ { - question: "What is a need to safeguard Uttarakhand Cultural Heritage?", - answer: "By safeguarding its cultural heritage, Uttarakhand can maintain its distinctiveness, fostering a sense of pride and belonging among its inhabitants. Additionally, preserving local customs, art forms, and folk traditions enhances tourism, attracting tourist eager to experience authentic cultural interactions and vibrant regional offerings. Preserving Uttarakhand's culture contributes to environmental sustainability, as many traditional practices are closely connected to the natural landscape and promote harmonious living with nature. As it reflects the region's unique identity and heritage shaped by its rich history, traditions, and natural environment. With globalization and rapid modernization, there is a risk of cultural dilution.", + question: "What is the purpose of the Uttarakhand Culture website?", + answer: "The purpose of the Uttarakhand Culture website is to digitally document, preserve, and celebrate the rich cultural heritage of Uttarakhand. It aims to provide accessible information about the region’s traditions, history, and natural beauty, ensuring that the cultural legacy is passed down to future generations while making it engaging for the modern audience.", open: false, }, { - question: "What is the culture of Uttarakhand like?", - answer: "Uttarakhand known as “Devbhoomi” (Land of the Gods), culture is a unique blend of customs, tradition, and folklore shaped by its mountainous geography and diverse communities. Located in northern India, region is known for its rich spiritual heritageas, it is home to sacred sites like the Char Dham pilgrimage (Badrinath, Kedarnath, Gangotri, and Yamunotri). The culture here is deeply connected to nature, with festivals and traditions reflecting respect for the environment. Uttarakhand is a hub for Hindu spirituality and yoga. The culture of Uttarakhand is deeply rooted in its stunning geography and the traditions of its two primary regions, Garhwal and Kumaon. With the majestic Himalayas as a backdrop, the people of Uttarakhand have a lifestyle that is connected to nature.", + question: "Why was the Uttarakhand Culture website built?", + answer: "The website was built to address the risk of cultural dilution caused by globalization and modernization. It serves as a platform to preserve local traditions, art, and stories, promote tourism, and foster pride among the people of Uttarakhand by showcasing their unique identity and heritage.", open: false, - }, { - question: "What are some popular traditional dishes of Uttarakhand?", - answer: "Uttarakhand’s traditional cuisine is flavorful and healthy, emphasizing on local ingredients, including grains, lentils, and seasonal vegetables. Popular traditional dishes include Kafuli, a hearty green curry made from spinach and fenugreek leaves, cooked with minimal spices and served with rice. Another is Bhaang ki Chutney, a tangy, flavorful condiment made with roasted hemp seeds, yogurt, and a blend of spices. Next is, Aloo Ke Gutke—stir-fried potatoes seasoned with red chilies, cumin, and coriander—is a classic comfort food often paired with Puri and served during festivals. Chainsoo, a rich black gram dal dish, often called Dal Fry is unique to Uttarakhand as it’s slow-cooked to bring out a nutty flavor and is often served with steamed rice.", - open: false, - }, { - question: "What are the most popular festivals celebrated in Uttarakhand?", - answer: "Uttarakhand celebrates a dynamic mix of cultural, regional, and seasonal festivals, each reflecting the ancient traditions and spiritual life of its people. Nanda Devi Raj Jat, an elaborate pilgrimage and celebration held once in every twelve years, in honor of the goddess Nanda Devi, is one of the region's most significant festivals.The grand Kumbh Mela, which takes place at Haridwar every twelve years, attracts millions of pilgrims. Among the most popular is Harela, a festival celebrating the onset of the monsoon and the abundance of nature, especially significant in agricultural communities. It’s a time of planting seeds and celebrating growth and harmony with nature. Makar Sankranti, locally known as Uttarayani, marks the transition of the sun into Capricorn.", - open: false, - }, { - question: "What impact do Uttarakhand’s fairs have on tourism?", - answer: "The fairs enhance Uttarakhand's significance as a adventure and spritual tourism destination, drawing attention to its green beauty, historical significance, and religious sites. By promoting a sense of community and cultural pride among locals, these fairs contribute to sustainable tourism development, ensuring that the cultural practices and traditions are preserved for future generations while providing an enriching experience for tourists. These fairs supports local economies, benefiting small and big businesses, artisans, and vendors who sell handicrafts, clothing, and traditional foods. This activity encourages the preservation of local art forms, as artisans gain visibility and sales opportunities, feature local performances showcasing traditional music and dance, which enrich the cultural experience for visitors.", + }, + { + question: "What is the need for preserving Uttarakhand's culture?", + answer: "Preserving Uttarakhand's culture is essential to maintain its distinctiveness, promote sustainable tourism, and protect its environmental and spiritual heritage. Traditional practices connected to nature promote a harmonious lifestyle, while cultural preservation helps prevent the loss of historical significance.", open: false, }, { - question: "What are some traditional attire or clothing styles in Uttarakhand?", - answer: "In Men's traditional clothing, the garments differ slightly between Garhwali and Kumaoni communities, with regional variations in style and embroidery. Woolen garments made from local sheep wool, like the pahari coat and woolen shawls, are common in Uttarakhand, providing warmth and comfort during the winter season. Jewelry, especially in silver, is also an essential part of Uttarakhand’s traditional attire, with unique designs that reflect local beliefs, giving the attire an authentic and cultural richness that celebrates the heritage of the region. In Women's Traditional Clothing, the ghagra, a long skirt, paired with an angarkha, a long blouse, and a woolen shawl or scarf that provides warmth during the colder months. Married women often wear the nath, a large, intricately designed nose ring that symbolizes marital status, especially prominent during weddings and festivals.", + question: "What does the website offer?", + answer: "The website offers insights into Uttarakhand's language, history, festivals, cuisine, art, music, traditional attire, tourist destinations, and natural beauty. It is a comprehensive resource for anyone looking to explore the rich culture and spiritual essence of the region.", open: false, - }, { - question: "What are some of the most famous carnival celebrated in Uttarakhand?", - answer: "The carnival reflects Uttarakhand’s unique blend of spirituality, tradition, and community life, drawing locals and tourists alike to experience the region’s diverse cultural heritage.The Magh Mela in Uttarkashi, which takes place in January, is another major event where religious and social gatherings are held by the Ganges River, featuring folk music, dance, and cultural programs. Jauljibi Mela is a prominent fair held near the Nepal border, bringing together people from Kumaon and Nepal for trade, especially in wool, blankets, and regional handicrafts. Gauchar Mela in Chamoli district is a traditional fair promoting agriculture and trade, featuring livestock exhibitions and cultural events. The Devidhura Mela, famous for its traditional stone-pelting ritual known as “Bagwal,” which has now been toned down to ensure safety while retaining its historic significance.", + }, + { + question: "How does this platform benefit the younger generation?", + answer: "The platform acts as an educational resource, connecting the younger generation with their cultural roots through engaging content. It helps them understand and appreciate their heritage, ensuring that these traditions and stories are not forgotten.", open: false, - } + }, ]); const toggleFAQ = (index: number): void => { diff --git a/src/components/ui/Faq.module.css b/src/components/ui/Faq.module.css index d6a61e8..7525b46 100644 --- a/src/components/ui/Faq.module.css +++ b/src/components/ui/Faq.module.css @@ -4,6 +4,9 @@ min-width: 100%; height: auto; margin-top: 5rem; + + user-select: none; /* Prevent text selection for the entire container */ + } .faqContainer h1 { @@ -62,7 +65,8 @@ .faq { margin: 15px 0; padding: 15px; - background: #f2f2f2; + background-color: #F2F2F2; + color: var(--black); cursor: pointer; border-radius: 5px; transition: background-color 0.2s ease; diff --git a/src/components/ui/Footer.tsx b/src/components/ui/Footer.tsx index 5471c2e..798674f 100644 --- a/src/components/ui/Footer.tsx +++ b/src/components/ui/Footer.tsx @@ -41,9 +41,9 @@ export default function Footer() {

Contribution

- Issues + Issues About us - Contribution + Contribution
diff --git a/src/components/ui/Proverbs.tsx b/src/components/ui/Proverbs.tsx index 8a43a47..52dee66 100644 --- a/src/components/ui/Proverbs.tsx +++ b/src/components/ui/Proverbs.tsx @@ -2,12 +2,6 @@ import React from 'react'; import Style from "./Proverbs.module.css"; import {getRandomProverb} from "@/utils/proverbs"; -type ProverbProps = { - hindi: String, - english: string, - meaning?: String -} - const Proverbs = () => { const Proverb = getRandomProverb(); return ( diff --git a/src/lib/zod.ts b/src/lib/zod.ts index f268022..e287828 100644 --- a/src/lib/zod.ts +++ b/src/lib/zod.ts @@ -1,6 +1,7 @@ import {z} from "zod"; -const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/; +// const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/; +const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&\S]{8,}$/; export const loginSchema = z.object({ loginIdentifier: z.string().min(1, "Email or Username is required"), diff --git a/src/utils/festivals.ts b/src/utils/festivals.ts index f4f3858..5be84a4 100644 --- a/src/utils/festivals.ts +++ b/src/utils/festivals.ts @@ -2,21 +2,27 @@ // This interface ensures that every festival object will have two properties: // 1. 'name' - a string that stores the name of the festival. // 2. 'date' - a string that represents the date of the festival (in DD-MM format). +import GheeSankranti from "/public/Ghee_Sankranti.jpeg"; + export interface Festival { name: string; // The name of the festival, e.g., "Harela". date: string; // The date of the festival in DD-MM format, e.g., "16-07". + description: string; + location?: string; + image?: string; } // Define a constant 'festivals', which is an array of objects, each object conforming // to the 'Festival' interface. This array contains details about several Uttarakhand festivals. export const festivals: Festival[] = [ - {name: "Harela", date: "16-07"}, - {name: "Phool Dei", date: "14-03"}, - {name: "Nanda Devi Raj Jat", date: "05-09"}, - {name: "Bikhauti", date: "14-04"}, - {name: "Kauthig", date: "22-02"}, - {name: "Ghee Sankranti", date: "17-02"}, - {name: "Egaas Bhagwal", date: "12-03"} + {name:"Makar Sankranti", date:"14-01",description:"It marks the transition of the sun into Capricorn (Makar Rashi) and the start of longer days. In Uttarakhand, it is celebrated with great joy and enthusiasm, especially in the hill areas. People gather in open fields to fly kites, symbolizing the victory of light over darkness. Bonfires are lit, and people prepare traditional sweets like tilgul (made of sesame and jaggery) to share with friends and family. The festival also has agricultural importance, marking the end of winter and the beginning of the harvest season. Devotees take a holy dip in the Ganges or other rivers, believing it cleanses their sins. It’s a time for prayers for a good harvest, prosperity, and happiness in the coming year. People also worship the Sun God for health and well-being."}, + {name: "Ghee Sankranti", date: "17-02", description:" "}, + {name: "Phool Dei", date: "14-03", description:" "}, + {name: "Bikhauti", date: "14-04", description:" "}, + {name: "Harela", date: "16-07", description:" "}, + {name: "Nanda Devi Raj Jat", date: "05-09", description:" "}, + {name: "Kauthig", date: "22-02", description:" "}, + {name: "Egaas Bhagwal", date: "12-11", 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."}, ]; // Define a function 'getUpcomingFestival' which returns the festival happening today or the next upcoming festival, diff --git a/src/utils/proverbs.ts b/src/utils/proverbs.ts index 6c756d7..83a8c64 100644 --- a/src/utils/proverbs.ts +++ b/src/utils/proverbs.ts @@ -19,6 +19,7 @@ export const proverbs: Proverb[] = [ export const getRandomProverb = (): Proverb => { const randomIndex = Math.floor(Math.random() * proverbs.length); + // return proverbs[randomIndex]; return proverbs[0];