aptyInc · Saidurgasatturi · Sep 30, 2025 · Oct 30, 2025
diff --git a/css/advanced/Assignment-1/index.html b/css/advanced/Assignment-1/index.html
diff --git a/css/advanced/Assignment-1/style.css b/css/advanced/Assignment-1/style.css
@@ -0,0 +1,69 @@
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Arial, sans-serif;
+  line-height: 1.6;
+}
+
+header {
+  background: #0d0a99;
+  color: #fff;
+  padding: 20px;
+  text-align: center;
+}
+
+nav ul {
+  list-style: none;
+  display: flex;
+  justify-content: center;
+  gap: 20px;
+  margin-top: 10px;
+}
+
+nav a {
+  color: #fff;
+  text-decoration: none;
+}
+
+main {
+  display: flex;
+  padding: 20px;
+  gap: 20px;
+}
+
+article {
+  flex: 3;
+  background: #2c13a8;
+  color: #fff;
+  padding: 20px;
+  border-radius: 8px;
+}
+
+aside {
+  flex: 1;
+  background: #4d119b;
+  color: #fff;
+  padding: 20px;
+  border-radius: 8px;
+}
+
+footer {
+  background: #3f12ba;
+  color: #fff;
+  text-align: center;
+  padding: 15px;
+  margin-top: 20px;
+  bottom: auto;
+}
+
+@media (max-width: 768px) {
+  main {
+    flex-direction: column;
+    flex:1;
+  }
+}
diff --git a/css/advanced/Assignment-2/animations.html b/css/advanced/Assignment-2/animations.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>CSS Animation & Media Queries</title>
+  <style>
+    body {
+      font-family: Arial, sans-serif;
+      margin: 0;
+      padding: 0;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+      background: #f0f0f0;
+    }
+    .box {
+      width: 150px;
+      height: 150px;
+      background: #3498db;
+      border-radius: 10px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      color: white;
+      font-weight: bold;
+      animation: bounce 2s infinite;
+    }
+    @keyframes bounce {
+      0%, 100% {
+        transform: translateY(0);
+      }
+      50% {
+        transform: translateY(-50px);
+      }
+    }
+    @media (max-width: 768px) {
+      .box {
+        width: 120px;
+        height: 120px;
+        font-size: 14px;
+        background: #e67e22;
+      }
+    }
+
+    @media (max-width: 480px) {
+      .box {
+        width: 90px;
+        height: 90px;
+        font-size: 12px;
+        background: #2ecc71;
+      }
+    }
+  </style>
+</head>
+<body>
+  <div class="box">Hello Guys..!</div>
+</body>
+</html>
diff --git a/javascript/5-functions-error-handling/Assignment-1/fibonacci.html b/javascript/5-functions-error-handling/Assignment-1/fibonacci.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Fibonacci Series using Recursion</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <div class="container">
+    <h2>Fibonacci Series (Recursive - Function Declaration)</h2>
+
+    <label for="num">Enter Number:</label>
+    <input type="number" id="num" placeholder="Enter a number">
+
+    <button onclick="generateFibonacci()">Generate Series</button>
+
+    <div id="result"></div>
+  </div>
+
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/javascript/5-functions-error-handling/Assignment-1/script.js b/javascript/5-functions-error-handling/Assignment-1/script.js
@@ -0,0 +1,19 @@
+
+function fibonacci(n) {
+  if (n <= 1) return n;
+  return fibonacci(n - 1) + fibonacci(n - 2);
+}
+
+function generateFibonacci() {
+  const num = parseInt(document.getElementById("num").value);
+  let series = [];
+
+  for (let i = 0; i < num; i++) {
+    series.push(fibonacci(i));
+  }
+
+  document.getElementById("result").innerHTML = 
+    `Fibonacci Series up to ${num} terms:<br>${series.join(', ')}`;
+
+  console.log("Fibonacci Series:", series);
+}
diff --git a/javascript/5-functions-error-handling/Assignment-1/style.css b/javascript/5-functions-error-handling/Assignment-1/style.css
@@ -0,0 +1,46 @@
+body {
+  font-family: Arial, sans-serif;
+  margin: 40px;
+  background-color: #f5f5f5;
+}
+
+.container {
+  background: white;
+  padding: 20px;
+  border-radius: 12px;
+  box-shadow: 0 0 10px rgba(0,0,0,0.1);
+  max-width: 400px;
+  margin: auto;
+}
+
+h2 {
+  text-align: center;
+  color: #333;
+}
+
+input, button {
+  padding: 10px;
+  width: 100%;
+  margin-top: 10px;
+  font-size: 16px;
+}
+
+button {
+  background-color: #2196f3;
+  color: white;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+}
+
+button:hover {
+  background-color: #1976d2;
+}
+
+#result {
+  margin-top: 15px;
+  background: #e8f5e9;
+  padding: 10px;
+  border-radius: 8px;
+  font-weight: bold;
+}
diff --git a/javascript/5-functions-error-handling/Assignment-10/lexical.html b/javascript/5-functions-error-handling/Assignment-10/lexical.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Lexical Scoping in Nested Functions</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <div class="container">
+    <h2>Lexical Scoping - Nested Functions Example</h2>
+
+    <label for="first">Enter First Word:</label>
+    <input type="text" id="first" placeholder="e.g., Hello">
+
+    <label for="second">Enter Second Word:</label>
+    <input type="text" id="second" placeholder="e.g., Beautiful">
+
+    <label for="third">Enter Third Word:</label>
+    <input type="text" id="third" placeholder="e.g., World">
+
+    <button onclick="generateMessage()">Generate Message</button>
+
+    <div id="result"></div>
+  </div>
+
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/javascript/5-functions-error-handling/Assignment-10/script.js b/javascript/5-functions-error-handling/Assignment-10/script.js
@@ -0,0 +1,26 @@
+
+
+function outerFunction(word1) {
+
+  return function middleFunction(word2) {
+
+    return function innerFunction(word3) {
+      return `${word1} ${word2} ${word3}!`; 
+    };
+  };
+}
+
+function generateMessage() {
+  const first = document.getElementById("first").value.trim();
+  const second = document.getElementById("second").value.trim();
+  const third = document.getElementById("third").value.trim();
+
+  if (!first || !second || !third) {
+    document.getElementById("result").innerHTML = "<p style='color:red;'>Please fill all fields!</p>";
+    return;
+  }
+
+  const message = outerFunction(first)(middle = second)(third);
+
+  document.getElementById("result").innerText = `Result: ${message}`;
+}
diff --git a/javascript/5-functions-error-handling/Assignment-10/style.css b/javascript/5-functions-error-handling/Assignment-10/style.css
@@ -0,0 +1,60 @@
+body {
+  font-family: Arial, sans-serif;
+  background-color: #f3f3f3;
+  margin: 40px;
+}
+
+.container {
+  background: white;
+  padding: 30px;
+  border-radius: 12px;
+  box-shadow: 0 0 10px rgba(0,0,0,0.1);
+  width: 380px;
+  margin: auto;
+}
+
+h2 {
+  text-align: center;
+  color: #333;
+}
+
+label {
+  display: block;
+  margin-top: 10px;
+  font-weight: bold;
+}
+
+input {
+  width: 100%;
+  padding: 10px;
+  margin-top: 5px;
+  font-size: 16px;
+  border-radius: 6px;
+  border: 1px solid #ccc;
+}
+
+button {
+  width: 100%;
+  padding: 10px;
+  margin-top: 15px;
+  background-color: #3949ab;
+  color: white;
+  border: none;
+  border-radius: 6px;
+  font-size: 16px;
+  cursor: pointer;
+}
+
+button:hover {
+  background-color: #283593;
+}
+
+#result {
+  margin-top: 20px;
+  background: #e8eaf6;
+  padding: 10px;
+  border-radius: 6px;
+  text-align: center;
+  font-weight: bold;
+  color: #1a237e;
+}
diff --git a/javascript/5-functions-error-handling/Assignment-11/higherorder.html b/javascript/5-functions-error-handling/Assignment-11/higherorder.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Higher-Order Function - repeatAction()</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <div class="container">
+    <h2>Higher-Order Function Example</h2>
+    <p>Use <strong>repeatAction()</strong> to repeat a task multiple times.</p>
+
+    <label for="itemText">Enter Item Text:</label>
+    <input type="text" id="itemText" placeholder="e.g., Apple">
+
+    <label for="count">How many times to repeat?</label>
+    <input type="number" id="count" min="1" placeholder="e.g., 5">
+
+    <button onclick="createList()">Create List</button>
+
+    <ul id="itemList"></ul>
+  </div>
+
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/javascript/5-functions-error-handling/Assignment-11/script.js b/javascript/5-functions-error-handling/Assignment-11/script.js
@@ -0,0 +1,28 @@
+
+
+function repeatAction(action, n) {
+  for (let i = 0; i < n; i++) {
+    action(i); 
+  }
+}
+
+function createList() {
+  const text = document.getElementById("itemText").value.trim();
+  const count = Number(document.getElementById("count").value);
+  const list = document.getElementById("itemList");
+
+  list.innerHTML = "";
+
+  if (!text || count <= 0) {
+    list.innerHTML = "<p style='color:red;'>Please enter valid text and count!</p>";
+    return;
+  }
+
+  const addItem = (index) => {
+    const li = document.createElement("li");
+    li.textContent = `${index + 1}. ${text}`;
+    list.appendChild(li);
+  };
+
+  repeatAction(addItem, count);
+}