Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

one commit on comments

Browse Source
This commit is contained in:
Timo Bejan 2020-11-11 21:34:17 +02:00
parent 57826e891d
commit f05297365f
22 changed files with 145 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
apps/red-ui/src/app/common/file-actions/file-actions.component.html
View File

@ -3,7 +3,7 @@
(click)="openDeleteFileDialog($event, fileStatus)"
*ngIf="permissionsService.canDeleteFile(fileStatus)"
[matTooltip]="'project-overview.delete.action' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -12,7 +12,7 @@
<div
[matTooltip]="(fileStatus.isApproved ? 'report.action' : 'report.unavailable-single') | translate"
*ngIf="permissionsService.canShowRedactionReportDownloadBtn(fileStatus)"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
>
<button (click)="downloadFileRedactionReport($event, fileStatus)" [disabled]="!fileStatus.isApproved" color="accent" mat-icon-button>
<mat-icon svgIcon="red:report"></mat-icon>
@ -35,7 +35,7 @@
(click)="reanalyseFile($event, fileStatus)"
*ngIf="permissionsService.canReanalyseFile(fileStatus) && screen !== 'file-preview'"
[matTooltip]="'project-overview.reanalyse.action' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -46,7 +46,7 @@
(click)="assignReviewer($event, fileStatus)"
*ngIf="permissionsService.canAssignReviewer(fileStatus)"
[matTooltip]="'project-overview.assign.action' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -57,7 +57,7 @@
(click)="setFileApproved($event, fileStatus)"
*ngIf="permissionsService.canApprove(fileStatus)"
[matTooltip]="'project-overview.approve' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -67,7 +67,7 @@
(click)="setFileUnderApproval($event, fileStatus)"
*ngIf="permissionsService.canSetUnderApproval(fileStatus)"
[matTooltip]="'project-overview.under-approval' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -77,7 +77,7 @@
(click)="setFileUnderApproval($event, fileStatus)"
*ngIf="permissionsService.canUndoApproval(fileStatus)"
[matTooltip]="'project-overview.under-approval' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>
@ -87,7 +87,7 @@
(click)="setFileUnderReview($event, fileStatus)"
*ngIf="permissionsService.canUndoUnderApproval(fileStatus)"
[matTooltip]="'project-overview.under-review' | translate"
matTooltipPosition="above"
[matTooltipPosition]="tooltipPosition"
color="accent"
mat-icon-button
>

4
apps/red-ui/src/app/common/file-actions/file-actions.component.ts
View File

@ -47,6 +47,10 @@ export class FileActionsComponent implements OnInit, AfterViewInit {
}, 1000);
}
public get tooltipPosition() {
return this.screen === 'file-preview' ? 'below' : 'above';
}
openDeleteFileDialog($event: MouseEvent, fileStatusWrapper: FileStatusWrapper) {
this._dialogService.openDeleteFileDialog($event, fileStatusWrapper.projectId, fileStatusWrapper.fileId, () => {
this.actionPerformed.emit('delete');

54
apps/red-ui/src/app/components/comments/comments.component.html
View File

@ -1,20 +1,10 @@
<div class="comments" *ngIf="annotation.manual">
<div class="wrapper" *ngIf="annotation.manual">
<ng-container *ngIf="expanded">
<div *ngFor="let comment of annotation.comments; let idx = index" class="comment">
<div
class="comment-icon"
[class.red]="isCommentOwner(comment)"
[class.comment-owner]="isCommentOwner(comment)"
>
<mat-icon
[svgIcon]="isCommentOwner(comment) ? 'red:comment-fill' : 'red:comment'"
></mat-icon>
<div class="comment-icon" [class.red]="isCommentOwner(comment)" [class.comment-owner]="isCommentOwner(comment)">
<mat-icon [svgIcon]="isCommentOwner(comment) ? 'red:comment-fill' : 'red:comment'"></mat-icon>
</div>
<div
class="trash-icon red"
(click)="deleteComment(comment)"
[class.comment-owner]="isCommentOwner(comment)"
>
<div class="trash-icon red" (click)="deleteComment(comment)" [class.comment-owner]="isCommentOwner(comment)">
<mat-icon svgIcon="red:trash"></mat-icon>
</div>
@ -25,25 +15,29 @@
</div>
</ng-container>
<div (click)="toggleExpandComments($event)" class="all-caps-label">
{{
expanded
? translateService.instant('comments.hide-comments')
: translateService.instant(
annotation.comments.length === 1 ? 'comments.comment' : 'comments.comments',
{ count: annotation.comments.length }
)
}}
<div class="actions-container all-caps-label">
<div (click)="toggleExpandComments($event)" *ngIf="annotation.comments.length">
{{
expanded
? translateService.instant('comments.hide-comments')
: translateService.instant(annotation.comments.length === 1 ? 'comments.comment' : 'comments.comments', {
count: annotation.comments.length
})
}}
</div>
<div *ngIf="!addingComment" (click)="toggleAddingComment($event)" translate="comments.add-comment"></div>
</div>
<form [formGroup]="commentForm" (submit)="addComment()">
<form *ngIf="addingComment" [formGroup]="commentForm" (submit)="addComment()">
<div class="red-input-group">
<input
formControlName="comment"
name="comment"
type="text"
[placeholder]="translateService.instant('comments.add-comment')"
/>
<input formControlName="comment" name="comment" type="text" [placeholder]="translateService.instant('comments.add-comment')" />
</div>
</form>
<div *ngIf="addingComment" class="comment-actions-container">
<button (click)="addComment()" mat-icon-button class="primary" [disabled]="!commentForm.value.comment">
<mat-icon svgIcon="red:check-alt"></mat-icon>
</button>
<div (click)="toggleAddingComment($event)" class="all-caps-label" translate="comments.cancel"></div>
</div>
</div>

18
apps/red-ui/src/app/components/comments/comments.component.scss
View File

@ -1,9 +1,10 @@
@import '../../../assets/styles/red-variables';
.comments {
.wrapper {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 10px;
.comment {
display: flex;
@ -41,7 +42,20 @@
}
}
.all-caps-label {
.comment-actions-container,
.actions-container {
display: flex;
gap: 15px;
align-items: center;
}
.actions-container {
margin-left: 26px;
gap: 5px;
> div:not(:last-child):after {
content: '•';
margin-left: 5px;
}
}
}

40
apps/red-ui/src/app/components/comments/comments.component.ts
View File

@ -15,6 +15,7 @@ export class CommentsComponent {
@Input() public annotation: AnnotationWrapper;
public expanded = false;
public commentForm: FormGroup;
public addingComment = false;
constructor(
public readonly translateService: TranslateService,
@ -38,32 +39,35 @@ export class CommentsComponent {
this._changeDetectorRef.detectChanges();
}
public toggleAddingComment($event?: MouseEvent): void {
$event?.stopPropagation();
this.addingComment = !this.addingComment;
this._changeDetectorRef.detectChanges();
}
public addComment(): void {
const value = this.commentForm.value.comment;
if (value) {
this._manualAnnotationService
.addComment(value, this.annotation.id)
.subscribe((commentResponse) => {
this.annotation.comments.push({
text: value,
id: commentResponse.commentId,
user: this._userService.userId
});
this.expanded = true;
this._manualAnnotationService.addComment(value, this.annotation.id).subscribe((commentResponse) => {
this.annotation.comments.push({
text: value,
id: commentResponse.commentId,
user: this._userService.userId
});
this.expanded = true;
});
this.commentForm.reset();
this.toggleAddingComment();
}
this.commentForm.reset();
}
public deleteComment(comment: Comment): void {
this._manualAnnotationService
.deleteComment(comment.id, this.annotation.id)
.subscribe(() => {
this.annotation.comments.splice(this.annotation.comments.indexOf(comment), 1);
if (!this.annotation.comments.length) {
this.expanded = false;
}
});
this._manualAnnotationService.deleteComment(comment.id, this.annotation.id).subscribe(() => {
this.annotation.comments.splice(this.annotation.comments.indexOf(comment), 1);
if (!this.annotation.comments.length) {
this.expanded = false;
}
});
}
public isCommentOwner(comment: Comment): boolean {

1
apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss
View File

@ -89,7 +89,6 @@ redaction-pdf-viewer {
position: relative;
display: flex;
flex-direction: column;
gap: 10px;
border-left: 2px solid transparent;
.details {

4
apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html
View File

@ -1,8 +1,8 @@
<div class="actions-row" *ngIf="permissionsService.isManager()">
<button (click)="openDeleteProjectDialog($event)" mat-icon-button>
<button (click)="openDeleteProjectDialog($event)" mat-icon-button matTooltipPosition="above" [matTooltip]="'project-details.delete' | translate">
<mat-icon svgIcon="red:trash"></mat-icon>
</button>
<button (click)="openEditProjectDialog($event)" mat-icon-button>
<button (click)="openEditProjectDialog($event)" mat-icon-button matTooltipPosition="above" [matTooltip]="'project-details.edit' | translate">
<mat-icon svgIcon="red:edit"></mat-icon>
</button>
<div

8
apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html
View File

@ -28,7 +28,13 @@
</div>
<div>
<button (click)="fileInput.click()" color="primary" class="custom-mini-fab" mat-mini-fab>
<button
(click)="fileInput.click()"
class="primary"
mat-icon-button
[matTooltip]="'project-overview.upload-document' | translate"
matTooltipPosition="before"
>
<mat-icon svgIcon="red:upload"></mat-icon>
</button>
<button [routerLink]="['/ui/projects/']" mat-icon-button>

31
apps/red-ui/src/assets/i18n/en.json
View File

@ -157,6 +157,8 @@
}
},
"project-details": {
"edit": "Edit",
"delete": "Delete",
"dialog": {
"title": "Project Details",
"info": {
@ -251,19 +253,25 @@
"tabs": {
"quick-navigation": "Quick Navigation",
"annotations": {
"label": "Workload",
"accept-suggestion": {
"add-to-dict": "Approve and add to dictionary",
"remove-from-dict": "Approve and remove from dictionary",
"only-here": "Approve only here"
},
"remove-annotation": {
"remove-from-dict": "Remove from dictionary",
"only-here": "Remove only here"
}
"label": "Workload"
}
}
},
"annotation-actions": {
"accept-suggestion": {
"label": "Approve",
"add-to-dict": "Approve and add to dictionary",
"remove-from-dict": "Approve and remove from dictionary",
"only-here": "Approve only here"
},
"remove-annotation": {
"remove-from-dict": "Remove from dictionary",
"only-here": "Remove only here"
},
"remove": "Remove",
"undo": "Undo",
"reject": "Reject"
},
"initials-avatar": {
"unassigned": "Unassigned"
},
@ -289,7 +297,8 @@
"comment": "{{count}} comment",
"comments": "{{count}} comments",
"add-comment": "Add a comment",
"hide-comments": "Hide comments"
"hide-comments": "Hide",
"cancel": "Cancel"
},
"unassigned": "Unassigned",
"under-review": "Under review",

2
apps/red-ui/src/assets/icons/general/add-hint.svg
View File

@ -1,4 +1,4 @@
<svg height="512pt" viewBox="-82 0 512 512.00163" width="512pt" xmlns="http://www.w3.org/2000/svg">
<path fill="rgb(136,142,149)"
<path fill="currentColor"
d="m329.089844 94.824219c-1.921875-3.75-6.515625-5.230469-10.265625-3.3125-3.75 1.921875-5.234375 6.519531-3.3125 10.269531 11.523437 22.5 17.367187 46.820312 17.367187 72.285156 0 34.808594-11.054687 67.855469-31.96875 95.5625-8.675781 11.496094-13.453125 25.953125-13.453125 40.707032v.972656c0 20.777344-16.902343 37.679687-37.675781 37.679687h-68.085938v-96.597656c27.527344-3.738281 48.820313-27.382813 48.820313-55.917969 0-4.214844-3.417969-7.628906-7.628906-7.628906-4.214844 0-7.628907 3.414062-7.628907 7.628906 0 22.710938-18.476562 41.191406-41.191406 41.191406s-41.191406-18.480468-41.191406-41.191406c0-4.214844-3.414062-7.628906-7.628906-7.628906-4.210938 0-7.628906 3.414062-7.628906 7.628906 0 28.535156 21.292968 52.179688 48.820312 55.917969v96.597656h-68.085938c-20.773437 0-37.675781-16.902343-37.675781-37.679687v-.984375c0-14.839844-4.816406-29.128907-13.929687-41.324219-20.273438-27.144531-31.160156-59.441406-31.484375-93.394531-.402344-42.5 15.941406-82.65625 46.015625-113.074219 30.066406-30.40625 70.015625-47.195312 112.492187-47.273438h.300781c49.964844 0 96.007813 22.804688 126.355469 62.601563 2.558594 3.347656 7.34375 3.992187 10.691407 1.4375 3.351562-2.554687 3.996093-7.339844 1.441406-10.6875-15.933594-20.898437-36.722656-38.191406-60.117188-50.007813-24.539062-12.394531-51.058594-18.6718745-78.699218-18.601562-46.574219.0859375-90.367188 18.484375-123.3125 51.800781-32.957032 33.332031-50.863282 77.351563-50.4218755 123.949219.3554685 37.21875 12.2890625 72.621094 34.5195315 102.378906 7.125 9.539063 10.890625 20.671875 10.890625 32.195313v.984375c0 16.269531 7.382812 30.839844 18.964843 40.558594-11.171874 5.074218-18.964843 16.328124-18.964843 29.375 0 14.832031 10.070312 27.351562 23.726562 31.101562-3.539062 5.175781-5.609375 11.425781-5.609375 18.152344 0 17.785156 14.46875 32.253906 32.253906 32.253906h21.652344c3.742188 27.769531 27.578125 49.25 56.355469 49.25s52.613281-21.484375 56.351563-49.25h21.652343c17.785157 0 32.253907-14.46875 32.253907-32.253906 0-6.726563-2.070313-12.976563-5.605469-18.152344 13.65625-3.75 23.722656-16.269531 23.722656-31.101562 0-12.910157-7.628906-24.066407-18.609375-29.214844 11.691406-9.71875 19.152344-24.359375 19.152344-40.714844v-.972656c0-11.460938 3.683594-22.652344 10.371094-31.519532 22.925781-30.375 35.046874-66.601562 35.046874-104.75 0-27.910156-6.40625-54.570312-19.042968-79.246093zm-155.292969 401.921875c-20.347656 0-37.316406-14.679688-40.910156-33.996094h81.820312c-3.59375 19.316406-20.566406 33.996094-40.910156 33.996094zm96.121094-132.5c9.375 0 17 7.625 17 16.996094 0 9.375-7.625 17-17 17h-132.792969c-4.210938 0-7.628906 3.414062-7.628906 7.625 0 4.214843 3.417968 7.628906 7.628906 7.628906h114.675781c9.375 0 17 7.625 17 17 0 9.371094-7.625 16.996094-17 16.996094h-156.011719c-9.371093 0-16.996093-7.625-16.996093-16.996094 0-9.375 7.625-17 16.996093-17h10.824219c4.210938 0 7.625-3.414063 7.625-7.628906 0-4.210938-3.414062-7.625-7.625-7.625h-28.941406c-9.371094 0-16.996094-7.628907-16.996094-17 0-9.375 7.625-16.996094 16.996094-16.996094zm0 0"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

4
apps/red-ui/src/assets/icons/general/analyse.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>analyse</title>
<g id="analyse" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M16.5,89 L16.5,100 L0,100 L0,89 L16.5,89 Z M44.5,89 L44.5,100 L28,100 L28,89 L44.5,89 Z M72,89 L72,100 L55.5,100 L55.5,89 L72,89 Z M100,89 L100,100 L83.5,100 L83.5,89 L100,89 Z M16.5,66.5 L16.5,77.5 L0,77.5 L0,66.5 L16.5,66.5 Z M44.5,66.5 L44.5,77.5 L28,77.5 L28,66.5 L44.5,66.5 Z M72,66.5 L72,77.5 L55.5,77.5 L55.5,66.5 L72,66.5 Z M100,66.5 L100,77.5 L83.5,77.5 L83.5,66.5 L100,66.5 Z M16.5,44.5 L16.5,55.5 L0,55.5 L0,44.5 L16.5,44.5 Z M44.5,44.5 L44.5,55.5 L28,55.5 L28,44.5 L44.5,44.5 Z M100,44.5 L100,55.5 L83.5,55.5 L83.5,44.5 L100,44.5 Z M44.5,22 L44.5,33 L28,33 L28,22 L44.5,22 Z M100,22 L100,33 L83.5,33 L83.5,22 L100,22 Z M44.5,0 L44.5,11 L28,11 L28,0 L44.5,0 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M16.5,89 L16.5,100 L0,100 L0,89 L16.5,89 Z M44.5,89 L44.5,100 L28,100 L28,89 L44.5,89 Z M72,89 L72,100 L55.5,100 L55.5,89 L72,89 Z M100,89 L100,100 L83.5,100 L83.5,89 L100,89 Z M16.5,66.5 L16.5,77.5 L0,77.5 L0,66.5 L16.5,66.5 Z M44.5,66.5 L44.5,77.5 L28,77.5 L28,66.5 L44.5,66.5 Z M72,66.5 L72,77.5 L55.5,77.5 L55.5,66.5 L72,66.5 Z M100,66.5 L100,77.5 L83.5,77.5 L83.5,66.5 L100,66.5 Z M16.5,44.5 L16.5,55.5 L0,55.5 L0,44.5 L16.5,44.5 Z M44.5,44.5 L44.5,55.5 L28,55.5 L28,44.5 L44.5,44.5 Z M100,44.5 L100,55.5 L83.5,55.5 L83.5,44.5 L100,44.5 Z M44.5,22 L44.5,33 L28,33 L28,22 L44.5,22 Z M100,22 L100,33 L83.5,33 L83.5,22 L100,22 Z M44.5,0 L44.5,11 L28,11 L28,0 L44.5,0 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

4
apps/red-ui/src/assets/icons/general/assign.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>assign</title>
<g id="assign" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M35,50 C54.5,50 70,65.5 70,85 L70,85 L70,100 L0,100 L0,85 C0,65.5 15.5,50 35,50 Z M35,60 C21,60 10,71 10,85 L10,85 L10,90 L60,90 L60,85 C60,71 49,60 35,60 Z M35,5 C46,5 55,14 55,25 C55,36 46,45 35,45 C24,45 15,36 15,25 C15,14 24,5 35,5 Z M85,0 L85,15 L100,15 L100,25 L85,25 L85,40 L75,40 L75,25 L60,25 L60,15 L75,15 L75,0 L85,0 Z M35,15 C29.5,15 25,19.5 25,25 C25,30.5 29.5,35 35,35 C40.5,35 45,30.5 45,25 C45,19.5 40.5,15 35,15 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M35,50 C54.5,50 70,65.5 70,85 L70,85 L70,100 L0,100 L0,85 C0,65.5 15.5,50 35,50 Z M35,60 C21,60 10,71 10,85 L10,85 L10,90 L60,90 L60,85 C60,71 49,60 35,60 Z M35,5 C46,5 55,14 55,25 C55,36 46,45 35,45 C24,45 15,36 15,25 C15,14 24,5 35,5 Z M85,0 L85,15 L100,15 L100,25 L85,25 L85,40 L75,40 L75,25 L60,25 L60,15 L75,15 L75,0 L85,0 Z M35,15 C29.5,15 25,19.5 25,25 C25,30.5 29.5,35 35,35 C40.5,35 45,30.5 45,25 C45,19.5 40.5,15 35,15 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 824 B

After

Width:  |  Height:  |  Size: 830 B

8
apps/red-ui/src/assets/icons/general/calendar.svg
View File

@ -2,8 +2,8 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>calendar</title>
<g id="calendar" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M35,70 L35,80 L25,80 L25,70 L35,70 Z M55,70 L55,80 L45,80 L45,70 L55,70 Z M35,55 L35,65 L25,65 L25,55 L35,55 Z M55,55 L55,65 L45,65 L45,55 L55,55 Z M75,55 L75,65 L65,65 L65,55 L75,55 Z M55,40 L55,50 L45,50 L45,40 L55,40 Z M75,40 L75,50 L65,50 L65,40 L75,40 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M90,0 L10,0 C4.5,0 0,4.5 0,10 L0,90 C0,95.5 4.5,100 10,100 L90,100 C95.5,100 100,95.5 100,90 L100,10 C100,4.5 95.5,0 90,0 Z M10,90 L10,10 L90,10 L90,90 L10,90 Z" id="Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M90,20 L10,20 C4.5,20 0,24.5 0,30 L0,90 C0,95.5 4.5,100 10,100 L90,100 C95.5,100 100,95.5 100,90 L100,30 C100,24.5 95.5,20 90,20 Z M10,90 L10,30 L90,30 L90,90 L10,90 Z" id="Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M35,70 L35,80 L25,80 L25,70 L35,70 Z M55,70 L55,80 L45,80 L45,70 L55,70 Z M35,55 L35,65 L25,65 L25,55 L35,55 Z M55,55 L55,65 L45,65 L45,55 L55,55 Z M75,55 L75,65 L65,65 L65,55 L75,55 Z M55,40 L55,50 L45,50 L45,40 L55,40 Z M75,40 L75,50 L65,50 L65,40 L75,40 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
<path d="M90,0 L10,0 C4.5,0 0,4.5 0,10 L0,90 C0,95.5 4.5,100 10,100 L90,100 C95.5,100 100,95.5 100,90 L100,10 C100,4.5 95.5,0 90,0 Z M10,90 L10,10 L90,10 L90,90 L10,90 Z" id="Shape" fill="currentColor" fill-rule="nonzero"></path>
<path d="M90,20 L10,20 C4.5,20 0,24.5 0,30 L0,90 C0,95.5 4.5,100 10,100 L90,100 C95.5,100 100,95.5 100,90 L100,30 C100,24.5 95.5,20 90,20 Z M10,90 L10,30 L90,30 L90,90 L10,90 Z" id="Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

4
apps/red-ui/src/assets/icons/general/edit.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>edit</title>
<g id="edit" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M97.0465218,17 L83.0398073,3 C79.0378889,-1 72.5347714,-1 69.0330928,3 L0,71.5 L0,100 L28.5136688,100 L97.0465218,31 C102.54916,25.5 99.047481,19 97.0465218,17 Z M24.0115105,90 L10.0047961,90 L10.0047961,76 L62.0297356,24 L76.03645,38 L24.0115105,90 Z M83.0398073,31 L69.0330928,17 L76.03645,10 L90.0431645,24 L83.0398073,31 Z" id="Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M97.0465218,17 L83.0398073,3 C79.0378889,-1 72.5347714,-1 69.0330928,3 L0,71.5 L0,100 L28.5136688,100 L97.0465218,31 C102.54916,25.5 99.047481,19 97.0465218,17 Z M24.0115105,90 L10.0047961,90 L10.0047961,76 L62.0297356,24 L76.03645,38 L24.0115105,90 Z M83.0398073,31 L69.0330928,17 L76.03645,10 L90.0431645,24 L83.0398073,31 Z" id="Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 707 B

After

Width:  |  Height:  |  Size: 713 B

4
apps/red-ui/src/assets/icons/general/folder.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>folder</title>
<g id="folder" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M43,15 L38,5 L0,5 L0,95 L100,95 L100,15 L43,15 Z M32,15 L37,25 L55.5,25 L52,30 L10,30 L10,15 L32,15 Z M90,85 L10,85 L10,40 L57.5,40 L67.5,25 L90,25 L90,85 Z" id="Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M43,15 L38,5 L0,5 L0,95 L100,95 L100,15 L43,15 Z M32,15 L37,25 L55.5,25 L52,30 L10,30 L10,15 L32,15 Z M90,85 L10,85 L10,40 L57.5,40 L67.5,25 L90,25 L90,85 Z" id="Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 541 B

After

Width:  |  Height:  |  Size: 547 B

4
apps/red-ui/src/assets/icons/general/info.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>info</title>
<g id="info" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M50,0 C77.5,0 100,22.5 100,50 C100,77.5 77.5,100 50,100 C22.5,100 0,77.5 0,50 C0,22.5 22.5,0 50,0 Z M50,10 C28,10 10,28 10,50 C10,72 28,90 50,90 C72,90 90,72 90,50 C90,28 72,10 50,10 Z M50,38.25 C57.5,38.25 59.3203,42.6758 58.4805,48.1328 L55,70.7498 L55.0318998,70.7491065 C55.3367202,70.7391667 57.826087,70.5867565 62.5,68.2498 C62.5,68.2498 60,78.2498 50,78.2498 C42.5,78.2498 40.6797,73.824 41.5195,68.367 L45,45.75 L44.9681002,45.7506935 C44.6632798,45.7606333 42.173913,45.9130435 37.5,48.25 C37.5,48.25 40,38.25 50,38.25 Z M52.5,19.75 C56.6445,19.75 60,23.1094 60,27.25 C60,31.3906 56.6445,34.75 52.5,34.75 C48.3555,34.75 45,31.3906 45,27.25 C45,23.1094 48.3555,19.75 52.5,19.75 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M50,0 C77.5,0 100,22.5 100,50 C100,77.5 77.5,100 50,100 C22.5,100 0,77.5 0,50 C0,22.5 22.5,0 50,0 Z M50,10 C28,10 10,28 10,50 C10,72 28,90 50,90 C72,90 90,72 90,50 C90,28 72,10 50,10 Z M50,38.25 C57.5,38.25 59.3203,42.6758 58.4805,48.1328 L55,70.7498 L55.0318998,70.7491065 C55.3367202,70.7391667 57.826087,70.5867565 62.5,68.2498 C62.5,68.2498 60,78.2498 50,78.2498 C42.5,78.2498 40.6797,73.824 41.5195,68.367 L45,45.75 L44.9681002,45.7506935 C44.6632798,45.7606333 42.173913,45.9130435 37.5,48.25 C37.5,48.25 40,38.25 50,38.25 Z M52.5,19.75 C56.6445,19.75 60,23.1094 60,27.25 C60,31.3906 56.6445,34.75 52.5,34.75 C48.3555,34.75 45,31.3906 45,27.25 C45,23.1094 48.3555,19.75 52.5,19.75 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

4
apps/red-ui/src/assets/icons/general/lightning.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>due</title>
<g id="due" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M70.4893515,-9.9475983e-14 L62.4015412,33.8688525 L83,33.8688525 L43.936,99.999 L25.137,99.999 L32.8329308,67.7704918 L17,67.7704918 L33.1807168,-9.9475983e-14 L70.4893515,-9.9475983e-14 Z M57.9505865,9.83606557 L41.0222871,9.83606557 L29.5384402,57.9344262 L45.3723404,57.9344262 L37.2849872,91.8032787 L65.6971335,43.704918 L49.8632333,43.704918 L57.9505865,9.83606557 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M70.4893515,-9.9475983e-14 L62.4015412,33.8688525 L83,33.8688525 L43.936,99.999 L25.137,99.999 L32.8329308,67.7704918 L17,67.7704918 L33.1807168,-9.9475983e-14 L70.4893515,-9.9475983e-14 Z M57.9505865,9.83606557 L41.0222871,9.83606557 L29.5384402,57.9344262 L45.3723404,57.9344262 L37.2849872,91.8032787 L65.6971335,43.704918 L49.8632333,43.704918 L57.9505865,9.83606557 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 760 B

After

Width:  |  Height:  |  Size: 766 B

4
apps/red-ui/src/assets/icons/general/report.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>report</title>
<g id="report" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M90,0 C95.5,0 100,4.5 100,10 L100,10 L100,90 C100,95.5 95.5,100 90,100 L90,100 L10,100 C4.5,100 0,95.5 0,90 L0,90 L0,10 C0,4.5 4.5,0 10,0 L10,0 Z M90,10 L10,10 L10,90 L90,90 L90,10 Z M35,60 L35,80 L25,80 L25,60 L35,60 Z M55,30 L55,80 L45,80 L45,30 L55,30 Z M75,50 L75,80 L65,80 L65,50 L75,50 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M90,0 C95.5,0 100,4.5 100,10 L100,10 L100,90 C100,95.5 95.5,100 90,100 L90,100 L10,100 C4.5,100 0,95.5 0,90 L0,90 L0,10 C0,4.5 4.5,0 10,0 L10,0 Z M90,10 L10,10 L10,90 L90,90 L90,10 Z M35,60 L35,80 L25,80 L25,60 L35,60 Z M55,30 L55,80 L45,80 L45,30 L55,30 Z M75,50 L75,80 L65,80 L65,50 L75,50 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 687 B

After

Width:  |  Height:  |  Size: 693 B

4
apps/red-ui/src/assets/icons/general/status.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>status</title>
<g id="status" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M60.2247499,90 L60.2247499,100 L40.2247499,100 L40.2247499,90 L60.2247499,90 Z M50.2247499,0 C69.7247499,0 85.2247499,15.5 85.2247499,35 C85.2247499,45.5 80.7247499,55 72.7247499,62 C67.7247499,66 65.2247499,71.5 65.2247499,77.5 L65.2247499,77.5 L65.2247499,85 L35.2247499,85 L35.2247499,77.5 C35.2247499,71.5 32.2247499,66 27.2247499,61.5 C17.2247499,53 13.2247499,40.5 15.7247499,28 C18.7247499,14.5 31.2247499,0 50.2247499,0 Z M50.2247499,10 C37.2247499,10 27.7247499,20.5 25.7247499,30 C23.7247499,39 26.7247499,48 33.7247499,54 C40.7247499,59.5 44.7247499,67 45.2247499,75 L45.2247499,75 L55.2247499,75 C56.2247499,66.5 59.7247499,59 66.2247499,54 C71.7247499,49.5 75.2247499,42.5 75.2247499,35 C75.2247499,21 64.2247499,10 50.2247499,10 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M60.2247499,90 L60.2247499,100 L40.2247499,100 L40.2247499,90 L60.2247499,90 Z M50.2247499,0 C69.7247499,0 85.2247499,15.5 85.2247499,35 C85.2247499,45.5 80.7247499,55 72.7247499,62 C67.7247499,66 65.2247499,71.5 65.2247499,77.5 L65.2247499,77.5 L65.2247499,85 L35.2247499,85 L35.2247499,77.5 C35.2247499,71.5 32.2247499,66 27.2247499,61.5 C17.2247499,53 13.2247499,40.5 15.7247499,28 C18.7247499,14.5 31.2247499,0 50.2247499,0 Z M50.2247499,10 C37.2247499,10 27.7247499,20.5 25.7247499,30 C23.7247499,39 26.7247499,48 33.7247499,54 C40.7247499,59.5 44.7247499,67 45.2247499,75 L45.2247499,75 L55.2247499,75 C56.2247499,66.5 59.7247499,59 66.2247499,54 C71.7247499,49.5 75.2247499,42.5 75.2247499,35 C75.2247499,21 64.2247499,10 50.2247499,10 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

4
apps/red-ui/src/assets/icons/general/user.svg
View File

@ -2,6 +2,6 @@
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>user</title>
<g id="user" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M50,0 C77.5,0 100,22.5 100,50 C100,77.5 77.5,100 50,100 C22.5,100 0,77.5 0,50 C0,22.5 22.5,0 50,0 Z M50,60 C37.5,60 27,69.5 25.5,81.5 C32,87 40.5,90 50,90 C59.5,90 68,87 74.5,81.5 C73,69.5 62.5,60 50,60 Z M50,10 C28,10 10,28 10,50 C10,58.5 12.5,66.5 17,73 C22,59.5 35,50 50,50 C65,50 78,59.5 83,73 C87.5,66.5 90,58.5 90,50 C90,28 72,10 50,10 Z M50,15 C58.5,15 65,21.5 65,30 C65,38.5 58.5,45 50,45 C41.5,45 35,38.5 35,30 C35,21.5 41.5,15 50,15 Z M50,25 C47,25 45,27 45,30 C45,33 47,35 50,35 C53,35 55,33 55,30 C55,27 53,25 50,25 Z" id="Combined-Shape" fill="#283241" fill-rule="nonzero"></path>
<path d="M50,0 C77.5,0 100,22.5 100,50 C100,77.5 77.5,100 50,100 C22.5,100 0,77.5 0,50 C0,22.5 22.5,0 50,0 Z M50,60 C37.5,60 27,69.5 25.5,81.5 C32,87 40.5,90 50,90 C59.5,90 68,87 74.5,81.5 C73,69.5 62.5,60 50,60 Z M50,10 C28,10 10,28 10,50 C10,58.5 12.5,66.5 17,73 C22,59.5 35,50 50,50 C65,50 78,59.5 83,73 C87.5,66.5 90,58.5 90,50 C90,28 72,10 50,10 Z M50,15 C58.5,15 65,21.5 65,30 C65,38.5 58.5,45 50,45 C41.5,45 35,38.5 35,30 C35,21.5 41.5,15 50,15 Z M50,25 C47,25 45,27 45,30 C45,33 47,35 50,35 C53,35 55,33 55,30 C55,27 53,25 50,25 Z" id="Combined-Shape" fill="currentColor" fill-rule="nonzero"></path>
</g>
</svg>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 919 B

After

Width:  |  Height:  |  Size: 925 B

29
apps/red-ui/src/assets/styles/red-button.scss
View File

@ -46,27 +46,24 @@
.mat-icon-button {
transition: background-color 0.25s ease-in-out;
width: 34px !important;
height: 34px !important;
line-height: 34px !important;
&.warn {
background-color: $yellow-2;
}
&:hover:not(.warn) {
&.primary {
background-color: $primary;
color: $white !important;
&.mat-button-disabled {
background-color: rgba($primary, 0.7);
}
}
&:hover:not(.warn):not(.primary) {
background-color: $grey-2;
}
}
.custom-mini-fab {
line-height: 16px !important;
width: 34px !important;
height: 34px !important;
.mat-button-wrapper {
line-height: 16px !important;
}
.mat-icon {
height: 16px !important;
width: 16px !important;
}
}

7
apps/red-ui/src/assets/styles/red-tooltips.scss
View File

@ -47,5 +47,10 @@
.mat-tooltip[style*='transform-origin: center bottom']:after {
top: 100%;
border-top: solid 6px $accent;
}
.mat-tooltip[style*='transform-origin: right center']:after {
top: 50%;
left: 100%;
transform: rotate(-90deg) translateY(3px) translateX(3px);
}