add names to readme

README.md

@@ -1,2 +1,14 @@
 # 2025-applicant-workshop
+
 An introduction to modern CSS & exploratory JS
+
+##
+-Brad.
+-Noam.
+
+
+
+
+
+
+-beth

index.html

@@ -27,6 +27,7 @@ <h2>Section 1: Introduction</h2>
             <div class="hidden-info">Here is some hidden information.</div>
         </section>
 
+
         <section id="section2" class="content-section">
             <h2>Section 2: Interactive Area</h2>
             <p>Try interacting with the elements below.</p>
@@ -53,6 +54,14 @@ <h2>Section 3: Form Section</h2>
             <h2>Section 4: Data Section</h2>
             <div id="data-container"></div>
         </section>
+
+
+        <section id="sectionX" class="content-section">
+            <h2>Section X: Testing area</h2>
+            <p> Brad and Noam spent 3 hours breaking this website and all I got were these lousy buttons. </p>
+            <button id="hide-btn">Hide Section 2</button>
+            <button id="show-btn">Bring back Section 2</button>
+        </section>
     </main>
 
     <footer>

script.js

@@ -42,6 +42,32 @@ function renderItems(items) {
     });
   }
 
+  // Creating a new paragraph element
+const newParagraph = document.createElement('p');
+newParagraph.setAttribute('id','testId');
+// Setting the text content of the new paragraph
+newParagraph.textContent = 'I hate GitHub.';
+
+// Appending the new paragraph to the body of the document
+document.body.appendChild(newParagraph)
+
+
+
+const hideButton = document.getElementById('hide-btn')
+const showButton = document.getElementById('show-btn')
+
+hideButton.addEventListener('click', function hideSection2(){
+  const section2 = document.getElementById('section2');
+  section2.style.display = 'none';
+ }
+);
+
+showButton.addEventListener('click', function showSection2(){
+  const section2 = document.getElementById('section2');
+  section2.style.display = '';
+ }
+);
+
 /* IDEAS FOR ADDITIONAL INTERACTIONS
 
 1. Add functionality to highlight the navigation link of the current section as the user scrolls.
@@ -58,4 +84,5 @@ function renderItems(items) {
 */
 
 // Call the render function on page load or when needed
-renderItems(dataItems);
+renderItems(dataItems);
+;

styles.css

@@ -1,6 +1,6 @@
 :root {
     --primary-color: #4CAF50;
-    --secondary-color: #f4f4f4;
+    --secondary-color: hsl(308, 79%, 66%);
     --font-family: Arial, sans-serif;
     --text-color: #333;
     --border-radius: 5px;
@@ -50,6 +50,10 @@ nav a:hover {
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
+#testId {
+    color: var(--primary-color);
+}
+
 button {
     background-color: var(--primary-color);
     color: white;