File

app/sitesearch/all-tab/keymatch-document/keymatch-document.component.ts

Implements

OnInit

Metadata

selector keymatch-document
styleUrls keymatch-document.component.scss
templateUrl keymatch-document.component.html

Index

Methods
Inputs

Constructor

constructor()

Inputs

keymatch

Alternative documents include 'final variant', 'obsolete products' etc.

Methods

ngOnInit
ngOnInit()
Returns : void
import { Component, OnInit, Input } from '@angular/core';

@Component ({
	selector: 'keymatch-document',
	templateUrl: 'keymatch-document.component.html',
	styleUrls: ['keymatch-document.component.scss']
})
export class KeymatchDocumentComponent implements OnInit {
	/** Alternative documents include 'final variant', 'obsolete products' etc. */

	@Input() keymatch;

	constructor(
		) {}

	ngOnInit() {
	}
}
<div class="keymatch-document">
    <div class="info">
        <i class="fas fa-info-circle" aria-hidden="true"></i>
    </div>
    <div>
        <a href="{{keymatch.url}}" class="title">
            <span>{{ keymatch.title }}</span>
        </a>
        <div class="desc">
            {{ keymatch.text }}
        </div>        
    </div>

</div>

keymatch-document.component.scss

@import "src/app/styles/helpers";

.keymatch-document {
    display: flex;
    flex-direction: row;
    margin-bottom: 30px;

    @media(max-width: 575px) {
        .title { @include font-size(15); }
        .desc { @include font-size(13); }
    }

    @media(min-width: 576px) {
        .title { @include font-size(17); }
        .desc { @include font-size(15); }
    }

    .info {
        display: flex;
        align-items: center;
        margin-right: 10px;
        @include font-size(20);
        color: $blue;
    }

    .title {
        text-decoration: none;
        font-weight: 600;
    }

    .desc {
    }
}
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""