Display separator between ngFor components (#2359)
We currently remove the separator element when a `box-content-row`
is the last child. However, when we create these rows from ng templates
each row gets a separate template element wrapping it.
This PR tells the cipher-row component whether it is the last child
(cherry picked from commit b9fb223dea
)
This commit is contained in:
parent
4715a7e3d0
commit
01f8e8d7c7
|
@ -5,6 +5,7 @@
|
||||||
appStopClick
|
appStopClick
|
||||||
title="{{ title }} - {{ cipher.name }}"
|
title="{{ title }} - {{ cipher.name }}"
|
||||||
class="box-content-row box-content-row-flex virtual-scroll-item"
|
class="box-content-row box-content-row-flex virtual-scroll-item"
|
||||||
|
[ngClass]="{ 'override-last': !last }"
|
||||||
>
|
>
|
||||||
<div class="row-main">
|
<div class="row-main">
|
||||||
<app-vault-icon [cipher]="cipher"></app-vault-icon>
|
<app-vault-icon [cipher]="cipher"></app-vault-icon>
|
||||||
|
|
|
@ -11,6 +11,7 @@ export class CipherRowComponent {
|
||||||
@Output() launchEvent = new EventEmitter<CipherView>();
|
@Output() launchEvent = new EventEmitter<CipherView>();
|
||||||
@Output() onView = new EventEmitter<CipherView>();
|
@Output() onView = new EventEmitter<CipherView>();
|
||||||
@Input() cipher: CipherView;
|
@Input() cipher: CipherView;
|
||||||
|
@Input() last: boolean;
|
||||||
@Input() showView = false;
|
@Input() showView = false;
|
||||||
@Input() title: string;
|
@Input() title: string;
|
||||||
|
|
||||||
|
|
|
@ -211,6 +211,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.override-last:last-child:before {
|
||||||
|
border-bottom: 1px solid #000000;
|
||||||
|
@include themify($themes) {
|
||||||
|
border-bottom-color: themed("boxBorderColor");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&.last:last-child:before {
|
&.last:last-child:before {
|
||||||
border-bottom: 1px solid #000000;
|
border-bottom: 1px solid #000000;
|
||||||
@include themify($themes) {
|
@include themify($themes) {
|
||||||
|
|
|
@ -97,8 +97,9 @@
|
||||||
</h2>
|
</h2>
|
||||||
<div class="box-content">
|
<div class="box-content">
|
||||||
<app-cipher-row
|
<app-cipher-row
|
||||||
*cdkVirtualFor="let c of ciphers"
|
*cdkVirtualFor="let c of ciphers; let last = last"
|
||||||
[cipher]="c"
|
[cipher]="c"
|
||||||
|
[last]="last"
|
||||||
title="{{ 'viewItem' | i18n }}"
|
title="{{ 'viewItem' | i18n }}"
|
||||||
(onSelected)="selectCipher($event)"
|
(onSelected)="selectCipher($event)"
|
||||||
(launchEvent)="launchCipher($event)"
|
(launchEvent)="launchCipher($event)"
|
||||||
|
|
Loading…
Reference in New Issue