Merge pull request #6 from code4policy/manish

GroupM Demo
code4policy · Jan 13, 2025 · 0b8d7ca · 0b8d7ca
2 parents 0223942 + 5838a3e
commit 0b8d7ca
Show file tree

Hide file tree

Showing 5 changed files with 143 additions and 11 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
@@ -1,11 +1,52 @@
 <!DOCTYPE html>
-<html>
-    <head>
-        <title>Demo Website</title>
-    </head>
-    <body>
-        <h1>Our Demonstration Website</h1>
-        <a href='our-team/index.html'>Learn more about our team</a>
-        <h2>  My name is karan the great</h2>
-    </body>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Guided Course Selection</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <header>
+        <h1>Guided Course Selection System</h1>
+    </header>
+
+    <div class="container">
+        <h2>Career Pathway Survey</h2>
+        <p>Fill out the details below to receive personalized course recommendations:</p>
+
+        <form id="surveyForm">
+            <div class="form-group">
+                <label for="careerGoal">What is your primary career goal?</label>
+                <input type="text" id="careerGoal" name="careerGoal" required>
+            </div>
+
+            <div class="form-group">
+                <label for="industryPreference">Preferred Industry:</label>
+                <select id="industryPreference" name="industryPreference" required>
+                    <option value="">Select an Industry</option>
+                    <option value="Data & Technology">Data & Technology</option>
+                    <option value="Government & Politics">Government & Politics</option>
+                    <option value="International Development">International Development</option>
+                    <option value="Leadership & Organizational Change">Leadership and Organizational Change</option>
+                    <option value="Entrepreneurship & Non-Profits">Entrepreneurship & Non-Profits</option>
+                </select>
+            </div>
+
+            <div class="form-group">
+                <label for="skills">What skills do you wish to acquire?</label>
+                <input type="text" id="skills" name="skills" required>
+            </div>
+
+            <button type="submit">Submit</button>
+        </form>
+
+        <div class="results" id="results">
+            <h3>Recommended Courses</h3>
+            <ul id="courseList"></ul>
+        </div>
+    </div>
+
+    <script src="script.js"></script>
+</body>
 </html>
diff --git a/script.js b/script.js
@@ -0,0 +1,46 @@
+const courseRecommendations = {
+    "Data & Technology": [
+        "Machine Learning and Big Data Analytics",
+        "Data Science for Politics",
+        "Digital Government",
+        "Law, Order, and Algorithms"
+    ],
+    "Government & Politics": [
+        "Politics and Public Policy",
+        "Ethics and Political Decision-Making",
+        "Leadership in Public Sector Organizations"
+    ],
+    "International Development": [
+        "Development Finance",
+        "Public-Private Partnerships",
+        "Infrastructure Policy and Planning"
+    ],
+    "Leadership & Organizational Change": [
+        "Negotiation Skills",
+        "Strategy for Impact",
+        "Operations Management"
+    ],
+    "Entrepreneurship & Non-Profits": [
+        "Social Impact Ventures",
+        "Fundraising and Resource Mobilization",
+        "NGO Management"
+    ]
+};
+
+document.getElementById('surveyForm').addEventListener('submit', function(e) {
+    e.preventDefault();
+
+    const industry = document.getElementById('industryPreference').value;
+    const courseList = document.getElementById('courseList');
+    courseList.innerHTML = '';
+
+    if (industry && courseRecommendations[industry]) {
+        courseRecommendations[industry].forEach(course => {
+            const li = document.createElement('li');
+            li.textContent = course;
+            courseList.appendChild(li);
+        });
+    } else {
+        courseList.innerHTML = '<li>No recommendations available. Please try again.</li>';
+    }
+});
diff --git a/styles.css b/styles.css
@@ -0,0 +1,47 @@
+body {
+    font-family: Arial, sans-serif;
+    margin: 0;
+    padding: 0;
+    background-color: #f4f4f9;
+    color: #333;
+}
+header {
+    background-color: #003366;
+    color: white;
+    padding: 10px 20px;
+    text-align: center;
+}
+.container {
+    max-width: 900px;
+    margin: 20px auto;
+    padding: 20px;
+    background: white;
+    border-radius: 8px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+.form-group {
+    margin-bottom: 15px;
+}
+label {
+    display: block;
+    font-weight: bold;
+}
+input, select, button {
+    width: 100%;
+    padding: 10px;
+    margin-top: 5px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+button {
+    background-color: #003366;
+    color: white;
+    font-size: 16px;
+    cursor: pointer;
+}
+button:hover {
+    background-color: #00509e;
+}
+.results {
+    margin-top: 20px;
+}