From 925fbd33d6ecf31b18134d13d5b7a2eca30cccd6 Mon Sep 17 00:00:00 2001
From: vijayvemul14 <vijayvemul14@gmail.com>
Date: Thu, 28 Aug 2025 12:00:33 +0530
Subject: [PATCH 1/5] HTML Assessments

---
 Week 1.1 - HTML/1. Build a Form/index.html    | 20 ++++++++++
 .../index.html                                | 12 ++++++
 .../index.html                                | 13 +++++++
 .../4. Mock Up a Design/index.html            | 37 +++++++++++++++++++
 4 files changed, 82 insertions(+)
diff --git a/Week 1.1 - HTML/1. Build a Form/index.html b/Week 1.1 - HTML/1. Build a Form/index.html
index 50432a8b..84eaafbe 100644
--- a/Week 1.1 - HTML/1. Build a Form/index.html	
+++ b/Week 1.1 - HTML/1. Build a Form/index.html	
@@ -8,6 +8,26 @@
 <body>
 	
 	<!-- Add your code here -->
+	<div class="container">
+		<form method="POST" action="/login/">
+
+		<div class="form">
+			<label> Enter an email address:
+			<input type="email" id="emailInput" value="" required />
+			</label>
+		</div>
+
+		<div class="form">
+			<label for="pass">Enter an password:
+			<input type="password" id="pass" name="password"  required />
+			</label>
+		</div>
+			
+			<input type="submit" value="Submit" />
+			
+		</form>
+    </div>
+
 
 </body>
 </html>
\ No newline at end of file
diff --git a/Week 1.1 - HTML/2. Create a Responsive Image - Resolution/index.html b/Week 1.1 - HTML/2. Create a Responsive Image - Resolution/index.html
index a132ac2a..67e7f332 100644
--- a/Week 1.1 - HTML/2. Create a Responsive Image - Resolution/index.html	
+++ b/Week 1.1 - HTML/2. Create a Responsive Image - Resolution/index.html	
@@ -25,6 +25,18 @@
 <body>
 	
 	<!-- Add your code here -->
+	    <picture>
+           <source media ="(min-width:1800px)" srcset="https://placehold.co/800x360" />
+           <source media ="(min-width:1440px)" srcset="https://placehold.co/1600x720" />
+           <source media ="(min-width:1024px)" srcset="https://placehold.co/1200x540" />
+           <source media ="(min-width:640px)" srcset="https://placehold.co/800x360" />
+           
+           <!-- Default Image -->
+           <img class="responsive-img" src="https://placehold.co/400x180" /> 
+       
+        </picture>
+   
+	 
 
 </body>
 </html>
\ No newline at end of file
diff --git a/Week 1.1 - HTML/3. Create a Reponsive Image - Aspect Ratio/index.html b/Week 1.1 - HTML/3. Create a Reponsive Image - Aspect Ratio/index.html
index d8bb518c..757c0348 100644
--- a/Week 1.1 - HTML/3. Create a Reponsive Image - Aspect Ratio/index.html	
+++ b/Week 1.1 - HTML/3. Create a Reponsive Image - Aspect Ratio/index.html	
@@ -25,6 +25,19 @@
 <body>
 	
 	<!-- Add your code here -->
+	<picture>
+           <!-- Desktop ratio 20:9 -->
+           <source media ="(min-width:1024px)" srcset="https://placehold.co/1600x720" />
+
+           <!-- Tablet ratio 4:3 -->
+           <source media ="(min-width:640px)" srcset="https://placehold.co/1200x900" />
+          
+           
+           <!-- Default Mobile ratio 1:1 -->
+           <img class="responsive-img" src="https://placehold.co/540x800" /> 
+       
+    </picture>
+
 
 </body>
 </html>
\ No newline at end of file
diff --git a/Week 1.1 - HTML/4. Mock Up a Design/index.html b/Week 1.1 - HTML/4. Mock Up a Design/index.html
index a7252a6f..c69d54ac 100644
--- a/Week 1.1 - HTML/4. Mock Up a Design/index.html	
+++ b/Week 1.1 - HTML/4. Mock Up a Design/index.html	
@@ -9,5 +9,42 @@
 	
 	<!-- Add your code here -->
 
+	<section id="content-slider">
+          <div class="slides">
+            <div class="slide">
+               <div class="slide-content">
+                <h4>Top Heading</h4>
+                <h1>Title</h1>
+                <h4>Sub Heading</h4>
+                <p> paragraph </p>
+
+                <hr />
+          
+                <h4>list title:</h4>
+                <ul>
+                  <li></li>
+                  <li></li>
+                  <li></li>
+                  <li></li>
+                </ul>
+
+                <div class="icon-box">
+                  <div class="icon-box-content">
+                   <h4> Icon box title <span class="icon">icon</span></h4>
+                   <p> description </p>
+                  </div>
+                </div>
+
+               </div>
+            </div>
+          </div>
+
+
+        <div class="dots-vertical" role="tablist" aria-label="slide navigation" id="dots"></div>
+            
+            
+    </section>
+
+
 </body>
 </html>
\ No newline at end of file

From e29837375cbb79bcbf22cb478afeac3f0b7caa3e Mon Sep 17 00:00:00 2001
From: vijayvemul14 <vijayvemul14@gmail.com>
Date: Thu, 28 Aug 2025 12:09:27 +0530
Subject: [PATCH 2/5] CSS Assessments

---
 .../1. Selectors - Attributes/index.html      |  2 +-
 .../2. Selectors - Children/index.html        |  2 +-
 .../3. Selectors - Siblings/index.html        |  2 +-
 .../4. Inheritance and Systems/index.html     | 30 +++++++++++++++++++
 Week 1.2 - CSS/5. Transitions/index.html      |  9 ++++++
 .../6. Tricks - Click Passthrough/index.html  |  1 +
 6 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/Week 1.2 - CSS/1. Selectors - Attributes/index.html b/Week 1.2 - CSS/1. Selectors - Attributes/index.html
index 3d9c05b8..012bf5c2 100644
--- a/Week 1.2 - CSS/1. Selectors - Attributes/index.html	
+++ b/Week 1.2 - CSS/1. Selectors - Attributes/index.html	
@@ -9,7 +9,7 @@
 	
 	<style>
 		/* Update the following line of CSS to only style the inputs of type `text` */
-		* { border: 2px solid rebeccapurple; }
+		input[type="text"] { border: 2px solid rebeccapurple; }
 	</style>
 
 	<input type="text" />
diff --git a/Week 1.2 - CSS/2. Selectors - Children/index.html b/Week 1.2 - CSS/2. Selectors - Children/index.html
index 7ff366db..3a43d88b 100644
--- a/Week 1.2 - CSS/2. Selectors - Children/index.html	
+++ b/Week 1.2 - CSS/2. Selectors - Children/index.html	
@@ -9,7 +9,7 @@
 	
 	<style>
 		/* Update the following line of CSS to only style the immediate `.item` children of `.container` */
-		.container .item { border: 2px solid rebeccapurple; }
+		.container > .item { border: 2px solid rebeccapurple; }
 	</style>
 
 	<ul class="container">
diff --git a/Week 1.2 - CSS/3. Selectors - Siblings/index.html b/Week 1.2 - CSS/3. Selectors - Siblings/index.html
index b6086a75..1b683a91 100644
--- a/Week 1.2 - CSS/3. Selectors - Siblings/index.html	
+++ b/Week 1.2 - CSS/3. Selectors - Siblings/index.html	
@@ -16,7 +16,7 @@
 	
 	<style>
 		/* Update the following line of CSS to only style `<p>` that follow an `<h2>` */
-		p {
+		h2 + p {
 			font-size: 22px;
 			line-height: 1.5;
 			color: rebeccapurple;
diff --git a/Week 1.2 - CSS/4. Inheritance and Systems/index.html b/Week 1.2 - CSS/4. Inheritance and Systems/index.html
index e1c5e441..41b97342 100644
--- a/Week 1.2 - CSS/4. Inheritance and Systems/index.html	
+++ b/Week 1.2 - CSS/4. Inheritance and Systems/index.html	
@@ -9,6 +9,36 @@
 	
 	<style>
 		/* Add your CSS here */
+
+		 .btn{
+
+                color:#000;
+                border-radius:4px;
+                padding: 12px 32px;
+                cursor: pointer;
+                border: 1px solid transparent;
+                transition: all 0.3s ease;
+
+            }
+                
+        .btn.default{
+                 background: #f5f5f5;
+            }
+
+	    .btn.primary{
+                 background: #90CDF4;
+            }
+ 
+        .btn.link{
+                 background: transparent;
+                 text-decoration:underline;
+            }
+
+        .btn.danger{
+                background: #FEB2B2;
+
+            }
+
 	</style>
 
 	<!-- Add as many or as few classes as needed to accomplish the goal to the buttons below -->
diff --git a/Week 1.2 - CSS/5. Transitions/index.html b/Week 1.2 - CSS/5. Transitions/index.html
index 4fa3bd71..d20e0cea 100644
--- a/Week 1.2 - CSS/5. Transitions/index.html	
+++ b/Week 1.2 - CSS/5. Transitions/index.html	
@@ -22,7 +22,16 @@
 			width: 100px;
 			height: 100px;
 			background-color: rebeccapurple;
+			transition: transform 160ms ease;
+            transform: scale(1);
 		}
+
+		.box:hover {
+           
+            transition: transform 200ms ease;
+            transform: scale(2);
+        }
+		
 	</style>
 
 	<div class="box"></div>
diff --git a/Week 1.2 - CSS/6. Tricks - Click Passthrough/index.html b/Week 1.2 - CSS/6. Tricks - Click Passthrough/index.html
index 769c1a18..c23c0e69 100644
--- a/Week 1.2 - CSS/6. Tricks - Click Passthrough/index.html	
+++ b/Week 1.2 - CSS/6. Tricks - Click Passthrough/index.html	
@@ -29,6 +29,7 @@
 			width: 100%;
 			height: 100%;
 			background-image: linear-gradient(to bottom, transparent, black);
+		    pointer-events:none;
 		}
 	</style>
 	

From 34376fc41cd90da61f14fe75c3e588ca2a6fa06c Mon Sep 17 00:00:00 2001
From: vijayvemul14 <vijayvemul14@gmail.com>
Date: Mon, 1 Sep 2025 18:28:05 +0530
Subject: [PATCH 3/5] Javascript Assessments

---
 Week 1.3 - JavaScript/1. Filter/index.html    |  2 +-
 Week 1.3 - JavaScript/2. Map/index.html       |  4 ++-
 .../3. Objects as a Map/index.html            | 15 ++++-------
 .../4. Event Listeners/index.html             |  4 +++
 .../5. DOM Manipulation/index.html            |  5 ++++
 .../Data Fetching/index.html                  | 27 +++++++++++++++++++
 6 files changed, 45 insertions(+), 12 deletions(-)

diff --git a/Week 1.3 - JavaScript/1. Filter/index.html b/Week 1.3 - JavaScript/1. Filter/index.html
index e74982a2..5611796a 100644
--- a/Week 1.3 - JavaScript/1. Filter/index.html	
+++ b/Week 1.3 - JavaScript/1. Filter/index.html	
@@ -13,7 +13,7 @@
 		// Custom Code BEGIN 
 		// Modify the code in this block however you need to get the desired ending array.
 		// You must store your new array in the `endingArray` variable for it to log out properly.
-		let endingArray;
+		let endingArray = startingArray.filter((num, index) => index % 2 == 1);
 
 		// Custom Code END
 
diff --git a/Week 1.3 - JavaScript/2. Map/index.html b/Week 1.3 - JavaScript/2. Map/index.html
index 72fa39ee..0714a567 100644
--- a/Week 1.3 - JavaScript/2. Map/index.html	
+++ b/Week 1.3 - JavaScript/2. Map/index.html	
@@ -13,7 +13,9 @@
 		// Custom Code BEGIN 
 		// Modify the code in this block however you need to get the desired ending array.
 		// You must store your new array in the `endingArray` variable for it to log out properly.
-		let endingArray;
+		let endingArray = startingArray.map((element) => {
+			return {name : element};
+		});
 
 		// Custom Code END
 
diff --git a/Week 1.3 - JavaScript/3. Objects as a Map/index.html b/Week 1.3 - JavaScript/3. Objects as a Map/index.html
index 3004949a..39a8c854 100644
--- a/Week 1.3 - JavaScript/3. Objects as a Map/index.html	
+++ b/Week 1.3 - JavaScript/3. Objects as a Map/index.html	
@@ -13,19 +13,14 @@
 
 		// Rewrite this function to replace the if/else logic with a map lookup.
 		function getInformation(key) {
-			let rtn;
+			const rtn = {
 
-			if (key === 'date') {
-				rtn = 'October 6, 1986';
-			} else if (key === 'time') {
-				rtn = '21:13 PM';
-			} else if (key === 'mood') {
-				rtn = 'Powerful, spirited...';
-			} else {
-				rtn = 'Error: Invalid option selected...';
+				date: 'October 6, 1986',
+				time: '21:13 PM',
+				mood: 'Powerful, spirited...',
 			}
 
-			return rtn;
+			return rtn[key];
 		}
 	</script>
 
diff --git a/Week 1.3 - JavaScript/4. Event Listeners/index.html b/Week 1.3 - JavaScript/4. Event Listeners/index.html
index d284e48f..efa2de6a 100644
--- a/Week 1.3 - JavaScript/4. Event Listeners/index.html	
+++ b/Week 1.3 - JavaScript/4. Event Listeners/index.html	
@@ -20,6 +20,10 @@ <h1 data-counter>0</h1>
 		}
 
 		// Add your code here to make clicking the button run the increment function
+
+		const button = document.querySelector('[data-action]');
+		button.addEventListener("click", increment);
+		
 	</script>
 
 </body>
diff --git a/Week 1.3 - JavaScript/5. DOM Manipulation/index.html b/Week 1.3 - JavaScript/5. DOM Manipulation/index.html
index ba0e04f2..5d375f40 100644
--- a/Week 1.3 - JavaScript/5. DOM Manipulation/index.html	
+++ b/Week 1.3 - JavaScript/5. DOM Manipulation/index.html	
@@ -24,6 +24,11 @@ <h2>More Jeff Goldblum</h2>
 
 	<script>
 		// Add you code here
+        const container = document.querySelector(".container");
+		const newSection = document.querySelector("script[type='text/template']").innerHTML;
+
+		container.insertAdjacentHTML("beforeend", newSection);
+
 	</script>
 
 </body>
diff --git a/Week 1.3 - JavaScript/Data Fetching/index.html b/Week 1.3 - JavaScript/Data Fetching/index.html
index c1da8137..7f3e947b 100644
--- a/Week 1.3 - JavaScript/Data Fetching/index.html	
+++ b/Week 1.3 - JavaScript/Data Fetching/index.html	
@@ -11,6 +11,33 @@
 	
 	<script>
 		// Add your code here
+
+		async function moviesList(){
+
+			try{
+
+				const response = await fetch("https://ghibliapi.vercel.app/films");
+
+				const movies = await response.json();
+
+				const list = document.querySelector(".movies");
+
+				movies.forEach(element => {
+					const li = document.createElement("li");
+					li.textContent = element.title;
+					list.appendChild(li);
+				});
+
+			}
+			catch (err){
+                 
+				console.error("Error:", err);
+
+			}
+		}
+     
+	moviesList();	
+
 	</script>
 
 </body>

From ffe792f590a0124ebbb1a99fa97768e21e2a3845 Mon Sep 17 00:00:00 2001
From: vijayvemul14 <vijayvemul14@gmail.com>
Date: Wed, 3 Sep 2025 14:18:20 +0530
Subject: [PATCH 4/5] CSS Grid Assessments

---
 .../1. Responsive Grids/index.html               |  2 ++
 Week 2.1 - CSS Grid/2. Placing Items/index.html  |  6 ++++++
 .../3. Placing Items - Advanced/index.html       | 16 ++++++++++++----
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/Week 2.1 - CSS Grid/1. Responsive Grids/index.html b/Week 2.1 - CSS Grid/1. Responsive Grids/index.html
index 2d612e63..37f684e7 100644
--- a/Week 2.1 - CSS Grid/1. Responsive Grids/index.html	
+++ b/Week 2.1 - CSS Grid/1. Responsive Grids/index.html	
@@ -29,6 +29,8 @@
 	<style>
 		.cards {
 			/* Add your code here */
+			display: grid;
+			grid-template-columns: repeat(auto-fit, min-content(280px, 1fr));
 		}
 	</style>
 	
diff --git a/Week 2.1 - CSS Grid/2. Placing Items/index.html b/Week 2.1 - CSS Grid/2. Placing Items/index.html
index fcd7781b..b4cba00d 100644
--- a/Week 2.1 - CSS Grid/2. Placing Items/index.html	
+++ b/Week 2.1 - CSS Grid/2. Placing Items/index.html	
@@ -19,6 +19,12 @@
 
 	<style>
 		/* Add your code here */
+		.channel{
+			grid-area: stack;
+			width: 100%;
+			height: 100%;
+			object-fit: cover;
+		}
 	</style>
 
 	<div class="photo">
diff --git a/Week 2.1 - CSS Grid/3. Placing Items - Advanced/index.html b/Week 2.1 - CSS Grid/3. Placing Items - Advanced/index.html
index 0161e9be..bd3d2351 100644
--- a/Week 2.1 - CSS Grid/3. Placing Items - Advanced/index.html	
+++ b/Week 2.1 - CSS Grid/3. Placing Items - Advanced/index.html	
@@ -39,16 +39,24 @@
 			background-color: lightcoral;
 		}
 
-		.placeholder {
-			border-color: mediumslateblue;
-			background-color: lightcyan;
-		}
+		
 	</style>
 </head>
 <body>
 	
 	<style>
 		/* Add your code here */
+		.letter:nth-child(1) { grid-column: 1; grid-row:2; }
+		.letter:nth-child(2) { grid-column: 2; grid-row:3; }
+		.letter:nth-child(3) { grid-column: 3; grid-row:4; }
+		.letter:nth-child(4) { grid-column: 4; grid-row:5; }
+		.letter:nth-child(5) { grid-column: 5; grid-row:6; }
+		.letter:nth-child(6) { grid-column: 6; grid-row:7; }
+
+		.letter{
+			position: sticky;
+			top:0;
+		}
 	</style>
 
 	<div class="grid">

From 7490518111c0fb360e287e8911b1ed1791653521 Mon Sep 17 00:00:00 2001
From: vijayvemul14 <vijayvemul14@gmail.com>
Date: Wed, 3 Sep 2025 22:13:46 +0530
Subject: [PATCH 5/5] Flexbox Assessments

---
 Week 2.2 - Flexbox/1. Centering/index.html         |  3 +++
 Week 2.2 - Flexbox/2. Placing Items/index.html     |  6 +++++-
 .../3. Placing Items - Advanced/index.html         | 14 ++++++++++++++
 Week 2.2 - Flexbox/4. Flexing/index.html           | 11 +++++++++++
 4 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/Week 2.2 - Flexbox/1. Centering/index.html b/Week 2.2 - Flexbox/1. Centering/index.html
index 5283be49..372815b9 100644
--- a/Week 2.2 - Flexbox/1. Centering/index.html	
+++ b/Week 2.2 - Flexbox/1. Centering/index.html	
@@ -25,6 +25,9 @@
 			background-color: whitesmoke;
 			
 			/* Add to your code here to center the box within the container */
+			display:flex;
+            justify-content:center;
+            align-items:center;
 		}
 	</style>
 	
diff --git a/Week 2.2 - Flexbox/2. Placing Items/index.html b/Week 2.2 - Flexbox/2. Placing Items/index.html
index 986e0ee4..2f0985ea 100644
--- a/Week 2.2 - Flexbox/2. Placing Items/index.html	
+++ b/Week 2.2 - Flexbox/2. Placing Items/index.html	
@@ -25,9 +25,13 @@
 			/*
 				Add to your code here to place the `.logo` and `.links` on either
 				side end of the `.navbar`.
-
+             
 				The `.logo` and `.links` should also be center aligned with each other.
 			*/
+            display: flex;
+			justify-content: space-between;
+			align-items: center;
+
 		}
 	</style>
 	
diff --git a/Week 2.2 - Flexbox/3. Placing Items - Advanced/index.html b/Week 2.2 - Flexbox/3. Placing Items - Advanced/index.html
index 9ff4f7e7..c00daa4a 100644
--- a/Week 2.2 - Flexbox/3. Placing Items - Advanced/index.html	
+++ b/Week 2.2 - Flexbox/3. Placing Items - Advanced/index.html	
@@ -25,6 +25,20 @@
 
 	<style>
 		/* Add your code here to position the "read more" links to the bottom of their respective cards */
+
+		.card {
+          
+          display:flex;
+          flex-direction:column;
+          align-items:flex-start;
+          
+        }
+        
+        .card a {
+           margin-top:auto;
+        }
+        
+		
 	</style>
 	
 	<section class="cards">
diff --git a/Week 2.2 - Flexbox/4. Flexing/index.html b/Week 2.2 - Flexbox/4. Flexing/index.html
index 443de97c..12b5e385 100644
--- a/Week 2.2 - Flexbox/4. Flexing/index.html	
+++ b/Week 2.2 - Flexbox/4. Flexing/index.html	
@@ -40,14 +40,25 @@
 	<style>
 		form {
 			/* Add any needed code here */
+
+			display: flex;
+			flex-wrap: wrap;
+			margin: auto 40px;
 		}
 		
 		form input {
 			/* All inputs should allowed to grow and shrink with a basis of 10ch */
+
+			flex-grow: 10;
+			flex-shrink: 10;
 		}
 
 		form [type="email"] {
 			/* This should grow 3 times faster than the other inputs with a basis of 30ch */
+
+			flex-grow: 30;
+			flex-shrink: 30;
+
 		}
 	</style>
 
