<table aria-describedby="word clouds"  style="width: 100%;">
  <colgroup>
    <col span="1" style="width: 33%;">
    <col span="1" style="width: 33%;">
    <col span="1" style="width: 33%;">
  </colgroup>
  <thead>
    <tr>
      <th style="text-align: center" scope="col">{{'teaser.headings.keywords'|translate}}</th>
      <th style="text-align: center" scope="col">{{'teaser.headings.programmingLanguages'|translate}}</th>
      <th style="text-align: center" scope="col">{{'teaser.headings.contributors'|translate}}</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td data-th="Keywords">
        <angular-tag-cloud [data]="keywordCloudData" [config]="options" (clicked)="onKeywordClick($event)"
          [width]="options.width" [height]="options.height">
        </angular-tag-cloud>
      </td>
      <td data-th="Programming languages">
        <angular-tag-cloud [data]="programmingLanguageCloudData" [config]="options"
          (clicked)="onProgrammingLanguageClick($event)" [width]="options.width" [height]="options.height">
        </angular-tag-cloud>
      </td>
      <td data-th="Contributors">
        <angular-tag-cloud [data]="contributorCloudData" [config]="options" (clicked)="onContributorClick($event)"
          [width]="options.width" [height]="options.height">
        </angular-tag-cloud>
      </td>
    </tr>
  </tbody>
</table>
<!-- 
<div class="row" style="width: 80%;margin-left: auto; margin-right: auto;">
	<div class="col-sm-3">
	  <p style="padding-left: 30px;"><strong jhiTranslate="teaser.headings.keywords">Keywords</strong></p>
	  <ul style="list-style-type: circle;">
                <li *ngFor="let keyWord of keywords"><a (click)="clickKeyword(keyWord.target)"  style="cursor:pointer;">{{keyWord.target}} ({{keyWord.hitCount}})</a></li>
      </ul>
    </div>
	<div class="col-sm-3">
	  <p style="padding-left: 30px;"><strong jhiTranslate="teaser.headings.programmingLanguages">Programming Languages</strong></p>
	  <ul style="list-style-type: circle;">
                <li *ngFor="let programmingLanguage of programmingLanguages"><a (click)="clickLanguage(programmingLanguage.target)"  style="cursor:pointer;">{{programmingLanguage.target}} ({{programmingLanguage.hitCount}})</a></li>
      </ul>
    </div>
	<div class="col-sm-3">
	  <p style="padding-left: 30px;"><strong jhiTranslate="teaser.headings.contributors">Contributors</strong></p>
	  <ul style="list-style-type: circle;">
                <li *ngFor="let contributor of contributors"><a (click)="clickContributor(contributor.target)" style="cursor:pointer;">{{contributor.target}} ({{contributor.hitCount}})</a></li>
      </ul>
    </div>
</div>
 -->