style cols
This commit is contained in:
parent
63f98a48ed
commit
334b6c90cf
7 changed files with 35 additions and 36 deletions
|
@ -5,7 +5,7 @@
|
|||
<div class="bot-talks-message">
|
||||
{{ message }}
|
||||
</div>
|
||||
@if (documents?.length) {
|
||||
@if (documents.length) {
|
||||
@for (document of documents; track document.id) {
|
||||
|
||||
<div class="document-container">
|
||||
|
|
|
@ -71,7 +71,7 @@
|
|||
|
||||
.chips-column {
|
||||
padding: 12px 12px;
|
||||
width: 220px;
|
||||
width: 218px;
|
||||
//border: solid 1px #ccc;
|
||||
}
|
||||
|
||||
|
|
|
@ -8,12 +8,12 @@
|
|||
|
||||
<i class="ri-search-line search-placeholder"></i>
|
||||
<div class="label">
|
||||
<span class="d-none">
|
||||
<span class="d-none">
|
||||
{{ label }}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!-- (blur)="displayDropdown = false"-->
|
||||
<input
|
||||
(blur)="displayDropdown = false"
|
||||
(click)="onClickInput()"
|
||||
(focus)="displayDropdown = true"
|
||||
class="is-hidden" placeholder="{{label}}"
|
||||
|
@ -22,47 +22,41 @@
|
|||
class="selected-items-counter">
|
||||
{{ selectedChoices?.length || 0 }}
|
||||
</span>
|
||||
<div class="dropdown-button selector-button">
|
||||
<div (click)="onClickInput()" class="dropdown-button selector-button">
|
||||
<!-- bouton-->
|
||||
<i class="ri-arrow-down-s-line"></i>
|
||||
</div>
|
||||
|
||||
@if (displayDropdown
|
||||
&& availableChoices?.length) {
|
||||
@if (displayDropdown && availableChoices?.length) {
|
||||
|
||||
|
||||
<div class="dropdown">
|
||||
|
||||
<div class="dropdown-list">
|
||||
<!-- selected:-->
|
||||
<div class="selected-items">
|
||||
|
||||
@for (sc of selectedChoices; track sc) {
|
||||
<div class="dropdown-item"
|
||||
(click)="selectedChoicesChangeToggleItem(sc)"
|
||||
@if (selectedChoices?.length && availableChoices?.length) {
|
||||
<div class="selected-items">
|
||||
<div (click)="selectedChoicesChangeToggleItem(sc)"
|
||||
*ngFor="let sc of selectedChoices"
|
||||
class="dropdown-item"
|
||||
>
|
||||
|
||||
<i class="ri-checkbox-line"></i>
|
||||
{{ sc }}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@if (selectedChoices?.length && availableChoices?.length) {
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
}
|
||||
<div class="available-items">
|
||||
<!-- available:-->
|
||||
@for (ac of availableChoices; track ac) {
|
||||
<div class="dropdown-item"
|
||||
(click)="availableChoicesChangeToggleItem(ac)"
|
||||
>
|
||||
<i class="ri-checkbox-blank-line"></i>
|
||||
{{ ac }}
|
||||
</div>
|
||||
}
|
||||
<div (click)="availableChoicesChangeToggleItem(ac)"
|
||||
*ngFor="let ac of availableChoices"
|
||||
class="dropdown-item"
|
||||
>
|
||||
<i class="ri-checkbox-blank-line"></i>
|
||||
{{ ac }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
}
|
||||
</div>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
:host {
|
||||
|
||||
.input-box {
|
||||
width: 220px;
|
||||
width: 218px;
|
||||
|
||||
.d-none {
|
||||
display: none;
|
||||
|
@ -91,12 +91,13 @@
|
|||
border-radius: 8px;
|
||||
position: relative;
|
||||
display: block;
|
||||
z-index: 10;
|
||||
z-index: 100;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
width: 210px;
|
||||
|
||||
top: -59px;
|
||||
top: 42px;
|
||||
left: 0;
|
||||
border-left: 1px solid #8D91A4;
|
||||
border-bottom: 1px solid #8D91A4;
|
||||
border-right: 1px solid #8D91A4;
|
||||
|
|
|
@ -55,7 +55,11 @@ export class MultiSelector {
|
|||
}
|
||||
|
||||
onClickInput() {
|
||||
if (this.disabled) return;
|
||||
this.displayDropdown = !this.displayDropdown
|
||||
if (this.disabled) {
|
||||
console.info('disabled input');
|
||||
return;
|
||||
}
|
||||
this.displayDropdown = !this.displayDropdown;
|
||||
console.log('Toggled dropdown:', this.displayDropdown);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -7,7 +7,7 @@ export const initialState: StateInterface = {
|
|||
backendAPIRoot: "",
|
||||
demoMode: true,
|
||||
loading: false,
|
||||
fromText: "le texte original",
|
||||
fromText: "",
|
||||
// fromText: "",
|
||||
fromFile: "",
|
||||
toText: "",
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
<div id="fromText">
|
||||
|
||||
@if (!fileIsUploaded) {
|
||||
@if (!fileIsUploaded || !appState.fromText.length) {
|
||||
<!-- @if (appState.fromText.length == 0) {-->
|
||||
<button (click)="clickFileUpload(fileUpload)" class=" click-file-upload is-outlined">
|
||||
<span class="label">
|
||||
|
@ -40,7 +40,7 @@
|
|||
<!-- delete button from_text-->
|
||||
|
||||
<button (click)="emptyText('fromText')" [ngClass]="{
|
||||
'is-visible' : fromText.length
|
||||
'is-visible' : appState.fromText.length
|
||||
}" class="delete-button button">x
|
||||
</button>
|
||||
@if (!fileIsUploaded) {
|
||||
|
@ -48,7 +48,7 @@
|
|||
(focus)="focusFromText()"
|
||||
(keyup)="onFromTextChanged()"
|
||||
(ngModelChange)="onFromTextChanged()"
|
||||
[ngModel]="appState.fromText"
|
||||
[(ngModel)]="appState.fromText"
|
||||
cols="30"
|
||||
id="from_text"
|
||||
name="from_text"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue