Agent Communities Changes (#266)

* Agent Communities Changes * path changed --------- Co-authored-by: piyushjindal <[email protected]>
hlxsites · Aug 13, 2024 · 3f08cb9 · 3f08cb9
1 parent 5f01134
commit 3f08cb9
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 13 deletions.
diff --git a/blocks/agent-communities/agent-communities.css b/blocks/agent-communities/agent-communities.css
@@ -1,5 +1,7 @@
+@import url('./design-1.css');
+
 .agent-communities.block {
-  height: 1000px;
+  min-height: 1000px;
 }
 
 .agent-communities.block .cards-list {
@@ -36,6 +38,16 @@
   background: linear-gradient(transparent, transparent, rgba(0 0 0 / 50%));
 }
 
+.agent-communities.block .cards-list .cards-item-body h4:hover {
+  background: unset;
+}
+
+.agent-communities.block .cards-list .cards-item-body h4::before {
+  font-size: var(--heading-font-size-m);
+  font-weight: var(--font-weight-bold);
+  content: 'Explore ';
+}
+
 .agent-communities.block .cards-list .cards-item:first-of-type h4 {
   color: var(--primary-color);
   background: unset;
@@ -52,7 +64,6 @@
   width: 100%;
   height: fit-content;
   object-fit: cover;
-  filter: brightness(0.8);
   margin-bottom: 10px;
   background-position: center 70%;
   background-size: cover;
@@ -67,12 +78,19 @@
   padding: .5rem .75rem;
   text-decoration: none;
   font-size: var(--body-font-size-xs);
+  font-weight: var(--font-weight-bold);
+}
+
+.agent-communities.block .hero-item-explore:hover {
+  color: var(--primary-light);
+  background-color: var(--primary-color);
 }
 
 .agent-communities.block .hero-item-heading {
   text-transform: uppercase;
   font-size: var(--body-font-size-s);
   letter-spacing: 3.2px;
+  font-weight: var(--font-weight-bold);
 }
 
 .agent-communities.block .hero-item-bio {

diff --git a/blocks/agent-communities/agent-communities.js b/blocks/agent-communities/agent-communities.js
@@ -11,8 +11,7 @@ export default async function decorate(block) {
   block.appendChild(getLoader('agent-communities'));
 
   window.setTimeout(async () => {
-    // const url = `/commonwealth-real-estate-ma312${window.location.pathname}`;
-    const url = '/commonwealth-real-estate-ma312/east-greenwich/barry-alofsin/cid-473521';
+    const url = `/commonwealth-real-estate-ma312${window.location.pathname}`;
     const bhhsCode = 'bhhs-ma312';
 
     const finalUrl = new URL('https://api.liveby.com/v1/pages');
@@ -54,17 +53,20 @@ export default async function decorate(block) {
 
       if (data2.length) {
         modifiedData.push(...data2.map((item) => {
-          const regex = /\/communities\/\w+$/;
+          const regex = /\/communities/;
           const match = item.url.match(regex);
           const link = match ? match[0] : '';
 
-          return {
-            name: item.name.toUpperCase(),
-            exploreName: `explore ${item.name}`,
-            link,
-            banner: item.banner_16x9,
-          };
-        }));
+          if (link) {
+            return {
+              name: item.name.toUpperCase(),
+              exploreName: `${item.name}`,
+              link,
+              banner: item.banner_16x9,
+            };
+          }
+          return null;
+        }).filter((item) => item !== undefined && item !== null));
       }
 
       const cardsList = div({ class: 'cards-list' });
@@ -96,7 +98,9 @@ export default async function decorate(block) {
         cardBody.appendChild(paragraphElement);
       });
 
-      block.appendChild(cardsList);
+      if (cardsList.hasChildNodes()) {
+        block.appendChild(cardsList);
+      }
     } catch (error) {
       // eslint-disable-next-line no-console
       console.error('Error fetching data', error);

diff --git a/blocks/agent-communities/design-1.css b/blocks/agent-communities/design-1.css
@@ -0,0 +1,34 @@
+.design-1 .agent-communities.block .cards-list .cards-item-body h4 {
+  font-family: var(--font-family-secondary);
+  font-size: 2rem;
+  text-transform: none;
+  padding-top: 3rem;
+}
+
+.design-1 .agent-communities.block .cards-list .cards-item-body h4::before {
+  font-size: 1rem;
+  line-height: var(--line-height-m);
+  letter-spacing: var(--letter-spacing-l);
+  display: block;
+  text-align: center;
+  margin-bottom: 0.5rem;
+}
+
+/*
+Theme: Black & White
+*/
+.design-1.black-white .agent-communities.block .hero-item-explore {
+  color: var(--black);
+  border: solid 1px var(--black);
+}
+
+.design-1.black-white .agent-communities.block .hero-item-explore:hover {
+  color: var(--white);
+  background-color: var(--black);
+}
+
+.design-1.black-white .agent-communities.block .cards-list .cards-item:first-of-type h4 {
+  color: var(--black);
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}