Agency

css/components/page/agency.css

@@ -0,0 +1,40 @@
+.agency-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+
+    gap: 0px;
+
+    background-color: #E3F0FF;
+
+    width: 100%;
+
+    padding: 25px 0px;
+    margin-top: 50px;
+}
+.agency-head-1 {
+    font-family: Ubuntu;
+    font-size: 13px;
+    font-weight: 500;
+    margin-bottom: -5px;
+    color: #26306B;
+}
+.agency-head-2 {
+    font-family: Ubuntu;
+    font-size: 24px;
+    font-weight: 800;
+
+    color: #26306B;
+}
+.agency-logo {
+    margin: 10px 0px;
+    object-fit: cover;
+    width: 50vw;
+}
+.agency-body {
+    font-size: 11px;
+    font-weight: 400;
+    text-align: center;
+    margin: 0px 40px;
+}

css/components/page/hero.css

@@ -48,7 +48,7 @@
 }
 .hero-title {
     font-size: 14px;
-    font-weight: 200;
+    font-weight: 500;
     color: #26306B;
 }
 .hero-about-me-container {
@@ -63,7 +63,7 @@
     margin-top: 40px;
 }
 .hero-about-me-title {
-    font-size: 28px;
+    font-size: 34px;
     font-weight: 800;
     color: #26306B;
     font-family: Ubuntu;

index.html

@@ -14,6 +14,7 @@
         <link data-trunk type="text/css" href="css/components/footer.css" rel="css" />
         <link data-trunk type="text/css" href="css/components/navbar.css" rel="css" />
         <link data-trunk type="text/css" href="css/components/page/hero.css" rel="css" />
+        <link data-trunk type="text/css" href="css/components/page/agency.css" rel="css" />
         
 
         <link data-trunk href="assets/text/robots.txt" rel="copy-file"/>

src/components/page/agency.rs

@@ -3,6 +3,17 @@ use yew::prelude::*;
 #[function_component(AgencySection)]
 pub fn agency_section() -> Html {
     html! {
-        
+        <div class={"agency-container"}>
+            <div class={"agency-head-1"}>
+                {"Meet Our"}
+            </div>
+            <div class={"agency-head-2"}>
+                {"Partner"}
+            </div>
+            <img class={"agency-logo"} src={"images/remax-logo.png"} alt={"agency-logo"}/>
+            <div class="agency-body">
+                {"Lorem ipsum dolor sit amet consectetur. Laoreet pellentesque sit a est ac semper. Amet nec id luctus ipsum. Risus ullamcorper amet consequat enim. Habitasse enim volutpat nisi fringilla ac diam rhoncus. Nulla integer augue venenatis ut fames. Consectetur pharetra leo non odio senectus interdum. Sit hendrerit id facilisis lacus scelerisque. Vel posuere mattis commodo dui id diam lorem ut amet. "}
+            </div>
+        </div>
     }
 }