patch: profile-edit + profile - rework on addresses

src/locales/en.json

@@ -174,8 +174,8 @@
       "labelPicture1": "Picture 1",
       "labelPicture2": "Picture 2",
       "labelPicture3": "Picture 3",
-      "labelAddressLine1": "Address Line 1",
+      "labelAddressLine1": "New address line 1",
-      "labelAddressLine2": "Address Line 2",
+      "labelAddressLine2": "New address line 2",
       "labelLogo": "Community Logo",
       "subTitle": "Pictures",
       "subTitle1": "Address",

src/locales/es.json

@@ -174,8 +174,8 @@
       "labelPicture1": "Foto 1",
       "labelPicture2": "Foto 2",
       "labelPicture3": "Foto 3",
-      "labelAddressLine1": "Línea de dirección 1",
+      "labelAddressLine1": "Nueva línea de dirección 1",
-      "labelAddressLine2": "Línea de dirección 2",
+      "labelAddressLine2": "Nueva línea de dirección 2",
       "labelLogo": "Logotipo comunitario",
       "subTitle": "Foto",
       "subTitle1": "Dirección",

src/locales/fr.json

@@ -172,8 +172,8 @@
       "labelPicture1": "Photo 1",
       "labelPicture2": "Photo 2",
       "labelPicture3": "Photo 3",
-      "labelAddressLine1": "Adresse ligne 1",
+      "labelAddressLine1": "Nouvelle adresse ligne 1",
-      "labelAddressLine2": "Adresse ligne 2",
+      "labelAddressLine2": "Nouvelle adresse ligne 2",
       "labelLogo": "Logo de la communauté",
       "subTitle": "Photos",
       "subTitle1": "Adresse",

src/styles/admin-circles/_index.scss

@@ -125,16 +125,19 @@
 
   .community-profile solid-multiple {
 
-    &::before {
+    [name="address_line1"]::before {
       font-family: 'material-design-icons';
       content: "\F34E";
       position: relative;
       top: 2px;
+      color: var(--color-third);
+      font-size: 20px;
+      margin-right: 10px;
     }
   
     [name="address_line2"] {
       display: block;
-      margin-left: 33px;
+      margin-left: 30px;
     }
   }
 
@@ -225,9 +228,7 @@
         position: relative;
 
         button {
-          position: absolute;
+          margin-top: 10px;
-          top: 86px;
-          right: 0;
           color: #636363;
           font-weight: bold;
           line-height: 19px;
@@ -241,6 +242,27 @@
     }
   }
 
+  .edit-address {
+
+    form {
+      display: table-row;
+    }
+
+    .segment.table-cell {
+      display: table-cell;
+      border-bottom: 1px solid #C9C8C8;
+      border-right: 1px solid #C9C8C8;
+      height: 60px;
+      padding: 10px;
+      vertical-align: middle;
+      width: 250px;
+    }
+
+    input[type='submit'] {
+      display: none;
+    }
+  }
+
   @media (max-width: 768px) {
 
     .tabs {

src/views/partials/communities/page-community-edit.pug

@@ -35,11 +35,11 @@ div.bg-color-white
         label-profile.linkedin=""
         label-profile.instagram=""
 
-        class-profile.shortDescription="segment margin-bottom-medium full sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
+        class-profile.shortDescription="segment margin-bottom-medium full text-small text-semibold text-uppercase text-color-heading"
-        class-profile.description="segment margin-bottom-medium full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
+        class-profile.description="segment margin-bottom-medium full text-small text-semibold text-uppercase text-color-heading"
 
         class-segment="segment full"
-        class-logo="edit-img edit-logo segment margin-bottom-medium full sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
+        class-logo="edit-img edit-logo segment margin-bottom-medium full sm-padding-none text-small text-semibold text-uppercase text-color-heading"
         class-profile.website="segment margin-bottom-medium third sm-full padding-right-small sm-padding-none"
         class-profile.email="segment margin-bottom-medium third sm-full padding-right-small padding-left-small sm-padding-none"
         class-profile.phone="segment margin-bottom-medium third sm-full padding-left-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
@@ -93,27 +93,15 @@ div.bg-color-white
 
       h3.segment.full.padding-bottom-small.border-bottom.border-color-grey.text-color-heading.text-bold.text-letter-spacing-large(data-trans="communities.edit.subTitle1")
 
-      solid-form.form(
+      solid-widget(name=`hubl-communities-edit-delete-button`)
-        bind-resources
+        template
-        nested-field="addresses"
+          solid-delete(
-        fields="address_line1, address_line2"
+            class='segment text-xsmall children-link-button children-link-text-bold children-link-text-uppercase children-link-color-secondary bordered'
-
+            data-src="${src}"
-        label-address_line1=""
+            data-label=''
-        label-address_line2=""
+            data-trans=''
-
+          )
-        class-address_line1="segment half sm-full sm-margin-bottom-xsmall padding-right-small text-small text-semibold text-uppercase text-color-heading"
+      
-        class-address_line2="segment half sm-full sm-margin-bottom-xsmall padding-left-small text-small text-semibold text-uppercase text-color-heading"
-
-        widget-community="solid-form-hidden"
-        widget-address_line1="solid-form-label-text"
-        widget-address_line2="solid-form-label-text"
-
-        submit-button=""
-        submit-widget="button"
-
-        data-trans="label-address_line1=communities.edit.labelAddressLine1;label-address_line2=communities.edit.labelAddressLine2"     
-      )
-
       .segment.table-wrapper.margin-top-medium
         .table
           div.table-header.bg-color-third.text-color-heading
@@ -142,5 +130,30 @@ div.bg-color-white
             widget-remove='hubl-circle-edit-members-delete'
           )
 
+          solid-form.form.table-body.edit-address(
+            bind-resources
+            nested-field="addresses"
+            fields="segment1(address_line1), segment2(address_line2), segment3(deleteButton)"
+
+            placeholder-address_line1=""
+            placeholder-address_line2=""
+
+            class-segment1='segment table-cell third'
+            class-segment2='segment table-cell third'
+            class-segment3='segment table-cell third text-center'
+
+            class-address_line1="segment full text-small"
+            class-address_line2="segment full text-small"
+
+            widget-community="solid-form-hidden"
+            widget-address_line1="solid-form-placeholder-text"
+            widget-address_line2="solid-form-placeholder-text"
+
+            action-deleteButton=""
+            widget-deleteButton=`hubl-communities-edit-delete-button`
+
+            data-trans="placeholder-address_line1=communities.edit.labelAddressLine1;placeholder-address_line2=communities.edit.labelAddressLine2"     
+          )
+
     solid-ac-checker(no-permission="acl:Write", bind-resources)
       span(data-trans="communities.edit.noPermission")

src/views/partials/communities/page-community-profile.pug

@@ -30,7 +30,7 @@ div.community-profile.padding-medium.sm-padding-none
       class-segment7="segment lg-hidden sm-full"
 
       class-segment8="segment two-third sm-full padding-bottom-large padding-bottom-xxsmall sm-text-left"
-      class-addresses="segment block margin-bottom-xsmall icon icon-third icon-large icon-margin-right-xsmall"
+      class-addresses="segment block margin-bottom-xsmall"
       class-members="segment block margin-bottom-xsmall"
       class-profile.website="segment block"
       class-profile.email="segment block"