Added containers and classes to host section. Restyled vans list items

src/index.css

@@ -351,6 +351,8 @@ img {
         gap: 2rem;
         padding: 2rem 2.5rem;
         box-shadow: var(--shadow);
+        background-color: var(--content-bg);
+        color: var(--fg);
       }
 
       & p {
@@ -359,7 +361,11 @@ img {
 
       & svg {
         margin-inline-start: auto;
-        font-size: 3rem;
+        font-size: 3.5rem;
+        fill: var(--btn-blue);
+        background-color: white;
+        border: 0.3rem solid white;
+        border-radius: 50%;
       }
     }
   }
@@ -403,6 +409,11 @@ img {
   }
 }
 
+/** Hosts */
+.hosts-nav {
+  margin-bottom: 3rem;
+}
+
 /* Screenreader only */
 .visually-hidden {
   position: absolute;

src/layout/LayoutHost.jsx

@@ -3,7 +3,7 @@ import { NavLink, Outlet } from "react-router-dom"
 function LayoutHost() {
   return (
     <>
-      <nav className="site-navigation">
+      <nav className="site-navigation hosts-nav">
         <ul>
           <li>
             <NavLink

src/pages/host/Dashboard.jsx

@@ -1,5 +1,9 @@
 function Dashboard() {
-  return <h1>Dashboard Updated</h1>
+  return (
+    <div className="hosts-container  content-container hosts-dashboard">
+      <h1>Dashboard Updated</h1>
+    </div>
+  )
 }
 
 export default Dashboard

src/pages/host/HostVanDetail.jsx

@@ -1,5 +1,9 @@
 function HostVanDetail() {
-  return <h1>Your Listed Van Details</h1>
+  return (
+    <div className="hosts-container  content-container host-van-detail">
+      <h1>Your Listed Van Details</h1>
+    </div>
+  )
 }
 
 export default HostVanDetail

src/pages/host/HostVans.jsx

@@ -1,5 +1,9 @@
 function HostVans() {
-  return <h1>Your Listed Vans</h1>
+  return (
+    <div className="hosts-container  content-container host-vans">
+      <h1>Your Listed Vans</h1>
+    </div>
+  )
 }
 
 export default HostVans

src/pages/host/Income.jsx

@@ -1,5 +1,9 @@
 function Income() {
-  return <h1>Income</h1>
+  return (
+    <div className="hosts-container  content-container hosts-income">
+      <h1>Income</h1>
+    </div>
+  )
 }
 
 export default Income

src/pages/host/Reviews.jsx

@@ -1,5 +1,9 @@
 function Reviews() {
-  return <h1>Reviews</h1>
+  return (
+    <div className="hosts-container  content-container hosts-reviews">
+      <h1>Reviews</h1>
+    </div>
+  )
 }
 
 export default Reviews