100 lines
3.3 KiB
HTML
100 lines
3.3 KiB
HTML
<div class="options">
|
|
<h1 class="title is-1">
|
|
{{ 'choices.title' | translate }}
|
|
</h1>
|
|
|
|
<!--{{ 'choices.helper' |translate}}-->
|
|
<div class="rounded-block" *ngFor="let choice of StorageService.choicesText; index as ii">
|
|
<label [for]="'option_' + ii">{{ 'choices.element' | translate }} {{ ii + 1 }}</label>
|
|
<input type="text" [(ngModel)]="choice.name" class="input" />
|
|
|
|
<div class="image-preview" *ngIf="choice.url_display">
|
|
<img src="{{ choice.url_display }}" alt="image" class="icon is-rounded" />
|
|
</div>
|
|
<div class="href-preview" *ngIf="choice.url_href">
|
|
{{ choice.url_href }}
|
|
</div>
|
|
<div class="link-land">
|
|
<button
|
|
(click)="openLinkModal(choice)"
|
|
class="link-button has-no-background has-background-link-icon has-background-icon-left is-filtered-icon-primary"
|
|
*ngIf="!choice.url_href || !choice.url_display"
|
|
>
|
|
{{ 'choices.add_link' | translate }}
|
|
</button>
|
|
<!-- <button (click)="openLinkModal(choice)"-->
|
|
<!-- class="button is-secondary has-background-link has-background-icon-left is-filtered-icon-primary"-->
|
|
<!-- *ngIf="choice.url_href || choice.url_display">-->
|
|
<!-- {{ 'SENTENCES.Edit' | translate }}-->
|
|
<!-- </button>-->
|
|
</div>
|
|
<!-- <button class="button delete-date is-block" (click)="StorageService.choicesText.splice(ii, 1)">-->
|
|
<!-- <img class="icon" src="assets/icons/trash-2.svg" />-->
|
|
<!-- {{ 'choices.delete' | translate }}-->
|
|
<!-- </button>-->
|
|
|
|
<hr />
|
|
<div class="down-line-button-container">
|
|
<button
|
|
[attr.aria-label]="'choices.delete' | translate"
|
|
class="has-background-trash has-background-icon-left is-filtered-icon-primary"
|
|
(click)="StorageService.choicesText.splice(ii, 1)"
|
|
>
|
|
{{ 'choices.delete' | translate }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="is-primary button is-fullwidth is-thin" (click)="addLink()">
|
|
{{ 'choices.add' | translate }}
|
|
</button>
|
|
|
|
<!-- dialog search-->
|
|
<p-dialog
|
|
[modal]="true"
|
|
[(visible)]="display_option_dialog"
|
|
[breakpoints]="{ '600px': '75vw', '400px': '95vw' }"
|
|
[style]="{ width: '486px' }"
|
|
[draggable]="false"
|
|
[showHeader]="false"
|
|
[resizable]="true"
|
|
>
|
|
<ng-template pTemplate="titlebar">
|
|
<button
|
|
id="close_dialog"
|
|
class="button cancel-button-reject pull-right has-text-right has-no-border is-closing-popup"
|
|
(click)="closeModalAndFocusOnOpenModalButton()"
|
|
>
|
|
{{ 'SENTENCES.Close' | translate }} <img class="icon fa" src="assets/icons/x_blue.svg" />
|
|
</button>
|
|
|
|
<h1 class="title is-1">
|
|
{{ 'choices.modal.title' | translate }}
|
|
</h1>
|
|
<p class="description">
|
|
{{ 'choices.modal.description' | translate }}
|
|
</p>
|
|
<label for="modal_url">
|
|
{{ 'choices.modal.url_label' | translate }}
|
|
</label>
|
|
<input type="text" [(ngModel)]="url_href" id="modal_url" />
|
|
<label for="modal_url">
|
|
{{ 'choices.modal.img_label' | translate }}
|
|
</label>
|
|
<input type="text" [(ngModel)]="url_display" id="modal_img_url" />
|
|
</ng-template>
|
|
<ng-template pTemplate="footer">
|
|
<div class="bottom has-text-right">
|
|
<button class="button is-secondary marged-right" (click)="closeModal()">
|
|
{{ 'SENTENCES.Cancel' | translate }}
|
|
</button>
|
|
<button class="button is-primary" (click)="validateModal()">
|
|
{{ 'choices.modal.validate' | translate }}
|
|
</button>
|
|
</div>
|
|
</ng-template>
|
|
</p-dialog>
|
|
|
|
<!--<app-wip-todo></app-wip-todo>-->
|