feat: add Cloud Computing chapter content with all units

app/components/subjects.tsx

@@ -127,9 +127,19 @@ const subjectCodes: Record<string, string> = {
   "Decision Sciences": "des",
   "Software Engineering": "se",
 };
-
+const customHrefs: Record<string, string> = {
+  "cc": "/sem5/Cloud-Computing",
+  "cd": "/sem5/cd",
+  "cle": "/sem5/cle",
+};
 // Available subjects
-const available = ["ep", "c", "em1", "em2", "oops", "dsc", "coa", "os", "ml", "dops", "cd", "cle", "ec", "dbms", "bme", "cns", "vlsi", "mb"];
+<<<<<<< HEAD
+const available = ["ep", "c", "em1", "em2", "oops", "dsc", "coa", "os", "ml", "dops", "cd", "cle","ec","cc"];
+
+
+=======
+const available = ["ep", "c", "em1", "em2", "oops", "dsc", "coa", "os", "ml", "dops", "cd", "cle", "ec", "cc", "dbms", "bme", "cns", "vlsi", "mb"];
+>>>>>>> 9f1e2f55d5b308b1ab3ba88e557c00da6292e3ac
 
 export default function SubjectsSection() {
   return (
@@ -158,7 +168,7 @@ export default function SubjectsSection() {
               <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
                 {list.map((subj) => {
                   const code = subjectCodes[subj];
-                  const href = `/${semCode}/${code}/ch0`;
+                 const href = customHrefs[code] ?? `/${semCode}/${code}/ch0`;
                   const isAvailable = available.includes(code);
 
                   const baseClass =

app/sem5/Cloud-Computing/[Chapter]/page.tsx

@@ -0,0 +1,171 @@
+import Link from "next/link";
+import { Righteous } from "next/font/google";
+import { ArrowBigLeft, ArrowBigRight } from "lucide-react";
+import { chapters } from "../constants";
+
+const righteous = Righteous({
+  subsets: ["latin"],
+  weight: "400",
+  variable: "--font-righteous",
+});
+
+// Map chapter id to content component
+import { Ch0Content } from "../content/chapter0"
+import { Ch1Content } from "../content/chapter1";
+import { Ch2Content } from "../content/chapter2";
+import { Ch3Content } from "../content/chapter3";
+import { Ch4Content } from "../content/chapter4";
+import { Ch5Content } from "../content/chapter5";
+import { Ch6Content } from "../content/chapter6";
+import { Ch7Content } from "../content/chapter7";
+import { Ch8Content } from "../content/chapter8";
+import { Ch9Content } from "../content/chapter9";
+import { Ch10Content } from "../content/chapter10";
+import { Ch11Content } from "../content/chapter11";
+import { Ch12Content } from "../content/chapter12";
+import { Ch13Content } from "../content/chapter13";
+import { Ch14Content } from "../content/chapter14";
+import { Ch15Content } from "../content/chapter15";
+import { Ch16Content } from "../content/chapter16";
+import { Ch17Content } from "../content/chapter17";
+import { Ch18Content } from "../content/chapter18";
+import { Ch19Content } from "../content/chapter19";
+import { Ch20Content } from "../content/chapter20";
+import { Ch21Content } from "../content/chapter21";
+import { Ch22Content } from "../content/chapter22";
+import { Ch23Content } from "../content/chapter23";
+import { Ch24Content } from "../content/chapter24";
+import { Ch25Content } from "../content/chapter25";
+import { Ch26Content } from "../content/chapter26";
+import { Ch27Content } from "../content/chapter27";
+import { Ch28Content } from "../content/chapter28";
+
+const chapterComponents: Record<string, React.ComponentType> = {
+  ch0: Ch0Content,
+  ch1: Ch1Content,
+  ch2: Ch2Content,
+  ch3: Ch3Content,
+  ch4: Ch4Content,
+  ch5: Ch5Content,
+  ch6: Ch6Content,
+  ch7: Ch7Content,
+  ch8: Ch8Content,
+  ch9: Ch9Content,
+  ch10: Ch10Content,
+  ch11: Ch11Content,
+  ch12: Ch12Content,
+  ch13: Ch13Content,
+  ch14: Ch14Content,
+  ch15: Ch15Content,
+  ch16: Ch16Content,
+  ch17: Ch17Content,
+  ch18: Ch18Content,
+  ch19: Ch19Content,
+  ch20: Ch20Content,
+  ch21: Ch21Content,
+  ch22: Ch22Content,
+  ch23: Ch23Content,
+  ch24: Ch24Content,
+  ch25: Ch25Content,
+  ch26: Ch26Content,
+  ch27: Ch27Content,
+  ch28: Ch28Content,
+};
+
+type Props = { params: Promise<{ Chapter: string }> };
+
+export default async function ChapterPage({ params }: Props) {
+  const { Chapter: chapterId } = await params;
+
+  const chapterData = chapters.find((c) => c.id === chapterId);
+  const currentIndex = chapters.findIndex((c) => c.id === chapterId);
+  const prevChapter = currentIndex > 0 ? chapters[currentIndex - 1] : null;
+  const nextChapter = currentIndex < chapters.length - 1 ? chapters[currentIndex + 1] : null;
+
+  if (!chapterData) {
+    return (
+      <div className="flex flex-col items-center justify-center min-h-[50vh] text-[#e2d1c1]">
+        <h1 className="text-2xl font-bold mb-4">Chapter not found</h1>
+        <Link
+          href="/sem5/Cloud-Computing/ch1"
+          className="px-4 py-2 bg-[#e2d1c1] text-[#1b0d00] rounded hover:bg-[#ac9e91] transition font-bold"
+        >
+          Return to Chapter 1
+        </Link>
+      </div>
+    );
+  }
+
+  const ChapterComponent = chapterComponents[chapterId];
+
+  return (
+    <div className="flex flex-col bg-[#1B0D00] min-h-full p-2 pt-6 text-[#e2d1c1]">
+      <div className="flex-1">
+        <h1 className={`text-4xl font-bold ${righteous.className} mb-2`}>
+          Cloud Computing
+        </h1>
+
+        <p className={`text-2xl mt-[-8px] ${righteous.className}`}>
+          {chapterData.title}
+        </p>
+
+        <div className="flex justify-between mt-3">
+          {prevChapter ? (
+            <Link
+              href={`/sem5/Cloud-Computing/${prevChapter.id}`}
+              className="px-4 py-1 text-2xl flex items-center justify-center bg-[#e2d1c1] text-[#1b0d00] rounded hover:bg-[#ac9e91] transition"
+              style={{ fontFamily: "Rockwell, Serif, serif" }}
+            >
+              <ArrowBigLeft className="inline-block mr-1" /> Previous
+            </Link>
+          ) : <div />}
+
+          {nextChapter ? (
+            <Link
+              href={`/sem5/Cloud-Computing/${nextChapter.id}`}
+              className="px-4 py-1 text-2xl flex items-center justify-center bg-[#e2d1c1] text-[#1b0d00] rounded hover:bg-[#ac9e91] transition"
+              style={{ fontFamily: "Rockwell, Serif, serif" }}
+            >
+              Next <ArrowBigRight className="inline-block ml-1" />
+            </Link>
+          ) : <div />}
+        </div>
+
+        <hr className="my-6 border-t-3" />
+
+        {ChapterComponent ? (
+          <ChapterComponent />
+        ) : (
+          <div className="text-center py-12 text-[#c7a669]">
+            <p className="text-2xl font-semibold">Coming Soon</p>
+            <p className="mt-2 text-lg opacity-70">
+              This chapter is under development. Check back soon!
+            </p>
+          </div>
+        )}
+      </div>
+
+      <div className="flex justify-between my-8">
+        {prevChapter ? (
+          <Link
+            href={`/sem5/Cloud-Computing/${prevChapter.id}`}
+            className="px-4 py-2 bg-[#e2d1c1] text-xl flex items-center justify-center text-[#1b0d00] rounded hover:bg-[#ac9e91] transition"
+            style={{ fontFamily: "Rockwell, Serif, serif" }}
+          >
+            <ArrowBigLeft className="inline-block mr-1" /> {prevChapter.title}
+          </Link>
+        ) : <div />}
+
+        {nextChapter ? (
+          <Link
+            href={`/sem5/Cloud-Computing/${nextChapter.id}`}
+            className="px-4 py-2 bg-[#e2d1c1] text-xl flex items-center justify-center text-[#1b0d00] rounded hover:bg-[#ac9e91] transition"
+            style={{ fontFamily: "Rockwell, Serif, serif" }}
+          >
+            {nextChapter.title} <ArrowBigRight className="inline-block ml-1" />
+          </Link>
+        ) : <div />}
+      </div>
+    </div>
+  );
+}

app/sem5/Cloud-Computing/components/sidebar.tsx

@@ -0,0 +1,83 @@
+"use client";
+import { Righteous } from "next/font/google";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { useState, useEffect } from "react";
+import { chapters } from "../constants";
+
+const righteous = Righteous({
+  subsets: ["latin"],
+  weight: "400",
+  variable: "--font-righteous",
+});
+
+export default function Sidebar() {
+  const pathname = usePathname();
+  const [open, setOpen] = useState(false);
+
+  useEffect(() => {
+    if (window.innerWidth >= 768) {
+      setOpen(true);
+    }
+  }, []);
+
+  return (
+    <>
+      <div
+        className={`fixed inset-0 md:hidden bg-black/50 z-30 transition-opacity duration-300 ${
+          open ? "opacity-100" : "opacity-0 pointer-events-none"
+        }`}
+        onClick={() => setOpen(false)}
+      />
+
+      <div className="flex sticky top-14 z-40 h-[calc(100vh-3.5rem)] w-[50px] md:w-auto pointer-events-none md:pointer-events-auto">
+        <aside
+          className={`h-full shrink-0 bg-[#fae8d7] text-[#1B0D00] p-0 flex flex-col transition-all duration-300 pointer-events-auto border-r-0 ${
+            open ? "w-64 border-r-2 md:border-r-0" : "w-0 overflow-hidden"
+          }`}
+        >
+          <h2
+            className="flex items-center text-2xl font-normal pt-3 pl-3 mb-2 bg-[#cebb9c] text-[#1B0D00] pb-2 border-b-4 border-[#1B0D00]"
+            style={{ fontFamily: "Rockwell, Serif, serif" }}
+          >
+            Chapters
+          </h2>
+          <ul className="flex-1 overflow-y-auto no-scrollbar space-y-0">
+            {chapters.map((ch) => {
+              const active =
+                pathname === `/sem5/Cloud-Computing/${ch.id}` ||
+                (ch.subTopics?.some(
+                  (sub) => sub.isPage && pathname === `/sem5/Cloud-Computing/${sub.id}`
+                ) ?? false);
+              return (
+                <li key={ch.id} className="flex flex-col">
+                  <Link
+                    href={`/sem5/Cloud-Computing/${ch.id}`}
+                    className={`block px-3 py-2 text-xl transition ${
+                      active ? "bg-[#fccc7e]" : "hover:bg-[#ffdda7af]"
+                    } ${righteous.className}`}
+                  >
+                    {ch.title}
+                  </Link>
+                </li>
+              );
+            })}
+          </ul>
+        </aside>
+
+        <button
+          onClick={() => setOpen(!open)}
+          className="toggle-sidebar shrink-0 pointer-events-auto bg-[#ffdda7] h-full w-[50px] text-[#1B0D00] text-center font-semibold text-2xl border-l-4 rounded-r-2xl border-[#1B0D00] flex items-center justify-center transition-all duration-300 md:shadow-none"
+          style={{
+            fontFamily: "Rockwell, Serif, serif",
+            boxShadow: open ? "4px 0 15px rgba(0,0,0,0.1)" : "none",
+          }}
+        >
+          <p className="leading-5">
+            C<br />H<br />A<br />P<br />T<br />E<br />R<br />S
+          </p>
+        </button>
+      </div>
+    </>
+  );
+}

app/sem5/Cloud-Computing/constants.ts

@@ -0,0 +1,43 @@
+export type Chapter = {
+  id: string;
+  title: string;
+  subTopics?: SubTopic[];
+};
+
+export type SubTopic = {
+  id: string;
+  title: string;
+  isPage?: true;
+};
+
+export const chapters: Chapter[] = [
+  { id: "ch0", title: "Course Outline" },
+  { id: "ch1", title: "What is Cloud Computing" },
+  { id: "ch2", title: "Cloud Computing Models" },
+  { id: "ch3", title: "Benefits and Challenges" },
+  { id: "ch4", title: "Cloud vs On-Premises" },
+  { id: "ch5", title: "Infrastructure as a Service (IaaS)" },
+  { id: "ch6", title: "Platform as a Service (PaaS)" },
+  { id: "ch7", title: "Software as a Service (SaaS)" },
+  { id: "ch8", title: "Comparing Service Models" },
+  { id: "ch9", title: "Public Cloud" },
+  { id: "ch10", title: "Private Cloud" },
+  { id: "ch11", title: "Hybrid Cloud" },
+  { id: "ch12", title: "Community Cloud" },
+  { id: "ch13", title: "Cloud-Native Architecture" },
+  { id: "ch14", title: "Microservices Architecture" },
+  { id: "ch15", title: "Scalability Patterns" },
+  { id: "ch16", title: "High Availability & Disaster Recovery" },
+  { id: "ch17", title: "Identity & Access Management" },
+  { id: "ch18", title: "Data Protection" },
+  { id: "ch19", title: "Network Security" },
+  { id: "ch20", title: "Compliance & Governance" },
+  { id: "ch21", title: "Amazon Web Services (AWS)" },
+  { id: "ch22", title: "Microsoft Azure" },
+  { id: "ch23", title: "Google Cloud Platform" },
+  { id: "ch24", title: "Provider Comparison & Cost Analysis" },
+  { id: "ch25", title: "Docker Fundamentals" },
+  { id: "ch26", title: "Container Best Practices" },
+  { id: "ch27", title: "Kubernetes Basics" },
+  { id: "ch28", title: "Managing Cloud Containers" },
+];