fixed all the spelling mistakes

Author: bipinrajbhar

exercises/02.mobile-first/01.problem.structural-layout/src/App.tsx

@@ -9,7 +9,7 @@ export default function App() {
 				The first one is the full-page container. It needs to:
 				- have at minimum the full screen height (min-h-screen) 
 				- centers its children with a grid (grid place-items-center)
-				- handle horizontal and verticall padding (see Figma)
+				- handle horizontal and vertical padding (see Figma)
 		*/}
 
 			{/*

exercises/02.mobile-first/01.solution.structural-layout/src/App.tsx

@@ -11,7 +11,7 @@ export default function App() {
 					</h1>
 					<p>
 						Check the <a href="#">Getting Started</a> guide file for how to get
-						your project off the ground!
+						your prodject off the ground!
 					</p>
 				</div>
 				<ul>

exercises/02.mobile-first/02.problem.text-styles/src/App.tsx

@@ -8,7 +8,7 @@ export default function App() {
 					🐨
 						Set a max-width of 'md' on the wrapping div below.
 						Center the elements horizontally:
-					- Setup a veritcal flexbox container with 'flex flex-col'
+					- Setup a vertical flexbox container with 'flex flex-col'
 					- Align the items horizontally with 'items-center'
 					- Center the children text elements with 'text-center'
 				*/}

exercises/06.animation/02.problem.responsive-animations/src/App.tsx

@@ -27,7 +27,7 @@ export default function App() {
 				<div className="flex max-w-md flex-col items-center text-center xl:order-2 xl:items-start xl:text-left">
 					<EpicStackLogo
 						/* 
-							👩‍🔬 I've used clsx() here purely for organisation purposes.
+							👩‍🔬 I've used clsx() here purely for organistion purposes.
 							I've separated the animation classes so it's a little 
 							easier to distinguish styling concerns.
 

exercises/07.subgrid-alignment/01.problem.sub-grid/src/App.tsx

@@ -72,7 +72,7 @@ export default function App() {
 					2. Span the grid across 6 rows
 
 					💰 You can define grid-template-rows as a `subgrid` with `grid-rows-subgrid`
-					💰 You can span an element acorss multiple rows with the `row-span-*` utilities
+					💰 You can span an element across multiple rows with the `row-span-*` utilities
 				*/}
 				<ul className="flex max-w-3xl flex-wrap justify-center gap-2 sm:gap-4 xl:grid xl:grid-flow-col xl:grid-cols-5 xl:grid-rows-6">
 					{logos.map((logo, i) => (