patch: community-map

src/styles/admin-circles/_index.scss

@@ -1,5 +1,6 @@
 #admin-circles,
-#admin-circles-leave {
+#admin-circles-leave,
+.communities-directory {
 
   /* Fix on Join button in admin (circles + projects) */
   /* Styles on buttons and .children-link don't work because this input is inside too many elements. */
@@ -115,12 +116,77 @@
     }
   }
 
+  hubl-communities-profile-logo {
+    height: 155px;
+    width: 100%;
+    display: block;
+
+    div {
+      display: block;
+      width: 100%;
+      height: 100%;
+      background-position: center;
+      background-repeat: no-repeat;
+      background-size: contain;
+    }
+  }
+
   .tab.active {
     font-weight: bold;
     border-bottom: 5px solid var(--color-third);
     padding-bottom: 10px;
   }
 
+  .communities-profile-picture {
+    height: 200px;
+
+    div {
+      display: block;
+      width: 100%;
+      height: 100%;
+      background-position: center;
+      background-repeat: no-repeat;
+      background-size: contain;
+    }
+
+    .picture-empty {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      object {
+        height: 100px;
+        width: 100px;
+        object-fit: cover;
+        object-position: center;
+      }
+    }
+
+    &:nth-child(2)>.picture-empty {
+      background: #E4E9F1;
+
+      svg {
+        fill: #D0D4DA;
+      }
+    }
+
+    &:nth-child(3)>.picture-empty {
+      background: #E9F2FF;
+
+      svg {
+        fill: #D7E2F3;
+      }
+    }
+  }
+
+  .communities-profile-map .leaflet-pane.leaflet-popup-pane {
+    /*display: none;*/
+
+    .leaflet-popup-content-wrapper {
+      white-space: normal;
+    }
+  }
+
   @media (max-width: 768px) {
 
     .tabs {
@@ -143,5 +209,37 @@
         }
       }
     }
+
+    .community-profile-logo {
+      border-bottom: 1px solid #D6CECE;
+    }
+
+    hubl-communities-profile-logo {
+      height: 100px;
+    }
+
+    .communities-profile-picture {
+      height: 180px;
+
+      object {
+        height: 80px;
+        width: 80px;
+      }
+    }
+
+    .mobile-map-search-field {
+      position: fixed;
+      top: 70px;
+      z-index: 1000;
+      width: 97%;
+    }
+
+    .communities-map {
+      height: calc(100vh - 50px) !important;
+
+      .leaflet-top.leaflet-left {
+        display: none;
+      }
+    }
   }
 }

src/styles/index.scss

@@ -88,15 +88,6 @@ hubl-menu-empty+hubl-menu-empty {
   justify-content: center;
 }
 
-/* Animation on cards in #communities */
-#communities {
-
-  .segment.hover:hover {
-    box-shadow: 0 0 16px 0 rgba(46, 63, 88, 0.34);
-    bottom: 2px;
-  }
-}
-
 /* Style that already exists in the framework but strangely I can't find it in the inspector. So I duplicate it here */
 .two-lines-ellipsis {
   display: -webkit-box !important;