explore-services/explore/src/app/fos/fos.component.html

60 lines
2.7 KiB
HTML

<!-- <schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other" [description]="description"></schema2jsonld> -->
<div class="uk-container uk-container-large uk-section uk-section-small uk-padding-remove-bottom">
<div class="uk-padding-small">
<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
</div>
</div>
<div class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
<div class="uk-grid uk-grid-large uk-grid-stack uk-padding-small" uk-grid>
<div class="uk-width-3-5@m uk-width-1-1@s uk-flex uk-flex-column uk-flex-center">
<h1 uk-scrollspy-class>Fields of Science and Technology<span class="uk-text-primary">.</span></h1>
<div uk-scrollspy-class>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</div>
<div>
<a class="uk-display-inline-block uk-text-uppercase uk-button-text uk-margin-top" uk-scrollspy-class
routerLinkActive="router-link-active" routerLink="/">
<span class="uk-flex uk-flex-middle">
<span>Learn More</span>
</span>
</a>
</div>
</div>
<div class="uk-width-2-5@m uk-width-1-1@s uk-text-center">
<img src="" loading="lazy">
</div>
</div>
</div>
<div class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
<div class="uk-grid uk-flex uk-flex-middle uk-flex-center uk-padding-small" uk-grid>
<div>
<input type="text" class="uk-input" style="width: 500px;">
</div>
</div>
<div class="uk-margin-large-top uk-padding-small">
<div class="uk-grid uk-grid-large" uk-grid>
<div class="uk-width-1-4">
<div *ngFor="let item of fos; index as i" class="uk-margin-bottom">
<a class="uk-text-capitalize" (click)="changeDisplayedFos(i)">
{{item.id}}
</a>
</div>
</div>
<div *ngIf="fos[index]" class="uk-width-3-4">
<div class="uk-text-capitalize">
<h2 class="uk-margin-remove-top">{{fos[index].id}}</h2>
</div>
<div class="uk-grid uk-child-width-1-3 uk-margin-large-top uk-margin-large-bottom" uk-grid="masonry: true">
<div *ngFor="let child of fos[index].children">
<div class="whole-child uk-text-capitalize">
<h3 class="uk-h6">{{child.id}}</h3>
<div *ngFor="let subChild of child.children" class="uk-margin-small-bottom">
{{subChild.id}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>