50 lines
2.5 KiB
HTML
50 lines
2.5 KiB
HTML
<a *ngIf="directLink && community" [href]="getCommunityPageUrl()" target="_blank"
|
|
class="uk-height-1-1 uk-link-reset">
|
|
<ng-container [ngTemplateOutlet]="card"></ng-container>
|
|
</a>
|
|
<a *ngIf="!directLink && community" (click)="confirmModalOpen()"
|
|
class="uk-height-1-1 uk-link-reset">
|
|
<ng-container [ngTemplateOutlet]="card"></ng-container>
|
|
</a>
|
|
<ng-template #card>
|
|
<div class="uk-padding">
|
|
<div *ngIf="community.isSubscribed"
|
|
class="uk-text-background uk-text-small uk-position-top-left uk-padding-small uk-text-uppercase uk-text-bold">
|
|
Member
|
|
</div>
|
|
<div *ngIf="community.isRestricted()"
|
|
class="uk-position-top-right uk-margin-small-top uk-margin-small-right uk-flex uk-flex-column uk-flex-middle">
|
|
<icon [name]="visibilityIcon.get('RESTRICTED')" ratio="1.2" [flex]="true"></icon>
|
|
<span class="uk-text-small uk-text-capitalize">restricted</span>
|
|
</div>
|
|
<div *ngIf="community.isPrivate()"
|
|
class="uk-position-top-right uk-margin-small-top uk-margin-small-right uk-flex uk-flex-column uk-flex-middle">
|
|
<icon [name]="visibilityIcon.get('PRIVATE')" ratio="1.2" [flex]="true"></icon>
|
|
<span class="uk-text-small uk-text-capitalize">private</span>
|
|
</div>
|
|
<div class="uk-card-media-top uk-flex uk-flex-center uk-flex-middle uk-height-xsmall
|
|
uk-padding-small uk-padding-remove-vertical uk-margin-top uk-margin-bottom">
|
|
<div>
|
|
<img *ngIf="community.logoUrl != null && community.logoUrl != ''" src="{{community | logoUrl}}"
|
|
alt="{{(community.title)?community.title:community.shortTitle}} logo" class="uk-height-max-xsmall">
|
|
</div>
|
|
</div>
|
|
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
|
<h3 class="uk-text-center uk-h6 uk-link" [ngClass]="(showDescription)?'uk-margin-small-bottom':''">
|
|
<span *ngIf="community.title">
|
|
{{community.title.slice(0, thresholdTitle)}}
|
|
<span *ngIf="community.title.length > thresholdTitle">...</span>
|
|
</span>
|
|
<span *ngIf="!community.title && community.shortTitle">
|
|
{{community.shortTitle.slice(0, thresholdTitle)}}
|
|
<span *ngIf="community.shortTitle.length > thresholdTitle">...</span>
|
|
</span>
|
|
</h3>
|
|
<div class="uk-text-center" *ngIf="community.description != null && showDescription">
|
|
<span>{{_formatDescription(community.description)}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|
|
<modal-alert #alertModal [overflowBody]="false" (alertOutput)="goToCommunityPage($event)"></modal-alert>
|