<div class="video">
<div class="title-page title-page-single" *ngIf="hasPlaylist()" i18n>Share the video</div>
- <ngb-tabset class="root-tabset bootstrap" (tabChange)="onTabChange($event)">
+ <div ngbNav #nav="ngbNav" class="nav-tabs" [(activeId)]="activeId">
- <ngb-tab i18n-title title="URL" id="url">
- <ng-template ngbTabContent>
+ <ng-container ngbNavItem="url">
+ <a ngbNavLink i18n>URL</a>
- <div class="tab-content">
+ <ng-template ngbNavContent>
+ <div class="nav-content">
<my-input-readonly-copy [value]="getVideoUrl()"></my-input-readonly-copy>
</div>
-
</ng-template>
- </ngb-tab>
+ </ng-container>
+
+ <ng-container ngbNavItem="qrcode">
+ <a ngbNavLink i18n>QR-Code</a>
- <ngb-tab i18n-title title="QR-Code" id="qrcode">
- <ng-template ngbTabContent>
- <div class="tab-content">
- <qrcode [qrdata]="getVideoUrl()" size="256" level="Q"></qrcode>
+ <ng-template ngbNavContent>
+ <div class="nav-content">
+ <qrcode [qrdata]="getVideoUrl()" [size]="256" level="Q"></qrcode>
</div>
</ng-template>
- </ngb-tab>
+ </ng-container>
+
+ <ng-container ngbNavItem="embed">
+ <a ngbNavLink i18n>Embed</a>
- <ngb-tab i18n-title title="Embed" id="embed">
- <ng-template ngbTabContent>
- <div class="tab-content">
+ <ng-template ngbNavContent>
+ <div class="nav-content">
<my-input-readonly-copy [value]="getVideoIframeCode()"></my-input-readonly-copy>
<div i18n *ngIf="notSecure()" class="alert alert-warning">
</div>
</div>
</ng-template>
- </ngb-tab>
+ </ng-container>
- </ngb-tabset>
+ </div>
+
+ <div [ngbNavOutlet]="nav"></div>
<div class="filters">
<div>
</div>
</div>
- <div (click)="isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role="button" class="advanced-filters-button"
- [attr.aria-expanded]="!isAdvancedCustomizationCollapsed" aria-controls="collapseBasic">
-
- <ng-container *ngIf="isAdvancedCustomizationCollapsed">
- <span class="glyphicon glyphicon-menu-down"></span>
-
- <ng-container i18n>
- More customization
- </ng-container>
- </ng-container>
-
- <ng-container *ngIf="!isAdvancedCustomizationCollapsed">
- <span class="glyphicon glyphicon-menu-up"></span>
-
- <ng-container i18n>
- Less customization
- </ng-container>
- </ng-container>
- </div>
-
<div class="advanced-filters collapse-transition" [ngbCollapse]="isAdvancedCustomizationCollapsed">
<div>
<div class="form-group stop-at">
</div>
</ng-container>
</div>
+
+ <div (click)="isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role="button" class="advanced-filters-button"
+ [attr.aria-expanded]="!isAdvancedCustomizationCollapsed" aria-controls="collapseBasic">
+
+ <ng-container *ngIf="isAdvancedCustomizationCollapsed">
+ <span class="glyphicon glyphicon-menu-down"></span>
+
+ <ng-container i18n>
+ More customization
+ </ng-container>
+ </ng-container>
+
+ <ng-container *ngIf="!isAdvancedCustomizationCollapsed">
+ <span class="glyphicon glyphicon-menu-up"></span>
+
+ <ng-container i18n>
+ Less customization
+ </ng-container>
+ </ng-container>
+ </div>
</div>
</div>
</div>
- <div class="modal-footer inputs">
- <span i18n class="action-button action-button-cancel" (click)="hide()">Close</span>
- </div>
-
</ng-template>