app/sitesearch/all-tab/other-document/other-document.component.ts
| selector | other-document |
| styleUrls | ./other-document.component.scss |
| templateUrl | ./other-document.component.html |
Methods |
Inputs |
constructor()
|
| document | |
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
import { Component, OnInit, Input} from '@angular/core';
@Component ({
selector: 'other-document',
templateUrl: './other-document.component.html',
styleUrls: ['./other-document.component.scss']
})
export class OtherDocumentComponent implements OnInit {
// This component is used in the All tab for displaying documents that do not belong to any of the categories.
// E.g Investors or Tridion pages.
@Input() document;
constructor() {}
ngOnInit() {
}
}
<div class="card" >
<div class="card-body">
<a class="card-title" [routerLink]="document.url">
<span class="card-title-text">{{ document.title }}</span>
<small class="card-title-url">{{ document.url }}</small>
</a>
<div class="card-text date">
<small class="text-muted">{{ document.doc_date_time | date: 'yyyy.MM.dd' }}</small>
</div>
<div class="card-text description" *ngIf="document.description" [innerHTML]="document.description"></div>
</div>
</div>
./other-document.component.scss
@import "src/app/styles/helpers";
.card {
border: none;
&-body {
padding-left: 0;
.date {
.text-muted {
@include font-scale(12, uppercase);
}
}
.description{
::ng-deep em {
font-weight: bold;
font-style: normal;
}
}
}
&-title {
@include font-scale(24, light);
color: $blue;
word-break: break-word;
display: flex;
flex-direction: column;
margin-bottom: calc-rem(10);
&:hover {
text-decoration: none;
.card-title-text {
text-decoration: underline;
}
}
&-url {
@include font-size(14);
}
}
&-text {
margin-bottom: 0;
}
}