diff --git a/public/logo-dark.png b/public/logo-dark.png
new file mode 100644
index 0000000..2121efc
Binary files /dev/null and b/public/logo-dark.png differ
diff --git a/src/app/contextapi/ThemeContext.js b/src/app/contextapi/ThemeContext.js
index 2f794f8..0cf8eef 100644
--- a/src/app/contextapi/ThemeContext.js
+++ b/src/app/contextapi/ThemeContext.js
@@ -1,6 +1,6 @@
-import React from 'react'
+import React from "react";
export const ThemeContext = React.createContext({
darkMode: false,
- TtoggleDarkMode: () => {}
-})
+ TtoggleDarkMode: () => {},
+});
diff --git a/src/app/docs/page.js b/src/app/docs/page.js
new file mode 100644
index 0000000..d598509
--- /dev/null
+++ b/src/app/docs/page.js
@@ -0,0 +1,273 @@
+"use client";
+import { useContext } from "react";
+import React from "react";
+import Editor from "@monaco-editor/react";
+import { ThemeContext } from "../contextapi/ThemeContext";
+
+function Docs() {
+ const { darkMode } = useContext(ThemeContext);
+
+ return (
+
+
+
+ {/* Introduction Section */}
+
+
# Welcome to ZenDocs
+
+ Welcome to the{" "}
+
+ Zen programming universe
+ {" "}
+ — a place where coding is simple, fun, and totally stress-free! 🌟
+ In Zen, we've ditched the complicated stuff like delimiters
+ and indentation. Why? Because we believe coding should be a breeze
+ for beginners, letting you focus on the exciting world of
+ algorithms without the hassle of tricky syntax.
+
+
+ Whether you're taking your first coding steps or just want a
+ laid-back space to express your creativity, Zen is here for you.
+ So, kick back, relax, and let's make coding a joyful
+ experience together! 🚀
+
+
+
+ {/* Hello, Zen Section */}
+
+
Hello, Zen !!
+
+
+
+
+
What's Inside Zen?
+
+ Zen is made up of simple words and phrases that guide the computer
+ in a friendly way. Here are a few friends you'll meet often:
+
+
+
+ {/* PARAMPARA PRATISHTA ANUSHASHAN */}
+
+
+ PARAMPARA PRATISHTA ANUSHASHAN
+
+
+
+ Think of this as the magic words that begin your journey into
+ the world of Zen. It tells the computer that a Zen program is
+ about to begin.
+
+
+
+
+ {/* KHATAM TATA BYE BYE */}
+
+
KHATAM TATA BYE BYE
+
+ And this is how Zen gracefully concludes its conversation with
+ the computer, saying "Goodbye for now!"
+
+
+
+
+ {/* BOLE TOH */}
+
+
BOLE TOH
+
+ Introduce Zen to a new friend (variable) and provide them with a
+ starting value.
+
+
+
+
+ Here, a variable named A is created and initialised with the
+ value 10.
+
+
+
+ {/* INPUT LE LE RE BABA Section */}
+
+
INPUT LE LE RE BABA
+
+ Imagine Zen asking the user, "Hey, what's up?" This
+ is how you can reply and share something with Zen.
+
+
+
+
+
+ Zen asks for input (Re Baba!), and the user's response is
+ stored in the variable C.
+
+
+
+ {/* PRINT BASANTI PRINT Section */}
+
+
PRINT BASANTI PRINT
+
+ Zen loves to share its thoughts. Use this to make Zen tell you or
+ others what it's thinking.
+
+
+
+
+ Zen expresses its love for coding by printing the message
+ "Coding is fun!" to the console.
+
+
+
+ {/* AGAR, WARNA AGAR, NHI TOH Section */}
+ {/* Include similar sections for other Zen features and keywords */}
+
+ {/* JAB TAK HAI JAAN Section */}
+
+
JAB TAK HAI JAAN
+
+ Zen loves doing things repeatedly, like saying, "Let's
+ do this until something happens!" You can use this to create
+ exciting loops.
+
+
+
+
+
+ Zen prints numbers from 1 to 4 because the loop continues while A
+ is less than 5.
+
+
+
+ {/* Comments in Zen Section */}
+
+
Comments in Zen
+
+ In Zen, comments are your way of leaving little notes for yourself
+ or your fellow coders. You express comments using the @ symbol.
+ It's like a secret message that won't affect how your
+ program runs.
+
+
+
+
+ In this snippet, the line `@ This is a comment is there just for
+ you or anyone else reading the code. Zen sees it and says,
+ "Oh, I can ignore this part." Comments are handy for
+ making your code more understandable and sharing insights without
+ affecting how the program behaves. Happy commenting! 📝✨
+
+
+
+ {" "}
+ So, are you ready to start your Zen adventure? Dive in, have fun,
+ and let your imagination run wild! Remember, in Zen, coding is not
+ just a skill; it's a journey full of discovery and joy. Enjoy
+ the ride! 🌟
+
+
+
+
+
+
+
+
+
+ NUM2 TAB\n MAX BOLE TOH NUM1\nWARNA\n MAX BOLE TOH NUM2\nBAS ITNA HI\nPRINT BASANTI PRINT " Maximum Is : "\nPRINT BASANTI PRINT MAX\nKHATAM TATA BYE BYE`}
+ description="This program takes two numbers as input and prints the maximum of the two."
+ height={35}
+ />
+
+ 1 TAB TAK\n factorial BOLE TOH factorial * Num\n Num BOLE TOH Num - 1\nJAHAN\nPRINT BASANTI PRINT factorial\nKHATAM TATA BYE BYE`}
+ description="This program calculates the factorial of a number."
+ height={28}
+ />
+
+
+ {/* Second column */}
+
+ {/* Add more ExampleCard components for the second column */}
+
+ 0 TAB TAK\n PRINT BASANTI PRINT A\n NEXT BOLE TOH A + B\n A BOLE TOH B\n B BOLE TOH NEXT\n N BOLE TOH N - 1\nJAHAN\nKHATAM TATA BYE BYE`}
+ description="This program generates the Fibonacci sequence for the first 10 numbers."
+ height={34}
+ />
+
+ 0 TAB TAK\n PRINT BASANTI PRINT c\n c BOLE TOH c - 1\nJAHAN\nPRINT BASANTI PRINT 'Surprise !!'\nKHATAM TATA BYE BYE`}
+ description="This program uses a loop to countdown from 5 to 1 and then prints 'Surprise !!'"
+ height={27}
+ />
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default Examples;
diff --git a/src/app/forgotpassword/page.js b/src/app/forgotpassword/page.js
index 458836d..cdf66b9 100644
--- a/src/app/forgotpassword/page.js
+++ b/src/app/forgotpassword/page.js
@@ -1,64 +1,87 @@
-'use client'
-import React, { useState, useContext } from 'react'
-import Link from 'next/link'
-import { ThemeContext } from '../contextapi/ThemeContext'
+"use client";
+import React, { useState, useContext } from "react";
+import Link from "next/link";
+import { ThemeContext } from "../contextapi/ThemeContext";
export default function Forgotpassword() {
- const { darkMode } = useContext(ThemeContext)
- const [passwordError, setPasswordError] = useState('');
+ const { darkMode } = useContext(ThemeContext);
+ const [passwordError, setPasswordError] = useState("");
- const validatePassword = (password) => {
- const regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
- return regex.test(password);
- }
+ const validatePassword = (password) => {
+ const regex =
+ /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
+ return regex.test(password);
+ };
- const handlePasswordChange = (event) => {
- if (!validatePassword(event.target.value)) {
- setPasswordError('Password must be at least 8 characters long, contain at least one uppercase letter, one lowercase letter, one number, and one special character.');
- } else {
- setPasswordError('');
- }
+ const handlePasswordChange = (event) => {
+ if (!validatePassword(event.target.value)) {
+ setPasswordError(
+ "Password must be at least 8 characters long, contain at least one uppercase letter, one lowercase letter, one number, and one special character."
+ );
+ } else {
+ setPasswordError("");
}
+ };
- const backgroundImageURL = '/zen-lang-img.jpg';
+ const backgroundImageURL = "/zen-lang-img.jpg";
- return (
-
-
-
-
-
-
FORGOT PASSWORD
-
Don't have an account? Sign up
-
-
-
+ );
+}
diff --git a/src/app/help/page.js b/src/app/help/page.js
index 9d82de0..8da83a7 100644
--- a/src/app/help/page.js
+++ b/src/app/help/page.js
@@ -1,53 +1,58 @@
-'use client'
-import React, { useState, useEffect, useContext } from 'react'
-import Image from 'next/image'
-import { ThemeContext } from '../contextapi/ThemeContext'
+"use client";
+import React, { useState, useEffect, useContext } from "react";
+import Image from "next/image";
+import { ThemeContext } from "../contextapi/ThemeContext";
// Define your variables for text and contributors
-const logo = { src: '/logo.png', alt: 'Zen Logo', width: 200, height: 200 }
-const pageTitle = 'Welcome to Zen Lang'
-const pageDescription = `Zen Lang is an open-source programming language designed for simplicity and ease of use. It allows you to express your ideas with clarity and minimal boilerplate code. Whether you're a beginner or an experienced programmer, Zen Lang offers a clean and intuitive syntax that makes coding a breeze.`
+const pageTitle = "Welcome to Zen Lang";
+const pageDescription = `Zen Lang is an open-source programming language designed for simplicity and ease of use. It allows you to express your ideas with clarity and minimal boilerplate code. Whether you're a beginner or an experienced programmer, Zen Lang offers a clean and intuitive syntax that makes coding a breeze.`;
-const creditsTitle = 'Credits'
+const creditsTitle = "Credits";
const creditsDescription =
- 'Zen Lang was developed by a dedicated team of contributors:'
+ "Zen Lang was developed by a dedicated team of contributors:";
const footerText =
- 'If you have any questions or need assistance, please feel free to reach out to the Zen Lang community.'
+ "If you have any questions or need assistance, please feel free to reach out to the Zen Lang community.";
const contributorsData = [
{
- name: 'rootCircle',
- githubLink: 'https://github.com/rootCircle',
- avatarUrl: 'https://github.com/rootCircle.png'
+ name: "rootCircle",
+ githubLink: "https://github.com/rootCircle",
+ avatarUrl: "https://github.com/rootCircle.png",
},
{
- name: 'mohit07raghav19',
- githubLink: 'https://github.com/mohit07raghav19',
- avatarUrl: 'https://github.com/mohit07raghav19.png'
+ name: "mohit07raghav19",
+ githubLink: "https://github.com/mohit07raghav19",
+ avatarUrl: "https://github.com/mohit07raghav19.png",
},
{
- name: 'Harshit-Chordiya',
- githubLink: 'https://github.com/Harshit-Chordiya',
- avatarUrl: 'https://github.com/Harshit-Chordiya.png'
- }
-]
+ name: "Harshit-Chordiya",
+ githubLink: "https://github.com/Harshit-Chordiya",
+ avatarUrl: "https://github.com/Harshit-Chordiya.png",
+ },
+];
// Define the maximum number of contributors to display
-const maxContributorsToShow = 3
+const maxContributorsToShow = 3;
-function Help () {
- const [showAllContributors, setShowAllContributors] = useState(false)
- const { darkMode } = useContext(ThemeContext)
+function Help() {
+ const [showAllContributors, setShowAllContributors] = useState(false);
+ const { darkMode } = useContext(ThemeContext);
const visibleContributors = showAllContributors
? contributorsData
- : contributorsData.slice(0, maxContributorsToShow)
+ : contributorsData.slice(0, maxContributorsToShow);
+ const logo = {
+ src: darkMode ? "/logo-dark.png" : "/logo.png",
+ alt: "Zen Logo",
+ width: 200,
+ height: 200,
+ };
return (
-
+
{pageTitle}
@@ -65,50 +70,50 @@ function Help () {