Add icons for related types improvements (#11)

MichelGabriel · Aug 30, 2023 · 935abe6 · 935abe6
1 parent 2973391
commit 935abe6
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 58 deletions.
diff --git a/web-ui/src/main/resources/catalog/components/metadataactions/partials/related.html b/web-ui/src/main/resources/catalog/components/metadataactions/partials/related.html
@@ -232,23 +232,29 @@ <h3 data-ng-if="groupSiblingsByType && items.length > 0">
             'gn-card-dataset': type !== 'parent' && type !== 'services' && type !== 'application' && type !== 'nonGeographicDataset'
             }"
         >
-          <i
-            class="fa fa-fw {{icon}} gn-icon-association-{{md.properties.associationType}} gn-icon-initiative-{{md.properties.initiativeType}}"
-          />
-          <span class="gn-truncate">
-            <span data-ng-hide="md.properties && !md.properties.associationType">
+          <span>
+            <span data-ng-if="!md.properties || (md.properties && md.properties.associationType == '')">
               {{(config.getLabel(mainType, type)) | translate}}</span
             >
             <span
-              class="gn-card-badge-sublabel"
+              data-ng-if="md.properties && md.properties.associationType"
               data-ng-show="md.properties && md.properties.associationType"
               title="{{(config.getLabel(mainType, type)) | translate}}"
-            >
-              <b translate>associationType</b><br />
-              {{md.properties.associationType | translate}}
+            > {{'associatedTo' | translate}}
+              <b title="{{'associationType' | translate}}">
+                <i
+                  class="fa fa-fw {{icon}} gn-icon-association-{{md.properties.associationType}}"
+                />
+                {{md.properties.associationType | translate}}
+              </b>
               <span data-ng-if="md.properties && md.properties.initiativeType">
-                <br /><b translate>initiativeType</b><br />
-                {{md.properties.initiativeType | translate}}
+                >
+                <b title="{{'initiativeType' | translate}}">
+                  <i
+                    class="fa fa-fw {{icon}} gn-icon-initiative-{{md.properties.initiativeType}}"
+                  />
+                  {{md.properties.initiativeType | translate}}
+                </b>
               </span>
             </span>
           </span>

diff --git a/web-ui/src/main/resources/catalog/locales/en-v4.json b/web-ui/src/main/resources/catalog/locales/en-v4.json
@@ -402,6 +402,7 @@
   "text/xml; subtype=gml/3.1.1": "GML 3.1.1",
   "text/xml; subtype=gml/3.2": "GML 3.2",
   "lastCreatedRecords": "Last created records",
-  "associationType": "Association type:",
-  "initiativeType": "Initiative type:"
+  "associationType": "Association type",
+  "initiativeType": "Initiative type",
+  "associatedTo": "Associated "
 }
diff --git a/web-ui/src/main/resources/catalog/views/default/less/gn_result_default.less b/web-ui/src/main/resources/catalog/views/default/less/gn_result_default.less
@@ -115,51 +115,6 @@
     width: 100%;
     text-align: left;
     border-radius: 0;
-    &:before {
-      content: "\f077";
-      font-family: FontAwesome;
-      font-style: normal;
-      font-weight: normal;
-      text-decoration: inherit;
-      color: @gray-light;
-      font-size: 14px;
-      padding-top: 4px;
-      text-align: center;
-      background-color: @gray-lighter;
-      width: 30px;
-      height: 30px;
-      border-radius: 15px;
-      position: absolute;
-      display: block;
-      top: -15px;
-      left: calc(~"50% - 15px");
-    }
-    &:hover::before {
-      rotate: 180deg;
-      transition: rotate 0.35s;
-    }
-    .gn-truncate {
-      cursor: pointer;
-      width: calc(~"100% - 10px - 1.25em - 1.25em");
-      text-overflow: ellipsis;
-      overflow: hidden;
-      white-space: nowrap;
-      display: inline-block;
-      vertical-align: middle;
-      .gn-card-badge-sublabel {
-        display: none;
-      }
-    }
-    &:hover {
-      .gn-truncate {
-        white-space: normal;
-        line-height: 1.4em;
-        text-overflow: unset;
-        .gn-card-badge-sublabel {
-          display: inline-block;
-        }
-      }
-    }
   }
   .btn-block + .btn-block {
     margin-top: 0;