D-Net

<div class="image-front-topbar uk-section-muted uk-section-overlap uk-light" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-slide-top&quot;,&quot;delay&quot;:false}" tm-header-transparent="light" tm-header-transparent-placeholder="">

  <div style="  background-color: #1e3040;" class=" mainPageSearchForm uk-background-norepeat uk-background-cover uk-background-top-center uk-background-fixed uk-section uk-section-large uk-padding-remove-bottom">

     <div class="tm-header-placeholder uk-margin-remove-adjacent" style="height: 84px;"></div>

     <div class="uk-grid-collapse uk-flex-middle uk-margin-remove-vertical uk-grid uk-grid-stack" uk-grid="">

        <div class="uk-width-1-1@m uk-first-column">

           <h5 class="uk-margin-large uk-text-center uk-h1 uk-scrollspy-inview uk-animation-slide-top" uk-scrollspy-class="" style="">

              Research Community Dashboard

           </h5>

           <h1 class="uk-text-center uk-h2 uk-scrollspy-inview uk-animation-slide-top" uk-scrollspy-class="" style="">

              Your view to open science

           </h1>

        </div>

     </div>

  </div>

</div>

  <div *ngIf= "communitiesResults != null && communitiesResults.length > 0">

    <div class="uk-container uk-margin-top uk-margin-bottom">

      <!--h2>Research Initiatives </h2-->

      <div class="uk-child-width-1-3@m uk-text-center uk-grid-match " uk-grid >

        <ng-container *ngFor="let item of communitiesResults; let i = index">

            <div *ngIf="showCommunity(item) && item.type=='ri'" class="uk-card uk-card-default uk-margin-bottom">

              <span >

                <div class="uk-card-media-top">

                    <img *ngIf= "item.logoUrl != null && item.logoUrl != '' " src="{{item.logoUrl}}" alt="{{(item.title)?item.title:item.shortTitle}} logo"  class="uk-height-small uk-responsive-height ">

                     <span  *ngIf= "item.logoUrl == null || item.logoUrl == '' "  class="uk-icon   uk-margin-top">

                       <svg width="50" height="50" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="2.5"> <circle fill="none" stroke="#000" stroke-width="1.1" cx="7.7" cy="8.6" r="3.5"></circle> <path fill="none" stroke="#000" stroke-width="1.1" d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3"></path> <path fill="none" stroke="#000" stroke-width="1.1" d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"></path></svg>

                    </span>

                </div>

              </span>

              <div class="uk-card-body">

                <div>

                  <div *ngIf="item.status !='all'" class="uk-float-right" uk-tooltip="title: Community is hidden to registered users. It is visible only to users that have privileges to  manage community; delay: 100">

                    <span class="private-view-label uk-label uk-label-success " aria-expanded="false">Private view</span>

                  </div>

                  <div *ngIf="item.type =='ri'" class="" >

                    <span class="ri-label uk-label uk-label-info " aria-expanded="false">Research Initiative</span>

                  </div>

                  <div *ngIf="item.type !='ri'" class="" >

                    <span class="uk-label rc-label  uk-label-warning " aria-expanded="false">Research Community</span>

                  </div>

                   <h3 class="uk-card-title">

                    <a *ngIf="!isProduction()" [queryParams]="{communityId: item.communityId}" routerLinkActive="router-link-active" routerLink="/" target="_blank">

                    {{(item.title)?item.title:item.shortTitle}}</a>

                    <a *ngIf="isProduction()" href="{{'https://'+getProductionPrefix()+item.communityId+'.openaire.eu'}}" target="_blank">

                    {{(item.title)?item.title:item.shortTitle}}</a>

                  </h3>

                </div>

                  <p *ngIf="item.description != null" >{{item.description}}</p>

                  <subscribe [communityId]="item.communityId"></subscribe>

                  <manage [communityId]="item.communityId"></manage>

              </div>

            </div>

        </ng-container>

      </div>

      <hr>

      <!--h2>Research communities </h2-->

      <div class="uk-child-width-1-3@m uk-text-center uk-grid-match " uk-grid >

        <ng-container *ngFor="let item of communitiesResults; let i = index">

            <div *ngIf="showCommunity(item) && item.type!='ri'" class="uk-card uk-card-default uk-margin-bottom">

              <span >

                <div class="uk-card-media-top">

                    <img *ngIf= "item.logoUrl != null && item.logoUrl != '' " src="{{item.logoUrl}}" alt="{{(item.title)?item.title:item.shortTitle}} logo"  class="uk-height-small uk-responsive-height ">

                     <span  *ngIf= "item.logoUrl == null || item.logoUrl == '' "  class="uk-icon   uk-margin-top">

                       <svg width="50" height="50" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="2.5"> <circle fill="none" stroke="#000" stroke-width="1.1" cx="7.7" cy="8.6" r="3.5"></circle> <path fill="none" stroke="#000" stroke-width="1.1" d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3"></path> <path fill="none" stroke="#000" stroke-width="1.1" d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"></path></svg>

                    </span>

                </div>

              </span>

              <div class="uk-card-body">

                <div>

                  <div *ngIf="item.status !='all'" class="uk-float-right" uk-tooltip="title: Community is hidden to registered users. It is visible only to users that have privileges to  manage community; delay: 100">

                    <span class="private-view-label uk-label uk-label-success " aria-expanded="false">Private view</span>

                  </div>

                  <div *ngIf="item.type =='ri'" class="" >

                    <span class="ri-label uk-label uk-label-info " aria-expanded="false">Research Initiative</span>

                  </div>

                  <div *ngIf="item.type !='ri'" class="" >

                    <span class="uk-label rc-label  uk-label-warning " aria-expanded="false">Research Community</span>

                  </div>

                   <h3 class="uk-card-title">

                    <a *ngIf="!isProduction()" [queryParams]="{communityId: item.communityId}" routerLinkActive="router-link-active" routerLink="/" target="_blank">

                    {{(item.title)?item.title:item.shortTitle}}</a>

                    <a *ngIf="isProduction()" href="{{'https://'+getProductionPrefix()+item.communityId+'.openaire.eu'}}" target="_blank">

                    {{(item.title)?item.title:item.shortTitle}}</a>

                  </h3>

                </div>

                  <p *ngIf="item.description != null" >{{item.description}}</p>

                  <subscribe [communityId]="item.communityId"></subscribe>

                  <manage [communityId]="item.communityId"></manage>

              </div>

            </div>

        </ng-container>

      </div>

    </div>

</div>