mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2026-09-09 18:02:54 +00:00
[ACA-2350] fix ellipsis on DL and the context-menu issue (#1070)
* add adf-no-grow-cell & min-width on columns * [ACA-2350] fix ellipsis on DL and the context-menu issue - issues were caused by nested items with the same classname: 'adf-datatable-cell' * [ACA-2350] fix unit test * [ACA-2350] remove deprecated classname - mention 'adf-datatable-cell--text' example container class for elements that have context menu * [ACA-2350] small fixes on search-results display * [ACA-2350] fix location check * [ACA-2350] should clean-up code once [ADF-4401] issue is fixed * [ACA-2350] change e2e expect to check match * [plint] fix code formatting * [plint] fix code formatting
This commit is contained in:
committed by
Denys Vuika
parent
b2b234c3cb
commit
91eaa3c305
@@ -43,13 +43,18 @@ import { TranslationService } from '@alfresco/adf-core';
|
||||
@Component({
|
||||
selector: 'aca-location-link',
|
||||
template: `
|
||||
<a href="" [title]="nodeLocation$ | async" (click)="goToLocation()">
|
||||
<a
|
||||
href=""
|
||||
[title]="nodeLocation$ | async"
|
||||
(click)="goToLocation()"
|
||||
class="adf-datatable-cell-value"
|
||||
>
|
||||
{{ displayText | async | translate }}
|
||||
</a>
|
||||
`,
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: { class: 'aca-location-link adf-location-cell' }
|
||||
host: { class: 'aca-location-link adf-location-cell aca-column-content' }
|
||||
})
|
||||
export class LocationLinkComponent implements OnInit {
|
||||
private _path: PathInfo;
|
||||
|
||||
@@ -100,7 +100,8 @@ export class ContextActionsDirective implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
private getTarget(event: MouseEvent): Element {
|
||||
return this.findAncestor(<Element>event.target, 'adf-datatable-cell');
|
||||
// change back to 'adf-datatable-cell' once the [ADF-4401] issue is fixed
|
||||
return this.findAncestor(<Element>event.target, 'adf-datatable-cell--');
|
||||
}
|
||||
|
||||
private isSelected(target: Element): boolean {
|
||||
@@ -113,12 +114,15 @@ export class ContextActionsDirective implements OnInit, OnDestroy {
|
||||
);
|
||||
}
|
||||
|
||||
private findAncestor(el: Element, className: string): Element {
|
||||
if (el.classList.contains(className)) {
|
||||
private findAncestor(el: Element, classNameString: string): Element {
|
||||
if (el.classList.value.includes(classNameString)) {
|
||||
return el;
|
||||
}
|
||||
// tslint:disable-next-line:curly
|
||||
while ((el = el.parentElement) && !el.classList.contains(className));
|
||||
while (
|
||||
(el = el.parentElement) &&
|
||||
!el.classList.value.includes(classNameString)
|
||||
);
|
||||
return el;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -45,7 +45,8 @@ describe('ContextActionsDirective', () => {
|
||||
|
||||
it('should call service to render context menu', fakeAsync(() => {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'adf-data-table-cell adf-datatable-cell adf-datatable-row';
|
||||
el.className =
|
||||
'adf-datatable-cell adf-datatable-cell--text adf-datatable-row';
|
||||
|
||||
const fragment = document.createDocumentFragment();
|
||||
fragment.appendChild(el);
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
.aca-name-column-container {
|
||||
aca-locked-by {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 13px;
|
||||
top: 17px;
|
||||
left: 7px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
|
||||
@@ -36,7 +36,7 @@ import { isLocked } from '../../../utils/node.utils';
|
||||
templateUrl: './name-column.component.html',
|
||||
styleUrls: ['name-column.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: { class: 'adf-datatable-cell adf-datatable-link adf-name-column' }
|
||||
host: { class: ' aca-column-content adf-datatable-link adf-name-column' }
|
||||
})
|
||||
export class CustomNameColumnComponent extends NameColumnComponent
|
||||
implements OnInit, OnDestroy {
|
||||
|
||||
@@ -31,6 +31,7 @@
|
||||
|
||||
.adf-search-filter {
|
||||
min-width: 260px;
|
||||
max-width: 320px;
|
||||
padding: 5px;
|
||||
height: 100%;
|
||||
overflow: scroll;
|
||||
|
||||
@@ -15,23 +15,42 @@
|
||||
.adf-datatable-list {
|
||||
border: none;
|
||||
|
||||
.adf-datatable-link {
|
||||
&.adf-name-column,
|
||||
&.adf-library-name-column {
|
||||
color: $document-list-name-text-color;
|
||||
.adf-datatable-cell-container {
|
||||
.aca-column-content,
|
||||
.adf-name-column,
|
||||
.adf-library-name-column,
|
||||
.adf-trashcan-name-column {
|
||||
position: absolute;
|
||||
max-width: calc(100% - 0px);
|
||||
|
||||
&:hover {
|
||||
color: $document-list-selection-color;
|
||||
// remove this style once the [ADF-4401] issue is fixed:
|
||||
&.adf-datatable-cell {
|
||||
.adf-datatable-cell-value {
|
||||
position: static;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-cell-value {
|
||||
position: static;
|
||||
max-width: 35vw;
|
||||
.adf-library-name-column {
|
||||
// same as on top comment
|
||||
&.adf-datatable-cell {
|
||||
color: $document-list-name-text-color;
|
||||
|
||||
&:hover {
|
||||
color: $document-list-selection-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-cell-value {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.adf-datatable-cell--image {
|
||||
min-width: $document-list-thumbnail-width;
|
||||
width: $document-list-thumbnail-width;
|
||||
max-width: $document-list-thumbnail-width;
|
||||
}
|
||||
}
|
||||
@@ -53,14 +72,19 @@
|
||||
.adf-datatable-cell {
|
||||
padding: 0 2px;
|
||||
box-sizing: border-box;
|
||||
min-width: 100px;
|
||||
|
||||
&.adf-no-grow-cell {
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
min-width: $document-list-thumbnail-width;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
.adf-datatable-cell-value {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-cell {
|
||||
@@ -88,4 +112,9 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adf-search-results .adf-datatable .adf-datatable-cell {
|
||||
padding-top: 12px;
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -452,10 +452,10 @@
|
||||
"icon": "history",
|
||||
"actions": {
|
||||
"click": "MANAGE_VERSIONS"
|
||||
},
|
||||
"rules": {
|
||||
"visible": "canManageFileVersions"
|
||||
}
|
||||
},
|
||||
"rules": {
|
||||
"visible": "canManageFileVersions"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "app.toolbar.permissions",
|
||||
@@ -1080,6 +1080,7 @@
|
||||
"key": "content.sizeInBytes",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SIZE",
|
||||
"type": "fileSize",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1089,6 +1090,7 @@
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_ON",
|
||||
"type": "date",
|
||||
"format": "timeAgo",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1097,7 +1099,7 @@
|
||||
"key": "modifiedByUser.displayName",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_BY",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
}
|
||||
@@ -1125,6 +1127,7 @@
|
||||
"key": "role",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.ROLE",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryRole",
|
||||
"desktopOnly": false
|
||||
@@ -1134,6 +1137,7 @@
|
||||
"key": "visibility",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.VISIBILITY",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true
|
||||
@@ -1162,6 +1166,7 @@
|
||||
"key": "role",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.ROLE",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryRole",
|
||||
"desktopOnly": false
|
||||
@@ -1171,6 +1176,7 @@
|
||||
"key": "visibility",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.VISIBILITY",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true
|
||||
@@ -1199,6 +1205,7 @@
|
||||
"key": "path.name",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.LOCATION",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.location",
|
||||
"desktopOnly": true
|
||||
@@ -1208,6 +1215,7 @@
|
||||
"key": "content.sizeInBytes",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SIZE",
|
||||
"type": "fileSize",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1216,6 +1224,7 @@
|
||||
"key": "modifiedAt",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_ON",
|
||||
"type": "date",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"format": "timeAgo",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
@@ -1225,7 +1234,7 @@
|
||||
"key": "modifiedByUser.displayName",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_BY",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1234,7 +1243,7 @@
|
||||
"key": "sharedByUser.displayName",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SHARED_BY",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
}
|
||||
@@ -1262,6 +1271,7 @@
|
||||
"key": "path.name",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.LOCATION",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.location",
|
||||
"desktopOnly": true
|
||||
@@ -1271,6 +1281,7 @@
|
||||
"key": "content.sizeInBytes",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SIZE",
|
||||
"type": "fileSize",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1280,6 +1291,7 @@
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_ON",
|
||||
"type": "date",
|
||||
"format": "timeAgo",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
}
|
||||
@@ -1307,6 +1319,7 @@
|
||||
"key": "path.name",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.LOCATION",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.location",
|
||||
"desktopOnly": true
|
||||
@@ -1316,6 +1329,7 @@
|
||||
"key": "sizeInBytes",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SIZE",
|
||||
"type": "fileSize",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1325,6 +1339,7 @@
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_ON",
|
||||
"type": "date",
|
||||
"format": "timeAgo",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1333,7 +1348,7 @@
|
||||
"key": "modifiedByUser.displayName",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.MODIFIED_BY",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
}
|
||||
@@ -1361,6 +1376,7 @@
|
||||
"key": "path.name",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.LOCATION",
|
||||
"type": "text",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.location",
|
||||
"desktopOnly": true
|
||||
@@ -1370,6 +1386,7 @@
|
||||
"key": "content.sizeInBytes",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.SIZE",
|
||||
"type": "fileSize",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
},
|
||||
@@ -1379,6 +1396,7 @@
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.DELETED_ON",
|
||||
"type": "date",
|
||||
"format": "timeAgo",
|
||||
"class": "adf-ellipsis-cell adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"desktopOnly": true
|
||||
}
|
||||
@@ -1406,6 +1424,7 @@
|
||||
"key": "role",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.ROLE",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryRole",
|
||||
"desktopOnly": false
|
||||
@@ -1415,6 +1434,7 @@
|
||||
"key": "visibility",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.VISIBILITY",
|
||||
"type": "text",
|
||||
"class": "adf-no-grow-cell",
|
||||
"sortable": true,
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true
|
||||
|
||||
Reference in New Issue
Block a user