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

Merge remote-tracking branch 'origin/master' into new-state-concept

Browse Source
This commit is contained in:
Dan Percic 2021-10-03 13:14:46 +03:00
commit a94fea9f57
104 changed files with 211 additions and 1910 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/red-ui/src/app/app-routing.module.ts
View File

@ -1,6 +1,6 @@
import { AuthErrorComponent } from '@components/auth-error/auth-error.component';
import { AuthGuard } from './modules/auth/auth.guard';
import { CompositeRouteGuard } from '@guards/composite-route.guard';
import { CompositeRouteGuard, CustomRouteReuseStrategy } from '@iqser/common-ui';
import { RedRoleGuard } from './modules/auth/red-role.guard';
import { BaseScreenComponent } from '@components/base-screen/base-screen.component';
import { RouteReuseStrategy, RouterModule } from '@angular/router';
@ -8,7 +8,6 @@ import { NgModule } from '@angular/core';
import { DownloadsListScreenComponent } from '@components/downloads-list-screen/downloads-list-screen.component';
import { AppStateGuard } from '@state/app-state.guard';
import { UserProfileScreenComponent } from '@components/user-profile/user-profile-screen.component';
import { CustomRouteReuseStrategy } from '@utils/custom-route-reuse.strategy';
const routes = [
{

11
apps/red-ui/src/app/app.module.ts
View File

@ -14,7 +14,6 @@ import { ToastrModule } from 'ngx-toastr';
import { ServiceWorkerModule } from '@angular/service-worker';
import { environment } from '@environments/environment';
import { AuthModule } from './modules/auth/auth.module';
import { LogoComponent } from '@components/logo/logo.component';
import { AuthErrorComponent } from '@components/auth-error/auth-error.component';
import { ToastComponent } from '@components/toast/toast.component';
import { HttpCacheInterceptor } from '@redaction/red-cache';
@ -55,15 +54,7 @@ function cleanupBaseUrl(baseUrl: string) {
const screens = [BaseScreenComponent, DownloadsListScreenComponent, UserProfileScreenComponent];
const components = [
AppComponent,
LogoComponent,
AuthErrorComponent,
ToastComponent,
NotificationsComponent,
SpotlightSearchComponent,
...screens
];
const components = [AppComponent, AuthErrorComponent, ToastComponent, NotificationsComponent, SpotlightSearchComponent, ...screens];
@NgModule({
declarations: [...components],

172
apps/red-ui/src/app/components/base-screen/base-screen.component.html
View File

@ -1,87 +1,105 @@
<iqser-help-mode *ngIf="userPreferenceService.areDevFeaturesEnabled"></iqser-help-mode>
<div class="red-top-bar">
<div class="top-bar-row">
<div *ngIf="!currentUser.isUser" class="menu-placeholder"></div>
<div class="top-bar">
<div *ngIf="!currentUser.isUser" class="menu-placeholder"></div>
<div *ngIf="currentUser.isUser" class="menu flex-2 breadcrumbs-container">
<a *ngIf="(isDossiersView$ | async) === false" class="breadcrumb back" redactionNavigateLastDossiersScreen>
<mat-icon svgIcon="red:expand"></mat-icon>
{{ 'top-bar.navigation-items.back' | translate }}
<div *ngIf="currentUser.isUser" class="menu visible-lt-lg">
<button [matMenuTriggerFor]="menuNav" mat-flat-button>
<mat-icon svgIcon="red:menu"></mat-icon>
</button>
<mat-menu #menuNav="matMenu">
<button mat-menu-item routerLink="/main/dossiers" translate="top-bar.navigation-items.dossiers"></button>
<button *ngIf="appStateService.activeDossier" [routerLink]="'/main/dossiers/' + appStateService.activeDossierId" mat-menu-item>
{{ appStateService.activeDossier.dossierName }}
</button>
<button
*ngIf="appStateService.activeFile"
[routerLink]="'/main/dossiers/' + appStateService.activeDossierId + '/file/' + appStateService.activeFile.fileId"
mat-menu-item
>
{{ appStateService.activeFile.filename }}
</button>
</mat-menu>
</div>
<div *ngIf="currentUser.isUser" class="menu flex-2 visible-lg breadcrumbs-container">
<a *ngIf="(isDossiersView$ | async) === false" class="breadcrumb back" redactionNavigateLastDossiersScreen>
<mat-icon svgIcon="iqser:expand"></mat-icon>
{{ 'top-bar.navigation-items.back' | translate }}
</a>
<ng-container *ngIf="isDossiersView$ | async">
<a
[routerLinkActiveOptions]="{ exact: true }"
class="breadcrumb"
routerLink="/main/dossiers"
routerLinkActive="active"
translate="top-bar.navigation-items.dossiers"
></a>
<mat-icon *ngIf="appStateService.activeDossier" svgIcon="iqser:arrow-right"></mat-icon>
<a
*ngIf="appStateService.activeDossier"
[routerLinkActiveOptions]="{ exact: true }"
[routerLink]="'/main/dossiers/' + appStateService.activeDossierId"
class="breadcrumb"
routerLinkActive="active"
>
{{ appStateService.activeDossier.dossierName }}
</a>
<ng-container *ngIf="isDossiersView$ | async">
<a
[routerLinkActiveOptions]="{ exact: true }"
class="breadcrumb"
routerLink="/main/dossiers"
routerLinkActive="active"
translate="top-bar.navigation-items.dossiers"
></a>
<mat-icon *ngIf="appStateService.activeFile" svgIcon="iqser:arrow-right"></mat-icon>
<ng-container *ngIf="dossiersService.activeDossier$ | async as activeDossier">
<mat-icon svgIcon="red:arrow-right"></mat-icon>
<a
[routerLinkActiveOptions]="{ exact: true }"
[routerLink]="activeDossier.routerLink"
class="breadcrumb"
routerLinkActive="active"
>
{{ activeDossier.dossierName }}
</a>
</ng-container>
<ng-container *ngIf="appStateService.activeFile as activeFile">
<mat-icon svgIcon="red:arrow-right"></mat-icon>
<a [routerLink]="activeFile.routerLink" class="breadcrumb" routerLinkActive="active">
{{ activeFile.filename }}
</a>
</ng-container>
</ng-container>
</div>
<div class="center logo-wrapper">
<redaction-hidden-action (action)="userPreferenceService.toggleDevFeatures()">
<redaction-logo></redaction-logo>
</redaction-hidden-action>
<div class="app-name">{{ titleService.getTitle() }}</div>
</div>
<div class="menu right flex-2">
<div class="buttons">
<redaction-spotlight-search
*ngIf="(isSearchScreen$ | async) === false"
[actions]="searchActions"
[placeholder]="'search.placeholder' | translate"
iqserHelpMode="search"
></redaction-spotlight-search>
<redaction-notifications iqserHelpMode="notifications"></redaction-notifications>
</div>
<redaction-user-button
[matMenuTriggerFor]="userMenu"
[showDot]="fileDownloadService.hasPendingDownloads"
[userId]="currentUser.id"
iqserHelpMode="user-menu"
></redaction-user-button>
<mat-menu #userMenu="matMenu" xPosition="before">
<ng-container *ngFor="let item of userMenuItems; trackBy: trackByName">
<button (click)="(item.action)" *ngIf="item.show" [routerLink]="item.routerLink" mat-menu-item translate>
{{ item.name }}
</button>
</ng-container>
<button (click)="userService.logout()" mat-menu-item>
<mat-icon svgIcon="red:logout"></mat-icon>
<span translate="top-bar.navigation-items.my-account.children.logout"> </span>
</button>
</mat-menu>
</div>
<a
*ngIf="appStateService.activeFile"
[routerLink]="'/main/dossiers/' + appStateService.activeDossierId + '/file/' + appStateService.activeFile.fileId"
class="breadcrumb"
routerLinkActive="active"
>
{{ appStateService.activeFile.filename }}
</a>
</ng-container>
</div>
<div class="center">
<iqser-hidden-action (action)="userPreferenceService.toggleDevFeatures()">
<iqser-logo icon="red:logo"></iqser-logo>
</iqser-hidden-action>
<div class="app-name">{{ titleService.getTitle() }}</div>
</div>
<div class="menu right flex-2">
<div class="buttons">
<redaction-spotlight-search
*ngIf="(isSearchScreen$ | async) === false"
[actions]="searchActions"
[placeholder]="'search.placeholder' | translate"
iqserHelpMode="search"
></redaction-spotlight-search>
<redaction-notifications iqserHelpMode="notifications"></redaction-notifications>
</div>
<redaction-user-button
[matMenuTriggerFor]="userMenu"
[showDot]="fileDownloadService.hasPendingDownloads"
[userId]="currentUser.id"
iqserHelpMode="user-menu"
></redaction-user-button>
<mat-menu #userMenu="matMenu" xPosition="before">
<ng-container *ngFor="let item of userMenuItems; trackBy: trackByName">
<button (click)="(item.action)" *ngIf="item.show" [routerLink]="item.routerLink" mat-menu-item translate>
{{ item.name }}
</button>
</ng-container>
<button (click)="userService.logout()" mat-menu-item>
<mat-icon svgIcon="red:logout"></mat-icon>
<span translate="top-bar.navigation-items.my-account.children.logout"> </span>
</button>
</mat-menu>
</div>
<div class="divider"></div>
</div>
<div *ngIf="userPreferenceService.areDevFeaturesEnabled" class="dev-mode" translate="dev-mode"></div>

36
apps/red-ui/src/app/components/base-screen/base-screen.component.scss
View File

@ -1,39 +1,3 @@
@use 'variables';
.dev-mode {
background-color: variables.$primary;
color: variables.$white;
font-size: 22px;
line-height: 16px;
text-align: center;
position: fixed;
top: 0;
z-index: 100;
right: 0;
height: 61px;
word-break: break-all;
display: flex;
justify-content: center;
align-items: center;
font-family: monospace;
width: 24px;
font-weight: bold;
}
.menu-placeholder {
display: flex;
flex: 2;
}
.buttons {
display: flex;
margin-right: 8px;
> *:not(:last-child) {
margin-right: 2px;
}
}
redaction-spotlight-search {
margin-right: 16px !important;
}

7
apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.html
View File

@ -1,10 +1,7 @@
<section>
<redaction-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[showCloseButton]="true"
></redaction-page-header>
<iqser-page-header (closeAction)="routerHistoryService.navigateToLastDossiersScreen()" [showCloseButton]="true"></iqser-page-header>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
[bulkActions]="bulkActions"

1
apps/red-ui/src/app/components/logo/logo.component.html
View File

@ -1 +0,0 @@
<mat-icon svgIcon="red:logo"></mat-icon>

10
apps/red-ui/src/app/components/logo/logo.component.scss
View File

@ -1,10 +0,0 @@
@use 'variables';
:host {
color: variables.$primary;
}
mat-icon {
width: 28px;
height: 28px;
}

8
apps/red-ui/src/app/components/logo/logo.component.ts
View File

@ -1,8 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'redaction-logo',
templateUrl: './logo.component.html',
styleUrls: ['./logo.component.scss']
})
export class LogoComponent {}

2
apps/red-ui/src/app/components/spotlight-search/spotlight-search.component.html
View File

@ -4,7 +4,7 @@
[placeholder]="placeholder"
></iqser-input-with-action>
<mat-menu #menu="matMenu" xPosition="after">
<mat-menu #menu="matMenu" class="search-menu" xPosition="after">
<ng-template matMenuContent>
<div class="wrapper">
<button

2
apps/red-ui/src/app/components/spotlight-search/spotlight-search.component.scss
View File

@ -22,7 +22,7 @@
width: 300px;
}
::ng-deep .mat-menu-content {
::ng-deep.search-menu .mat-menu-content {
padding: 8px !important;
}

2
apps/red-ui/src/app/components/user-profile/user-profile-screen.component.html
View File

@ -1,4 +1,4 @@
<section class="red-content-inner">
<section class="content-inner">
<div class="content-container full-height">
<div class="overlay-shadow"></div>
<div class="dialog">

40
apps/red-ui/src/app/guards/composite-route.guard.ts
View File

@ -1,40 +0,0 @@
import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot, UrlTree } from '@angular/router';
import { Injectable, Injector } from '@angular/core';
import { from, of } from 'rxjs';
import { LoadingService } from '@iqser/common-ui';
@Injectable({
providedIn: 'root'
})
export class CompositeRouteGuard implements CanActivate {
constructor(protected readonly _injector: Injector, private readonly _loadingService: LoadingService) {}
async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
this._loadingService.start();
const routeGuards = route.data.routeGuards;
if (routeGuards) {
for (let i = 0; i < routeGuards.length; i++) {
const routeGuard = this._injector.get<CanActivate>(routeGuards[i]);
let canActivateResult = routeGuard.canActivate(route, state);
if (canActivateResult instanceof Promise) {
canActivateResult = from(canActivateResult);
}
if (typeof canActivateResult === 'boolean' || canActivateResult instanceof UrlTree) {
canActivateResult = of(canActivateResult);
}
const result = await canActivateResult.toPromise();
if (!result) {
this._loadingService.stop();
return false;
}
}
}
this._loadingService.stop();
return true;
}
}

2
apps/red-ui/src/app/modules/admin/admin-routing.module.ts
View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
import { AuthGuard } from '../auth/auth.guard';
import { CompositeRouteGuard } from '@guards/composite-route.guard';
import { CompositeRouteGuard } from '@iqser/common-ui';
import { RedRoleGuard } from '../auth/red-role.guard';
import { AppStateGuard } from '@state/app-state.guard';
import { DossierTemplatesListingScreenComponent } from './screens/dossier-template-listing/dossier-templates-listing-screen.component';

4
apps/red-ui/src/app/modules/admin/components/breadcrumbs/admin-breadcrumbs.component.html
View File

@ -7,7 +7,7 @@
></a>
<ng-container *ngIf="appStateService.activeDossierTemplate">
<mat-icon svgIcon="red:arrow-right"></mat-icon>
<mat-icon svgIcon="iqser:arrow-right"></mat-icon>
<a
[class.active]="!appStateService.activeDictionaryType"
[routerLink]="'/main/admin/dossier-templates/' + appStateService.activeDossierTemplateId"
@ -18,7 +18,7 @@
</ng-container>
<ng-container *ngIf="appStateService.activeDictionary">
<mat-icon svgIcon="red:arrow-right"></mat-icon>
<mat-icon svgIcon="iqser:arrow-right"></mat-icon>
<a
[routerLink]="
'/main/admin/dossier-templates/' +

4
apps/red-ui/src/app/modules/admin/components/users-stats/users-stats.component.html
View File

@ -2,7 +2,7 @@
<iqser-circle-button
(action)="toggleCollapse.emit()"
[tooltip]="'user-stats.expand' | translate"
icon="red:expand"
icon="iqser:expand"
tooltipPosition="before"
></iqser-circle-button>
<div class="all-caps-label" translate="user-stats.title"></div>
@ -13,7 +13,7 @@
<iqser-circle-button
(action)="toggleCollapse.emit()"
[tooltip]="'user-stats.collapse' | translate"
icon="red:collapse"
icon="iqser:collapse"
tooltipPosition="before"
></iqser-circle-button>
</div>

2
apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.html
View File

@ -128,7 +128,7 @@
<div [translate]="'file-attributes-csv-import.csv-column'" class="all-caps-label"></div>
<iqser-circle-button
(click)="previewExpanded = !previewExpanded"
[icon]="previewExpanded ? 'red:expand' : 'red:collapse'"
[icon]="previewExpanded ? 'iqser:expand' : 'iqser:collapse'"
></iqser-circle-button>
</div>
<div [class.hidden]="!previewExpanded" class="csv-part-content">

2
apps/red-ui/src/app/modules/admin/screens/audit/audit-screen.component.html
View File

@ -18,7 +18,7 @@
></iqser-circle-button>
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
[headerTemplate]="headerTemplate"

2
apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>

4
apps/red-ui/src/app/modules/admin/screens/dictionary-listing/dictionary-listing-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>
@ -71,7 +71,7 @@
*ngIf="currentUser.isAdmin"
[label]="'dictionary-listing.add-new' | translate"
[type]="iconButtonTypes.primary"
icon="red:plus"
icon="iqser:plus"
></iqser-icon-button>
</div>
</div>

2
apps/red-ui/src/app/modules/admin/screens/dictionary-overview/dictionary-overview-screen.component.html
View File

@ -48,7 +48,7 @@
</div>
</div>
<div class="flex red-content-inner">
<div class="flex content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>

10
apps/red-ui/src/app/modules/admin/screens/digital-signature/digital-signature-screen.component.html
View File

@ -4,13 +4,13 @@
<redaction-admin-side-nav type="settings"></redaction-admin-side-nav>
<div>
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[pageLabel]="'digital-signature' | translate"
[showCloseButton]="currentUser.isUser"
></redaction-page-header>
></iqser-page-header>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<div class="content-container-content">
<form *ngIf="digitalSignatureForm" [formGroup]="digitalSignatureForm" autocomplete="off">
@ -78,16 +78,16 @@
(action)="saveDigitalSignature()"
[disabled]="digitalSignatureForm.invalid"
[label]="'digital-signature-screen.action.save' | translate"
icon="iqser:check"
[type]="iconButtonTypes.primary"
icon="iqser:check"
></iqser-icon-button>
<iqser-icon-button
(action)="removeDigitalSignature()"
*ngIf="digitalSignatureExists"
[label]="'digital-signature-screen.action.delete' | translate"
icon="red:trash"
[type]="iconButtonTypes.primary"
icon="red:trash"
></iqser-icon-button>
<div

4
apps/red-ui/src/app/modules/admin/screens/dossier-attributes-listing/dossier-attributes-listing-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>
@ -59,7 +59,7 @@
*ngIf="currentUser.isAdmin"
[label]="'dossier-attributes-listing.add-new' | translate"
[type]="iconButtonTypes.primary"
icon="red:plus"
icon="iqser:plus"
></iqser-icon-button>
</div>
</ng-template>

8
apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.html
View File

@ -4,13 +4,13 @@
<redaction-admin-side-nav type="settings"></redaction-admin-side-nav>
<div>
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[pageLabel]="'dossier-templates' | translate"
[showCloseButton]="currentUser.isUser"
></redaction-page-header>
></iqser-page-header>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
[bulkActions]="bulkActions"
@ -56,7 +56,7 @@
*ngIf="currentUser.isAdmin && userPreferenceService.areDevFeaturesEnabled"
[label]="'dossier-templates-listing.add-new' | translate"
[type]="iconButtonTypes.primary"
icon="red:plus"
icon="iqser:plus"
></iqser-icon-button>
</div>
</ng-template>

4
apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>
@ -69,7 +69,7 @@
*ngIf="currentUser.isAdmin"
[label]="'file-attributes-listing.add-new' | translate"
[type]="iconButtonTypes.primary"
icon="red:plus"
icon="iqser:plus"
></iqser-icon-button>
</div>
</ng-template>

6
apps/red-ui/src/app/modules/admin/screens/general-config/general-config-screen.component.html
View File

@ -19,7 +19,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<div class="dialog mb-8">
<div class="dialog-header">
@ -40,17 +40,17 @@
</div>
<div class="inline-input-group flex-align-items-center">
<mat-slide-toggle formControlName="forgotPasswordFunctionEnabled" color="primary"></mat-slide-toggle>
<mat-slide-toggle color="primary" formControlName="forgotPasswordFunctionEnabled"></mat-slide-toggle>
<span class="ml-8" translate="general-config-screen.general.form.forgot-password"></span>
</div>
</div>
</div>
<div class="dialog-actions">
<button
type="submit"
[disabled]="configForm.invalid || !generalConfigurationChanged"
color="primary"
mat-flat-button
type="submit"
>
{{ 'general-config-screen.actions.save' | translate }}
</button>

6
apps/red-ui/src/app/modules/admin/screens/license-information/license-information-screen.component.html
View File

@ -4,14 +4,14 @@
<redaction-admin-side-nav type="settings"></redaction-admin-side-nav>
<div>
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[buttonConfigs]="buttonConfigs"
[pageLabel]="'license-information' | translate"
[showCloseButton]="currentUser.isUser"
></redaction-page-header>
></iqser-page-header>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<div class="grid-container">
<div class="row">

3
apps/red-ui/src/app/modules/admin/screens/license-information/license-information-screen.component.ts
View File

@ -3,8 +3,7 @@ import { LicenseReport, LicenseReportControllerService } from '@redaction/red-ui
import { ConfigService } from '@services/config.service';
import * as moment from 'moment';
import { TranslateService } from '@ngx-translate/core';
import { IconButtonTypes, LoadingService } from '@iqser/common-ui';
import { ButtonConfig } from '@shared/components/page-header/models/button-config.model';
import { ButtonConfig, IconButtonTypes, LoadingService } from '@iqser/common-ui';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { UserService } from '@services/user.service';
import { RouterHistoryService } from '@services/router-history.service';

2
apps/red-ui/src/app/modules/admin/screens/reports/reports-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>

4
apps/red-ui/src/app/modules/admin/screens/rules/rules-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>
@ -26,8 +26,8 @@
<iqser-icon-button
(action)="save()"
[label]="'rules-screen.save-changes' | translate"
icon="iqser:check"
[type]="iconButtonTypes.primary"
icon="iqser:check"
></iqser-icon-button>
<div (click)="revert()" class="all-caps-label cancel" translate="rules-screen.revert-changes"></div>
</div>

6
apps/red-ui/src/app/modules/admin/screens/trash/trash-screen.component.html
View File

@ -1,13 +1,13 @@
<section>
<div class="overlay-shadow"></div>
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[pageLabel]="'trash.label' | translate"
[showCloseButton]="true"
></redaction-page-header>
></iqser-page-header>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
[bulkActions]="bulkActions"

4
apps/red-ui/src/app/modules/admin/screens/user-listing/user-listing-screen.component.html
View File

@ -17,7 +17,7 @@
*ngIf="currentUser.isUserAdmin"
[label]="'user-listing.add-new' | translate"
[type]="iconButtonTypes.primary"
icon="red:plus"
icon="iqser:plus"
></iqser-icon-button>
<iqser-circle-button
*ngIf="currentUser.isUser"
@ -30,7 +30,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div [class.extended]="collapsedDetails" class="content-container">
<iqser-table
[bulkActions]="bulkActions"

2
apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen.component.html
View File

@ -14,7 +14,7 @@
</div>
</div>
<div class="red-content-inner">
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>

2
apps/red-ui/src/app/modules/dossier/components/comments/comments.component.html
View File

@ -25,7 +25,7 @@
*ngIf="permissionsService.canAddComment()"
[placeholder]="'comments.add-comment' | translate"
autocomplete="off"
icon="red:collapse"
icon="iqser:collapse"
width="full"
></iqser-input-with-action>

2
apps/red-ui/src/app/modules/dossier/components/file-workload/file-workload.component.html
View File

@ -32,7 +32,7 @@
<mat-progress-bar [mode]="'indeterminate'" class="w-100"></mat-progress-bar>
</div>
<div class="flex-center">
<mat-icon class="red-white" svgIcon="red:read-only"></mat-icon>
<mat-icon class="primary-white" svgIcon="red:read-only"></mat-icon>
<span class="read-only-text" translate="readonly"></span>
</div>
</div>

2
apps/red-ui/src/app/modules/dossier/components/file-workload/file-workload.component.scss
View File

@ -19,7 +19,7 @@
height: 14px;
width: 14px;
&.red-white {
&.primary-white {
padding-right: 8px;
}
}

4
apps/red-ui/src/app/modules/dossier/components/file-workload/file-workload.component.ts
View File

@ -8,7 +8,7 @@ import { FileDataModel } from '@models/file/file-data.model';
import { PermissionsService } from '@services/permissions.service';
import { WebViewerInstance } from '@pdftron/webviewer';
import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { map } from 'rxjs/operators';
const COMMAND_KEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Escape'];
const ALL_HOTKEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
@ -43,10 +43,10 @@ export class FileWorkloadComponent {
@Output() readonly actionPerformed = new EventEmitter<string>();
displayedPages: number[] = [];
pagesPanelActive = true;
readonly displayedAnnotations$: Observable<Map<number, AnnotationWrapper[]>>;
private _annotations$ = new BehaviorSubject<AnnotationWrapper[]>([]);
@ViewChild('annotationsElement') private readonly _annotationsElement: ElementRef;
@ViewChild('quickNavigation') private readonly _quickNavigationElement: ElementRef;
readonly displayedAnnotations$: Observable<Map<number, AnnotationWrapper[]>>;
constructor(
private readonly _permissionsService: PermissionsService,

13
apps/red-ui/src/app/modules/dossier/dialogs/remove-annotations-dialog/remove-annotations-dialog.component.scss
View File

@ -1,3 +1,5 @@
@use 'variables';
.content-wrapper {
padding-top: 20px;
padding-bottom: 8px;
@ -8,3 +10,14 @@ ul {
padding-top: 4px;
}
}
.default-table {
border-collapse: collapse;
th,
td {
padding: 8px;
text-align: left;
border: 1px solid variables.$separator;
}
}

2
apps/red-ui/src/app/modules/dossier/dossiers-routing.module.ts
View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { CompositeRouteGuard } from '@guards/composite-route.guard';
import { CompositeRouteGuard } from '@iqser/common-ui';
import { AuthGuard } from '../auth/auth.guard';
import { RedRoleGuard } from '../auth/red-role.guard';
import { AppStateGuard } from '@state/app-state.guard';

2
apps/red-ui/src/app/modules/dossier/screens/dossier-overview/components/dossier-details-stats/dossier-details-stats.component.scss
View File

@ -1,5 +1,5 @@
@use 'variables';
@use 'red-components';
@use 'common-components';
@use 'common-texts';
:host {

2
apps/red-ui/src/app/modules/dossier/screens/dossier-overview/components/dossier-details/dossier-details.component.html
View File

@ -83,7 +83,7 @@
<ng-template #collapsible let-action="action" let-tooltip="tooltip">
<iqser-circle-button
(action)="toggleCollapse.emit()"
[icon]="'red:' + action"
[icon]="'iqser:' + action"
[tooltip]="tooltip"
tooltipPosition="before"
></iqser-circle-button>

7
apps/red-ui/src/app/modules/dossier/screens/dossier-overview/screen/dossier-overview-screen.component.html
View File

@ -1,8 +1,7 @@
<section *ngIf="!!currentDossier">
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[actionConfigs]="actionConfigs"
[fileAttributeConfigs]="fileAttributeConfigs"
[showCloseButton]="true"
[viewModeSelection]="viewModeSelection"
>
@ -30,11 +29,11 @@
icon="red:upload"
tooltipPosition="below"
></iqser-circle-button>
</redaction-page-header>
</iqser-page-header>
<div class="overlay-shadow"></div>
<div class="red-content-inner">
<div class="content-inner">
<div [class.extended]="collapsedDetails" class="content-container">
<iqser-table
(noDataAction)="fileInput.click()"

6
apps/red-ui/src/app/modules/dossier/screens/dossier-overview/screen/dossier-overview-screen.component.ts
View File

@ -23,16 +23,18 @@ import { File } from '@models/file/file';
import { UserService } from '@services/user.service';
import { timer } from 'rxjs';
import { tap } from 'rxjs/operators';
import { convertFiles, Files, handleFileDrop, OnAttach, OnDetach } from '@utils/index';
import { convertFiles, Files, handleFileDrop } from '@utils/index';
import { DossiersDialogService } from '../../../services/dossiers-dialog.service';
import { ActionConfig } from '@shared/components/page-header/models/action-config.model';
import {
ActionConfig,
CircleButtonTypes,
DefaultListingServices,
ListingComponent,
ListingModes,
LoadingService,
NestedFilter,
OnAttach,
OnDetach,
TableColumnConfig,
TableComponent,
Toaster,

5
apps/red-ui/src/app/modules/dossier/screens/dossiers-listing/config.service.ts
View File

@ -1,11 +1,10 @@
import { Injectable, TemplateRef } from '@angular/core';
import { IFilterGroup, keyChecker, NestedFilter, TableColumnConfig } from '@iqser/common-ui';
import { ButtonConfig, IFilterGroup, keyChecker, NestedFilter, TableColumnConfig } from '@iqser/common-ui';
import { Dossier } from '@state/model/dossier';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { TranslateService } from '@ngx-translate/core';
import { UserPreferenceService } from '@services/user-preference.service';
import { UserService } from '@services/user.service';
import { ButtonConfig } from '@shared/components/page-header/models/button-config.model';
import { User } from '@models/user';
import { fileStatusTranslations } from '../../translations/file-status-translations';
import {
@ -78,7 +77,7 @@ export class ConfigService {
label: _('dossier-listing.add-new'),
action: addDossier,
hide: !this._currentUser.isManager,
icon: 'red:plus',
icon: 'iqser:plus',
type: 'primary'
}
];

4
apps/red-ui/src/app/modules/dossier/screens/dossiers-listing/screen/dossiers-listing-screen.component.html
View File

@ -1,9 +1,9 @@
<section>
<redaction-page-header [buttonConfigs]="buttonConfigs"></redaction-page-header>
<iqser-page-header [buttonConfigs]="buttonConfigs"></iqser-page-header>
<div class="overlay-shadow"></div>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
(noDataAction)="openAddDossierDialog()"

4
apps/red-ui/src/app/modules/dossier/screens/dossiers-listing/screen/dossiers-listing-screen.component.ts
View File

@ -10,8 +10,8 @@ import { timer } from 'rxjs';
import { tap } from 'rxjs/operators';
import { Router } from '@angular/router';
import { DossiersDialogService } from '../../../services/dossiers-dialog.service';
import { groupBy, OnAttach, OnDetach, StatusSorter } from '@utils/index';
import { EntitiesService, FilterService, ListingComponent, SearchService, SortingService, TableComponent } from '@iqser/common-ui';
import { groupBy, StatusSorter } from '@utils/index';
import { DefaultListingServices, ListingComponent, OnAttach, OnDetach, TableComponent } from '@iqser/common-ui';
import { fileStatusTranslations } from '../../../translations/file-status-translations';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { ConfigService } from '../config.service';

2
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
View File

@ -129,7 +129,7 @@
<div class="overlay-shadow"></div>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<redaction-pdf-viewer
(annotationSelected)="handleAnnotationSelected($event)"

3
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts
View File

@ -10,6 +10,8 @@ import {
FilterService,
INestedFilter,
LoadingService,
OnAttach,
OnDetach,
processFilters,
Toaster
} from '@iqser/common-ui';
@ -32,7 +34,6 @@ import { download } from '@utils/file-download-utils';
import { ViewMode } from '@models/file/view-mode';
import { FileWorkloadComponent } from '../../components/file-workload/file-workload.component';
import { DossiersDialogService } from '../../services/dossiers-dialog.service';
import { OnAttach, OnDetach } from '@utils/custom-route-reuse.strategy';
import { clearStamps, stampPDFPage } from '@utils/page-stamper';
import { TranslateService } from '@ngx-translate/core';
import { fileStatusTranslations } from '../../translations/file-status-translations';

6
apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.html
View File

@ -1,15 +1,15 @@
<section *ngIf="searchResults$ | async">
<redaction-page-header
<iqser-page-header
(closeAction)="routerHistoryService.navigateToLastDossiersScreen()"
[searchPlaceholder]="'search.placeholder' | translate"
[searchPosition]="searchPositions.beforeFilters"
[searchWidth]="600"
[showCloseButton]="true"
></redaction-page-header>
></iqser-page-header>
<div class="overlay-shadow"></div>
<div class="red-content-inner">
<div class="content-inner">
<div class="content-container">
<iqser-table
[hasScrollButton]="true"

2
apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.ts
View File

@ -6,6 +6,7 @@ import {
ListingComponent,
LoadingService,
NestedFilter,
SearchPositions,
TableColumnConfig
} from '@iqser/common-ui';
import { List, MatchedDocument, SearchControllerService, SearchResult } from '@redaction/red-ui-http';
@ -14,7 +15,6 @@ import { debounceTime, map, skip, switchMap, tap } from 'rxjs/operators';
import { ActivatedRoute, Router } from '@angular/router';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { fileStatusTranslations } from '../../translations/file-status-translations';
import { SearchPositions } from '@shared/components/page-header/models/search-positions.type';
import { TranslateService } from '@ngx-translate/core';
import { RouterHistoryService } from '@services/router-history.service';
import { DossiersService } from '../../services/dossiers.service';

2
apps/red-ui/src/app/modules/dossier/shared/components/file-actions/file-actions.component.html
View File

@ -15,7 +15,7 @@
[tooltipPosition]="tooltipPosition"
[tooltip]="'dossier-overview.open-document' | translate"
[type]="buttonType"
icon="red:collapse"
icon="iqser:collapse"
></iqser-circle-button>
<iqser-circle-button

8
apps/red-ui/src/app/modules/icons/icons.module.ts
View File

@ -15,14 +15,12 @@ export class IconsModule {
'ai',
'analyse',
'approved',
'arrow-right',
'arrow-up',
'assign',
'assign-me',
'attribute',
'calendar',
'case-sensitive',
'collapse',
'color-picker',
'comment',
'comment-fill',
@ -34,7 +32,6 @@ export class IconsModule {
'enter',
'exclude-pages',
'exit-fullscreen',
'expand',
'folder',
'fullscreen',
'html-file',
@ -53,11 +50,8 @@ export class IconsModule {
'ocr',
'page',
'pages',
'plus',
'preview',
'put-back',
'radio-indeterminate',
'radio-selected',
'read-only',
'ready-for-approval',
'reason',
@ -66,8 +60,6 @@ export class IconsModule {
'rule',
'secret',
'status',
'status-collapse',
'status-expand',
'status-info',
'template',
'thumb-down',

3
apps/red-ui/src/app/modules/shared/components/buttons/user-button/user-button.component.scss
View File

@ -1,6 +1,9 @@
@use 'variables';
@use 'common-buttons';
:host {
@extend .user-button;
button {
padding: 0 10px 0 5px;

3
apps/red-ui/src/app/modules/shared/components/hidden-action/hidden-action.component.html
View File

@ -1,3 +0,0 @@
<div (click)="countActions()">
<ng-content></ng-content>
</div>

0
apps/red-ui/src/app/modules/shared/components/hidden-action/hidden-action.component.scss
View File

25
apps/red-ui/src/app/modules/shared/components/hidden-action/hidden-action.component.ts
View File

@ -1,25 +0,0 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'redaction-hidden-action',
templateUrl: './hidden-action.component.html',
styleUrls: ['./hidden-action.component.scss']
})
export class HiddenActionComponent {
@Input() requiredClicks = 4;
@Output() action = new EventEmitter();
private _clickCount = 0;
private _clickCountTimeout: any;
countActions() {
this._clickCount += 1;
if (this._clickCount === this.requiredClicks) {
this._clickCount = 0;
this.action.emit();
}
clearTimeout(this._clickCountTimeout);
this._clickCountTimeout = setTimeout(() => {
this._clickCount = 0;
}, 1000);
}
}

4
apps/red-ui/src/app/modules/shared/components/initials-avatar/initials-avatar.component.ts
View File

@ -44,7 +44,7 @@ export class InitialsAvatarComponent extends AutoUnsubscribe implements OnChange
private get _colorClass() {
if (this._isCurrentUser) {
return 'red-white';
return 'primary-white';
}
if (this.disabled) {
return 'inactive';
@ -65,7 +65,7 @@ export class InitialsAvatarComponent extends AutoUnsubscribe implements OnChange
if (isSystemUser) {
this.displayName = 'System';
this.initials = 'SY';
this.colorClass = 'red-white red';
this.colorClass = 'primary-white primary';
return;
}

5
apps/red-ui/src/app/modules/shared/components/page-header/models/action-config.model.ts
View File

@ -1,5 +0,0 @@
import { BaseHeaderConfig } from './base-config.model';
export interface ActionConfig extends BaseHeaderConfig {
readonly action: ($event: MouseEvent) => void;
}

5
apps/red-ui/src/app/modules/shared/components/page-header/models/base-config.model.ts
View File

@ -1,5 +0,0 @@
export interface BaseHeaderConfig {
readonly label: string;
readonly icon?: string;
readonly hide?: boolean;
}

6
apps/red-ui/src/app/modules/shared/components/page-header/models/button-config.model.ts
View File

@ -1,6 +0,0 @@
import { IconButtonType } from '@iqser/common-ui';
import { ActionConfig } from '@shared/components/page-header/models/action-config.model';
export interface ButtonConfig extends ActionConfig {
readonly type?: IconButtonType;
}

6
apps/red-ui/src/app/modules/shared/components/page-header/models/search-positions.type.ts
View File

@ -1,6 +0,0 @@
export const SearchPositions = {
beforeFilters: 'beforeFilters',
afterFilters: 'afterFilters'
} as const;
export type SearchPosition = keyof typeof SearchPositions;

64
apps/red-ui/src/app/modules/shared/components/page-header/page-header.component.html
View File

@ -1,64 +0,0 @@
<div class="page-header">
<div *ngIf="pageLabel" class="breadcrumb">{{ pageLabel }}</div>
<div *ngIf="filters$ | async as filters" class="filters" iqserHelpMode="filters">
<div *ngIf="filters.length && searchPosition !== searchPositions.beforeFilters" translate="filters.filter-by"></div>
<ng-container *ngIf="searchPosition === searchPositions.beforeFilters" [ngTemplateOutlet]="searchBar"></ng-container>
<ng-container *ngFor="let config of filters; trackBy: trackByLabel">
<iqser-popup-filter *ngIf="!config.hide" [primaryFiltersSlug]="config.slug"></iqser-popup-filter>
</ng-container>
<ng-container *ngIf="searchPosition === searchPositions.afterFilters" [ngTemplateOutlet]="searchBar"></ng-container>
<div (click)="resetFilters()" *ngIf="showResetFilters$ | async" class="reset-filters" translate="reset-filters"></div>
</div>
<div *ngIf="showCloseButton || actionConfigs || buttonConfigs || viewModeSelection" class="actions">
<ng-container [ngTemplateOutlet]="viewModeSelection"></ng-container>
<ng-container *ngFor="let config of buttonConfigs; trackBy: trackByLabel">
<iqser-icon-button
(action)="config.action($event)"
*ngIf="!config.hide"
[icon]="config.icon"
[label]="config.label | translate"
[type]="config.type"
iqserHelpMode="new-dossier"
></iqser-icon-button>
</ng-container>
<ng-container *ngFor="let config of actionConfigs; trackBy: trackByLabel">
<iqser-circle-button
(action)="config.action($event)"
*ngIf="!config.hide"
[icon]="config.icon"
[tooltip]="config.label"
tooltipPosition="below"
></iqser-circle-button>
</ng-container>
<!-- Extra custom actions here -->
<ng-content></ng-content>
<iqser-circle-button
(action)="closeAction.emit()"
*ngIf="showCloseButton"
[class.ml-6]="actionConfigs"
[tooltip]="'common.close' | translate"
icon="iqser:close"
tooltipPosition="below"
></iqser-circle-button>
</div>
</div>
<ng-template #searchBar>
<iqser-input-with-action
*ngIf="searchPlaceholder && searchService"
[(value)]="searchService.searchValue"
[class.mr-8]="searchPosition === searchPositions.beforeFilters"
[placeholder]="searchPlaceholder"
[width]="searchWidth"
></iqser-input-with-action>
</ng-template>

5
apps/red-ui/src/app/modules/shared/components/page-header/page-header.component.scss
View File

@ -1,5 +0,0 @@
@import '../../../../../assets/styles/variables';
.ml-6 {
margin-left: 6px;
}

54
apps/red-ui/src/app/modules/shared/components/page-header/page-header.component.ts
View File

@ -1,54 +0,0 @@
import { Component, EventEmitter, Input, Optional, Output, TemplateRef } from '@angular/core';
import { ActionConfig } from '@shared/components/page-header/models/action-config.model';
import { ButtonConfig } from '@shared/components/page-header/models/button-config.model';
import { FilterService, IconButtonTypes, IListable, SearchService } from '@iqser/common-ui';
import { distinctUntilChanged, map } from 'rxjs/operators';
import { combineLatest, Observable, of } from 'rxjs';
import { SearchPosition, SearchPositions } from '@shared/components/page-header/models/search-positions.type';
import { IFileAttributeConfig } from '@redaction/red-ui-http';
@Component({
selector: 'redaction-page-header',
templateUrl: './page-header.component.html',
styleUrls: ['./page-header.component.scss']
})
export class PageHeaderComponent<T extends IListable> {
readonly searchPositions = SearchPositions;
readonly iconButtonTypes = IconButtonTypes;
@Input() pageLabel: string;
@Input() showCloseButton: boolean;
@Input() actionConfigs: readonly ActionConfig[];
@Input() buttonConfigs: readonly ButtonConfig[];
@Input() fileAttributeConfigs: readonly IFileAttributeConfig[];
@Input() viewModeSelection: TemplateRef<unknown>;
@Input() searchPlaceholder: string;
@Input() searchWidth: number | 'full';
@Input() searchPosition: SearchPosition = SearchPositions.afterFilters;
@Output() readonly closeAction = new EventEmitter();
readonly filters$ = this.filterService?.filterGroups$.pipe(map(all => all.filter(f => f.icon)));
readonly showResetFilters$ = this._showResetFilters$;
constructor(@Optional() readonly filterService: FilterService, @Optional() readonly searchService: SearchService<T>) {}
get _showResetFilters$(): Observable<boolean> {
if (!this.filterService) {
return of(false);
}
return combineLatest([this.filterService.showResetFilters$, this.searchService.valueChanges$]).pipe(
map(([showResetFilters, searchValue]) => showResetFilters || !!searchValue),
distinctUntilChanged()
);
}
resetFilters(): void {
this.filterService.reset();
this.searchService.reset();
}
trackByLabel<K extends { label?: string }>(index: number, item: K): string {
return item.label;
}
}

4
apps/red-ui/src/app/modules/shared/components/team-members/team-members.component.html
View File

@ -20,9 +20,9 @@
[class.large-spacing]="largeSpacing"
[size]="32"
[tooltip]="'dossier-details.assign-members' | translate"
class="member"
icon="red:plus"
[type]="circleButtonTypes.primary"
class="member"
icon="iqser:plus"
></iqser-circle-button>
</div>
<div (click)="toggleExpandedTeam()" *ngIf="expandedTeam" class="all-caps-label see-less pointer" translate="dossier-details.see-less"></div>

4
apps/red-ui/src/app/modules/shared/shared.module.ts
View File

@ -11,7 +11,6 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AnnotationIconComponent } from './components/annotation-icon/annotation-icon.component';
import { SimpleDoughnutChartComponent } from './components/simple-doughnut-chart/simple-doughnut-chart.component';
import { DictionaryAnnotationIconComponent } from './components/dictionary-annotation-icon/dictionary-annotation-icon.component';
import { HiddenActionComponent } from './components/hidden-action/hidden-action.component';
import { ConfirmationDialogComponent } from './dialogs/confirmation-dialog/confirmation-dialog.component';
import { CommonUiModule } from '@iqser/common-ui';
import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
@ -22,7 +21,6 @@ import { DictionaryManagerComponent } from './components/dictionary-manager/dict
import { SideNavComponent } from './components/side-nav/side-nav.component';
import { MonacoEditorModule } from '@materia-ui/ngx-monaco-editor';
import { AssignUserDropdownComponent } from './components/assign-user-dropdown/assign-user-dropdown.component';
import { PageHeaderComponent } from './components/page-header/page-header.component';
import { DatePipe } from './pipes/date.pipe';
import { LongPressDirective } from './directives/long-press.directive';
import { NamePipe } from './pipes/name.pipe';
@ -37,13 +35,11 @@ const components = [
AnnotationIconComponent,
SimpleDoughnutChartComponent,
DictionaryAnnotationIconComponent,
HiddenActionComponent,
ConfirmationDialogComponent,
SelectComponent,
SideNavComponent,
DictionaryManagerComponent,
AssignUserDropdownComponent,
PageHeaderComponent,
TypeFilterComponent,
TeamMembersComponent,

6
apps/red-ui/src/app/modules/upload-download/upload-status-overlay/upload-status-overlay.component.html
View File

@ -3,7 +3,7 @@
<div class="title flex-1">
{{ 'upload-status.dialog.title' | translate: { len: uploadService.files.length } }}
</div>
<iqser-circle-button [icon]="'red:status-' + (collapsed ? 'expand' : 'collapse')"></iqser-circle-button>
<iqser-circle-button [icon]="'iqser:status-' + (collapsed ? 'expand' : 'collapse')"></iqser-circle-button>
<iqser-circle-button (action)="closeDialog()" icon="iqser:close"></iqser-circle-button>
</div>
<div [hidden]="collapsed" class="upload-download-list">
@ -43,16 +43,16 @@
(action)="uploadItem(model)"
*ngIf="model.error && !model.sizeError"
[tooltip]="'upload-status.dialog.actions.re-upload' | translate"
[type]="circleButtonTypes.dark"
icon="iqser:refresh"
tooltipPosition="before"
[type]="circleButtonTypes.dark"
></iqser-circle-button>
<iqser-circle-button
(action)="cancelItem(model)"
[tooltip]="'upload-status.dialog.actions.cancel' | translate"
[type]="circleButtonTypes.dark"
icon="iqser:close"
tooltipPosition="before"
[type]="circleButtonTypes.dark"
></iqser-circle-button>
</div>
</div>

83
apps/red-ui/src/app/utils/custom-route-reuse.strategy.ts
View File

@ -1,83 +0,0 @@
import { ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy } from '@angular/router';
import { Debounce } from '@iqser/common-ui';
export interface OnAttach {
ngOnAttach(previousRoute: ActivatedRouteSnapshot);
}
export interface OnDetach {
ngOnDetach();
}
interface RouteStorageObject {
handle: DetachedRouteHandle;
previousRoute: ActivatedRouteSnapshot;
}
export class CustomRouteReuseStrategy implements RouteReuseStrategy {
private _storedRoutes: { [key: string]: RouteStorageObject } = {};
private static _removeTooltips(): void {
while (document.getElementsByTagName('mat-tooltip-component').length > 0) {
document.getElementsByTagName('mat-tooltip-component')[0].remove();
}
}
shouldDetach(route: ActivatedRouteSnapshot): boolean {
return !!route.routeConfig.data?.reuse && !!this._getKey(route);
}
store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
if (handle === null) {
return;
}
CustomRouteReuseStrategy._removeTooltips();
const element: any = handle;
if (element?.componentRef?.instance?.ngOnDetach) {
this._onDetach(element.componentRef?.instance);
}
this._storedRoutes[this._getKey(route)] = {
handle: element as DetachedRouteHandle,
previousRoute: route
};
}
shouldAttach(route: ActivatedRouteSnapshot): boolean {
return !!this._storedRoutes[this._getKey(route)];
}
retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
const key = this._getKey(route);
const element: any = this._storedRoutes[key]?.handle;
if (element?.componentRef?.instance?.ngOnAttach) {
this._onAttach(element.componentRef?.instance, this._storedRoutes[key].previousRoute);
}
return element as DetachedRouteHandle;
}
shouldReuseRoute(future: ActivatedRouteSnapshot, current: ActivatedRouteSnapshot): boolean {
return future.routeConfig === current.routeConfig || this._getKey(future) === this._getKey(current);
}
private _getKey(route: ActivatedRouteSnapshot): string {
return route.pathFromRoot
.map((el: ActivatedRouteSnapshot) => (el.routeConfig ? el.routeConfig.path + JSON.stringify(el.params) : ''))
.filter(str => str.length > 0)
.join('');
}
@Debounce()
private _onAttach(instance: OnAttach, previousRoute?: ActivatedRouteSnapshot) {
instance.ngOnAttach(previousRoute);
}
@Debounce()
private _onDetach(instance: OnDetach) {
instance.ngOnDetach();
}
}

1
apps/red-ui/src/app/utils/index.ts
View File

@ -4,7 +4,6 @@ export * from './sorters/super-type-sorter';
export * from './api-path-interceptor';
export * from './configuration.initializer';
export * from './custom-route-reuse.strategy';
export * from './date-inputs-utils';
export * from './file-download-utils';
export * from './file-drop-utils';

BIN
apps/red-ui/src/assets/font/Inter-VariableFont.ttf
View File

Binary file not shown.

BIN
apps/red-ui/src/assets/font/OpenSans-ExtraBold.ttf
View File

Binary file not shown.

9
apps/red-ui/src/assets/icons/general/arrow-right.svg
View File

@ -1,9 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="14px" version="1.1" viewBox="0 0 14 14" width="14px"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd" id="right_expandable" stroke="none" stroke-width="1">
<polygon fill="currentColor" id="Fill-1"
points="7 9 10 5 4 5"
transform="translate(7.000000, 7.000000) rotate(-90.000000) translate(-7.000000, -7.000000) "></polygon>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 465 B

18
apps/red-ui/src/assets/icons/general/collapse.svg
View File

@ -1,18 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="14px" version="1.1" viewBox="0 0 14 14" width="14px"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd" id="Dossiers-&amp;-Documents" stroke="none" stroke-width="1">
<g id="04.-Document-Hover" transform="translate(-1400.000000, -137.000000)">
<rect height="980" width="1440" x="0" y="0"></rect>
<g fill="currentColor" fill-rule="nonzero" id="Dossier-details"
transform="translate(1111.000000, 127.000000)">
<g id="Group-6" transform="translate(279.000000, 0.000000)">
<g id="status" transform="translate(10.000000, 10.000000)">
<polygon id="Path"
points="9.17 3.5 8.19 4.48 9.94 6.3 1.4 6.3 1.4 7.7 9.94 7.7 8.19 9.52 9.17 10.5 12.6 7"></polygon>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 960 B

20
apps/red-ui/src/assets/icons/general/expand.svg
View File

@ -1,20 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="14px" version="1.1" viewBox="0 0 14 14" width="14px"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd" id="Dossiers-&amp;-Documents" stroke="none" stroke-width="1">
<g id="04.-Collapsed-Details" transform="translate(-1403.000000, -137.000000)">
<rect height="980" width="1440" x="0" y="0"></rect>
<rect height="1500" id="Rectangle" width="60" x="1380" y="111"></rect>
<g id="Group-6" transform="translate(1393.000000, 127.000000)">
<rect height="34" id="Rectangle" rx="17" width="34" x="0" y="0"></rect>
<g fill="currentColor"
fill-rule="nonzero"
id="status"
transform="translate(17.000000, 17.000000) scale(-1, 1) translate(-17.000000, -17.000000) translate(10.000000, 10.000000)">
<polygon id="Path"
points="9.17 3.5 8.19 4.48 9.94 6.3 1.4 6.3 1.4 7.7 9.94 7.7 8.19 9.52 9.17 10.5 12.6 7"></polygon>
</g>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.1 KiB

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

@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="100px" version="1.1" viewBox="0 0 100 100" width="100px"
xmlns="http://www.w3.org/2000/svg">
<g fill="currentColor" fill-rule="evenodd" id="plus_white" stroke="none" stroke-width="1">
<polygon fill-rule="nonzero" id="Path"
points="78 45 55 45 55 22 45 22 45 45 22 45 22 55 45 55 45 78 55 78 55 55 78 55"></polygon>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 417 B

15
apps/red-ui/src/assets/icons/general/radio-indeterminate.svg
View File

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="20px" version="1.1" viewBox="0 0 20 20" width="20px"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd" id="Bulk-Actions" stroke="none" stroke-width="1">
<g id="01.-Bulk-Actions" transform="translate(-10.000000, -127.000000)">
<rect fill="none" height="980" width="1440" x="0" y="0"></rect>
<polygon fill="none" id="Rectangle" points="0 112 1086 112 1086 162 0 162"></polygon>
<g fill="currentColor" id="intermediary_selection"
transform="translate(10.000000, 127.000000)">
<path
d="M10,0 C15.5228475,0 20,4.4771525 20,10 C20,15.5228475 15.5228475,20 10,20 C4.4771525,20 0,15.5228475 0,10 C0,4.4771525 4.4771525,0 10,0 Z M14,8.9 L6,8.9 C5.44771525,8.9 5,9.34771525 5,9.9 L5,9.9 L5,10.1 C5,10.6522847 5.44771525,11.1 6,11.1 L6,11.1 L14,11.1 C14.5522847,11.1 15,10.6522847 15,10.1 L15,10.1 L15,9.9 C15,9.34771525 14.5522847,8.9 14,8.9 L14,8.9 Z"></path>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 KiB

17
apps/red-ui/src/assets/icons/general/radio-selected.svg
View File

@ -1,17 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="20px" version="1.1" viewBox="0 0 20 20" width="20px"
xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd" id="Bulk-Actions" stroke="none" stroke-width="1">
<g id="01.-Bulk-Actions" transform="translate(-10.000000, -209.000000)">
<rect fill="none" height="980" width="1440" x="0" y="0"></rect>
<g fill="none" id="Entry" transform="translate(0.000000, 194.000000)">
<polygon id="Rectangle" points="0 0 1086 0 1086 50 0 50"></polygon>
</g>
<g fill="currentColor" id="Radio_selected" transform="translate(10.000000, 209.000000)">
<path
d="M10,0 C15.5228475,0 20,4.4771525 20,10 C20,15.5228475 15.5228475,20 10,20 C4.4771525,20 0,15.5228475 0,10 C0,4.4771525 4.4771525,0 10,0 Z M13.6545842,6.07220062 L8.50054373,11.3199291 L6.58289039,9.38262084 C6.34328715,9.14059736 5.95224003,9.14059736 5.71263679,9.38262084 L5.06605523,10.0357335 C4.82983344,10.2743414 4.82983344,10.6586767 5.06605523,10.8972846 L8.06804104,13.9295935 C8.30826653,14.1722455 8.70055256,14.1715218 8.93988111,13.9279851 L15.1747747,7.58346184 C15.4094976,7.34461174 15.4087908,6.96150162 15.1731882,6.72351919 L14.5266067,6.07040651 C14.2863095,5.82768204 13.8938806,5.82848943 13.6545842,6.07220062 Z"
id="radio_selected"></path>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.4 KiB

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

@ -1,41 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="15px" version="1.1" viewBox="0 0 15 15" width="15px" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path
d="M1028,576 L1412,576 C1416.41828,576 1420,579.581722 1420,584 L1420,873 C1420,877.418278 1416.41828,881 1412,881 L1028,881 C1023.58172,881 1020,877.418278 1020,873 L1020,584 C1020,579.581722 1023.58172,576 1028,576 Z"
id="path-1"></path>
<filter filterUnits="objectBoundingBox" height="117.7%" id="filter-3" width="113.5%"
x="-6.8%" y="-7.9%">
<feMorphology in="SourceAlpha" operator="dilate" radius="2.5"
result="shadowSpreadOuter1"></feMorphology>
<feOffset dx="0" dy="3" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
<feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1"
stdDeviation="6"></feGaussianBlur>
<feColorMatrix in="shadowBlurOuter1"
type="matrix"
values="0 0 0 0 0.156862745 0 0 0 0 0.196078431 0 0 0 0 0.254901961 0 0 0 0.1428069 0"></feColorMatrix>
</filter>
</defs>
<g fill="none" fill-rule="evenodd" id="File-Upload-&amp;-Download-Overlays" stroke="none"
stroke-width="1">
<g id="Document-Upload---Hover" transform="translate(-1360.000000, -592.000000)">
<rect height="900" width="1440" x="0" y="0"></rect>
<g id="Dossier-details" transform="translate(1111.000000, 127.000000)">
<g id="Group-4" transform="translate(0.000000, 145.000000)"></g>
</g>
<g id="Rectangle">
<use fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
<use fill-rule="evenodd" xlink:href="#path-1"></use>
</g>
<g id="Group-6-Copy">
<g id="status" transform="translate(1352.000000, 584.000000)">
<g transform="translate(15.500000, 15.500000) rotate(90.000000) translate(-15.500000, -15.500000) translate(8.000000, 8.000000)">
<polygon fill="currentColor" fill-rule="nonzero" id="Path"
points="9.825 3.75 8.775 4.8 10.65 6.75 1.5 6.75 1.5 8.25 10.65 8.25 8.775 10.2 9.825 11.25 13.5 7.5"></polygon>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.4 KiB

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

@ -1,58 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg height="15px" version="1.1" viewBox="0 0 15 15" width="15px" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path
d="M8,0 L392,0 C396.418278,-8.11624501e-16 400,3.581722 400,8 L400,40 C400,44.418278 396.418278,48 392,48 L8,48 C3.581722,48 5.41083001e-16,44.418278 0,40 L0,8 C-5.41083001e-16,3.581722 3.581722,8.11624501e-16 8,0 Z"
id="path-1"></path>
<filter filterUnits="objectBoundingBox" height="212.5%" id="filter-3" width="113.5%"
x="-6.8%" y="-50.0%">
<feMorphology in="SourceAlpha" operator="dilate" radius="2.5"
result="shadowSpreadOuter1"></feMorphology>
<feOffset dx="0" dy="3" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
<feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1"
stdDeviation="6"></feGaussianBlur>
<feColorMatrix in="shadowBlurOuter1"
type="matrix"
values="0 0 0 0 0.156862745 0 0 0 0 0.196078431 0 0 0 0 0.254901961 0 0 0 0.1428069 0"></feColorMatrix>
</filter>
</defs>
<g fill="none" fill-rule="evenodd" id="File-Upload-&amp;-Download-Overlays" stroke="none"
stroke-width="1">
<g id="Document-Upload---Collapsed" transform="translate(-1359.000000, -847.000000)">
<rect height="900" width="1440" x="0" y="0"></rect>
<g fill="currentColor" font-family="Inter-Regular, Inter" font-size="16"
font-weight="normal" id="Dossier-details"
transform="translate(1111.000000, 127.000000)">
<g id="Group-4" transform="translate(0.000000, 145.000000)">
<g id="Group-11" transform="translate(0.000000, 566.000000)">
<text id="Description">
<tspan x="0" y="16">Description</tspan>
</text>
</g>
</g>
</g>
<g id="Group-10" transform="translate(1020.000000, 832.000000)">
<g id="Group-8">
<mask id="mask-2">
<use xlink:href="#path-1"></use>
</mask>
<g id="Rectangle">
<use fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
<use fill-rule="evenodd" xlink:href="#path-1"></use>
</g>
</g>
<g fill="currentColor"
fill-rule="nonzero"
id="Group-6-Copy"
transform="translate(347.000000, 23.000000) rotate(180.000000) translate(-347.000000, -23.000000) translate(332.000000, 8.000000)">
<g id="status"
transform="translate(15.500000, 15.500000) rotate(90.000000) translate(-15.500000, -15.500000) translate(8.000000, 8.000000)">
<polygon id="Path"
points="9.825 3.75 8.775 4.8 10.65 6.75 1.5 6.75 1.5 8.25 10.65 8.25 8.775 10.2 9.825 11.25 13.5 7.5"></polygon>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 3.2 KiB

9
apps/red-ui/src/assets/styles/red-autocomplete.scss
View File

@ -1,9 +0,0 @@
@use 'common-mixins';
.mat-autocomplete-panel {
@include common-mixins.scroll-bar;
.mat-option {
font-size: inherit;
}
}

42
apps/red-ui/src/assets/styles/red-breadcrumbs.scss
View File

@ -1,42 +0,0 @@
@use 'variables';
@use 'common-mixins';
.breadcrumbs-container {
display: flex;
align-items: center;
> *:not(:last-child) {
margin-right: 6px;
}
mat-icon {
width: 16px;
min-width: 16px;
}
}
.breadcrumb {
text-decoration: none;
color: variables.$accent;
font-weight: 600;
width: fit-content;
white-space: nowrap;
&.back {
display: flex !important;
justify-content: center;
align-items: center;
mat-icon {
margin-right: 8px;
}
}
&:last-child {
@include common-mixins.line-clamp(1);
}
&.active {
color: variables.$primary;
}
}

37
apps/red-ui/src/assets/styles/red-checkbox.scss
View File

@ -1,37 +0,0 @@
@use 'variables';
.mat-checkbox .mat-checkbox-frame {
border: 1px solid variables.$grey-5;
}
.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,
.mat-checkbox-checked.mat-accent .mat-checkbox-background {
margin-top: 1px;
margin-left: 1px;
width: 18px;
height: 18px;
}
.mat-checkbox-layout {
align-items: center !important;
.mat-checkbox-inner-container {
margin-left: 0;
}
.mat-checkbox-label {
font-size: 13px;
color: variables.$accent;
display: flex;
align-items: center;
> *:not(:last-child) {
margin-right: 8px;
}
}
}
.mat-checkbox.error .mat-checkbox-label {
color: variables.$primary;
}

99
apps/red-ui/src/assets/styles/red-components.scss
View File

@ -1,97 +1,6 @@
@use 'variables';
@use 'common-mixins';
.oval,
.square {
font-weight: 600;
display: flex;
justify-content: center;
align-items: center;
height: 24px;
width: 24px;
min-width: 24px;
font-size: 10px;
line-height: 12px;
text-align: center;
text-transform: uppercase;
border: none;
box-sizing: border-box;
&.large {
height: 32px;
width: 32px;
font-size: 13px;
}
&.gray-dark {
background-color: variables.$grey-6;
}
&.gray-red {
background-color: variables.$grey-6;
color: variables.$primary;
}
&.lightgray-dark {
background-color: variables.$grey-4;
}
&.lightgray-red {
background-color: variables.$grey-4;
color: variables.$primary;
}
&.darkgray-white {
background-color: variables.$accent;
color: variables.$white;
}
&.lightgray-white {
background-color: variables.$grey-5;
color: variables.$white;
}
&.red-white {
background-color: variables.$primary;
color: variables.$white;
}
&.white-dark {
border: 1px solid variables.$grey-4;
}
&.inactive {
background-color: variables.$grey-6;
color: variables.$grey-7;
}
}
.oval {
border-radius: 50%;
}
.stats-subtitle {
display: flex;
> div {
display: flex;
justify-content: center;
align-items: center;
width: fit-content;
mat-icon {
width: 10px;
height: 10px;
line-height: 13px;
margin-right: 6px;
}
&:not(:last-child) {
margin-right: 12px;
}
}
}
.pill {
padding: 2px 5px;
border-radius: 9px;
@ -183,11 +92,3 @@
stroke: variables.$primary;
background-color: variables.$primary;
}
.overlay-shadow {
@include common-mixins.inset-shadow;
position: fixed;
width: 100%;
height: 4px;
z-index: 2;
}

49
apps/red-ui/src/assets/styles/red-controls.scss
View File

@ -1,49 +0,0 @@
@use 'variables';
.btn-group {
display: flex;
flex-direction: row;
.btn-group-btn {
cursor: pointer;
color: variables.$accent;
background: variables.$white;
font-family: Inter, sans-serif;
font-size: 13px;
line-height: 14px;
padding: 10px 14px;
transition: color 0.25s ease-in-out;
outline: none;
border: none;
&:hover {
color: variables.$black;
}
&.active {
color: variables.$light;
background: variables.$primary;
border-radius: 17px;
}
&.active:hover {
color: variables.$grey-3;
}
}
}
.icon-10 {
width: 10px;
height: 10px;
}
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Old versions of Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none;
/* Non-prefixed version, currently
supported by Chrome, Edge, Opera and Firefox */
}

36
apps/red-ui/src/assets/styles/red-fonts.scss
View File

@ -1,36 +0,0 @@
/* inter-regular - latin */
@font-face {
font-family: 'OpenSans Extrabold';
src: url('../font/OpenSans-ExtraBold.ttf') format('truetype');
}
@font-face {
font-family: 'Inter';
font-weight: 300;
src: url('../font/Inter-VariableFont.ttf') format('truetype');
}
@font-face {
font-family: 'Inter';
font-weight: 400;
src: url('../font/Inter-VariableFont.ttf') format('truetype');
}
@font-face {
font-family: 'Inter';
font-weight: 500;
src: url('../font/Inter-VariableFont.ttf') format('truetype');
}
@font-face {
font-family: 'Inter';
font-weight: 600;
src: url('../font/Inter-VariableFont.ttf') format('truetype');
}
@font-face {
font-family: 'Inter';
font-weight: 700;
src: url('../font/Inter-VariableFont.ttf') format('truetype');
}

30
apps/red-ui/src/assets/styles/red-help-mode.scss
View File

@ -1,30 +0,0 @@
@use 'variables';
.help-mode-on-mouse-over {
z-index: 100;
position: absolute;
top: -5px;
left: -5px;
width: 100%;
height: 100%;
padding-right: 5px;
padding-bottom: 10px;
transition: all 0.25s;
}
.help-highlight,
.help-mode-on-mouse-over:hover {
background: rgba(92, 229, 148, 0.5);
box-shadow: 0 0 0 2px variables.$green-2 inset;
cursor: help;
}
.help-mode-on-mouse-over-filters,
.help-mode-on-mouse-over-quick-filters,
.help-mode-on-mouse-over-new-dossier {
padding-right: 10px;
}
.help-mode-on-mouse-over-notifications {
padding-left: 4px;
}

12
apps/red-ui/src/assets/styles/red-list.scss
View File

@ -1,12 +0,0 @@
@use 'variables';
.mat-list-item {
color: variables.$accent !important;
font-size: 13px !important;
line-height: 16px !important;
}
.list-50vh {
overflow-y: scroll;
max-height: 50vh;
}

23
apps/red-ui/src/assets/styles/red-loading.scss
View File

@ -1,23 +0,0 @@
.loading:after {
content: '.';
animation: dots 1s steps(5, end) infinite;
}
@keyframes dots {
0%,
20% {
color: rgba(40, 50, 65, 0);
text-shadow: 0.25em 0 0 rgba(40, 50, 65, 0), 0.5em 0 0 rgba(40, 50, 65, 0);
}
40% {
color: #283241;
text-shadow: 0.25em 0 0 rgba(40, 50, 65, 0), 0.5em 0 0 rgba(40, 50, 65, 0);
}
60% {
text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 rgba(40, 50, 65, 0);
}
80%,
100% {
text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 #283241;
}
}

63
apps/red-ui/src/assets/styles/red-menu.scss
View File

@ -1,63 +0,0 @@
@use 'variables';
@use 'common-mixins';
.mat-menu-panel {
border-radius: 8px !important;
box-shadow: 0 2px 6px 0 rgba(40, 50, 65, 0.3);
max-width: none !important;
min-width: 180px !important;
margin-top: 10px;
@include common-mixins.scroll-bar;
.mat-menu-content:not(:empty) {
padding-top: 8px;
padding-bottom: 24px;
}
&.padding-bottom-0 .mat-menu-content:not(:empty) {
padding-bottom: 0;
}
&.padding-bottom-8 .mat-menu-content:not(:empty) {
padding-bottom: 8px;
}
.mat-menu-item {
font-size: 13px;
color: variables.$accent;
padding: 0 8px;
margin: 0 8px 2px 8px;
border-radius: 4px;
width: -webkit-fill-available;
display: flex;
align-items: center;
> *:not(:last-child) {
margin-right: 8px;
}
.arrow-wrapper {
width: 16px;
text-align: center;
mat-icon {
width: 16px;
height: 16px;
margin: 0;
}
}
&.padding-left {
padding-left: 56px;
}
&:last-of-type {
margin-bottom: 0;
}
&:hover {
background-color: rgba(variables.$primary, 0.1);
}
}
}

387
apps/red-ui/src/assets/styles/red-page-layout.scss
View File

@ -1,387 +0,0 @@
@use 'variables';
@use 'common-mixins';
html,
body {
margin: 0;
padding: 0;
height: 100vh;
font-family: 'Inter', sans-serif;
color: variables.$accent;
font-size: 13px;
line-height: 16px;
}
section.settings {
display: flex;
.page-header,
.red-content-inner {
width: calc(100vw - 200px);
}
redaction-admin-side-nav {
height: calc(100vh - 61px);
}
}
.page-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 24px;
height: 50px;
width: 100vw;
box-sizing: border-box;
background-color: variables.$white;
border-bottom: 1px solid variables.$separator;
.filters {
display: flex;
align-items: center;
> *:not(:last-child) {
margin-right: 2px;
}
> div:first-child {
margin-right: 8px;
}
form {
margin-left: 6px;
.iqser-input-group {
width: 250px;
}
}
.reset-filters {
margin-left: 12px;
color: variables.$primary;
cursor: pointer;
}
}
.actions {
display: flex;
align-items: center;
justify-content: flex-end;
> *:not(:last-child) {
margin-right: 2px;
}
}
}
.fullscreen {
.page-header {
position: absolute;
top: 0;
}
.red-content-inner {
height: calc(100% - 50px);
}
.overlay-shadow {
top: 50px;
}
}
.red-content-inner {
display: flex;
flex-direction: row;
position: absolute;
bottom: 0;
width: 100%;
height: calc(100% - 111px);
transition: height ease-in-out 0.2s;
}
.content-container {
overflow: hidden;
position: relative;
width: 100%;
.dialog {
border-radius: 8px;
margin-top: 40px;
margin-bottom: 70px;
background-color: variables.$white;
max-width: 650px;
height: fit-content;
box-shadow: 0 1px 5px 0 rgba(40, 50, 65, 0.19);
position: unset;
.heading-l {
margin-bottom: 16px;
}
.dialog-content {
display: flex;
.dialog-content-left {
min-width: 300px;
margin-right: 64px;
}
.link-action {
margin-top: 8px;
}
}
}
@media only screen and (max-width: 1600px) {
.user-column {
justify-content: center;
align-items: center;
redaction-initials-avatar .username {
display: none;
}
}
}
}
.right-container {
border-left: 1px solid variables.$grey-4;
box-sizing: border-box;
background: variables.$white;
overflow: hidden;
transition: width ease-in-out 0.2s, min-width ease-in-out 0.2s;
&:hover {
overflow-y: auto;
@include common-mixins.scroll-bar;
}
.collapsed-wrapper {
display: none;
}
&.collapsed {
padding-left: 0 !important;
padding-right: 0 !important;
width: 60px !important;
min-width: 60px !important;
display: flex;
div:not(.collapsed-wrapper) {
display: none;
}
.collapsed-wrapper {
display: flex;
flex-direction: column;
align-items: center;
width: 60px;
div {
display: initial;
}
.all-caps-label {
transform: rotate(90deg) translateX(50%);
white-space: nowrap;
margin-top: 10px;
}
}
}
}
.flex {
display: flex !important;
}
.flex-end {
display: flex;
justify-content: flex-end;
}
.flex-center {
display: flex;
justify-content: center;
}
.flex-align-items-center {
display: flex;
align-items: center;
}
.flex-1 {
flex: 1;
}
.flex-2 {
flex: 2;
}
.mt-5 {
margin-top: 5px;
}
.mt-8 {
margin-top: 8px;
}
.mt-16 {
margin-top: 16px !important;
}
.mt-20 {
margin-top: 20px;
}
.mt-24 {
margin-top: 24px;
}
.mt-32 {
margin-top: 32px;
}
.mb-6 {
margin-bottom: 6px;
}
.mb-8 {
margin-bottom: 8px !important;
}
.mb-12 {
margin-bottom: 12px !important;
}
.ml-8 {
margin-left: 8px;
}
.ml-14 {
margin-left: 14px;
}
.ml-16 {
margin-left: 16px;
}
.mr-24 {
margin-right: 24px;
}
.pb-24 {
padding-bottom: 24px;
}
.pb-32 {
padding-bottom: 32px;
}
.w-100 {
min-width: 100px !important;
width: 100px !important;
}
.break-20 {
height: 20px;
background: transparent;
display: block;
}
.detail-row {
opacity: 1;
font-family: Inter, sans-serif;
font-size: 14px;
letter-spacing: 0;
line-height: 14px;
padding: 4px;
}
.red-top-bar {
height: 61px;
width: 100vw;
max-height: 61px;
display: flex;
flex-direction: column;
.top-bar-row {
height: 60px;
display: flex;
justify-content: space-between;
padding: 0 24px;
.center {
display: flex;
align-items: center;
justify-content: center;
margin: 0 50px;
}
.app-name {
font-family: 'OpenSans Extrabold', sans-serif;
margin-left: 10px;
height: 20px;
font-size: 13px;
font-weight: 800;
letter-spacing: 0;
line-height: 20px;
white-space: nowrap;
}
.menu {
display: flex;
align-items: center;
overflow: hidden;
&.right {
justify-content: flex-end;
}
}
}
.divider {
height: 1px;
opacity: 0.15;
background-color: variables.$accent;
}
}
.hidden {
display: none !important;
}
.not-visible {
visibility: hidden;
}
.pointer {
cursor: pointer;
}
.mr-4 {
margin-right: 4px !important;
}
.mr-8 {
margin-right: 8px !important;
}
.mr-16 {
margin-right: 16px;
}
.mr-34 {
margin-right: 34px;
}
.fit-content {
width: fit-content;
}
.d-flex {
display: flex;
}
.cdk-overlay-container {
z-index: 800;
}

16
apps/red-ui/src/assets/styles/red-progress-bar.scss
View File

@ -1,16 +0,0 @@
@use 'variables';
.mat-progress-bar {
height: 6px;
border-radius: 3px;
.mat-progress-bar-buffer {
background-color: variables.$grey-4;
}
&.green {
.mat-progress-bar-fill::after {
background-color: variables.$green-2;
}
}
}

23
apps/red-ui/src/assets/styles/red-select.scss
View File

@ -1,23 +0,0 @@
@use 'variables';
@use 'common-mixins';
.mat-select-panel {
@include common-mixins.scroll-bar;
.mat-option {
&:hover:not(.mat-option-disabled),
&:focus:not(.mat-option-disabled) {
background-color: variables.$grey-6;
}
&.mat-selected:not(.mat-option-multiple) {
background-color: rgba(variables.$primary, 0.2);
color: variables.$accent;
}
}
}
.mat-form-field.no-label .mat-form-field-infix {
padding: 0 !important;
border-top: 0 !important;
}

50
apps/red-ui/src/assets/styles/red-slider.scss
View File

@ -1,50 +0,0 @@
@use 'variables';
.mat-slider-horizontal {
width: 140px;
height: 32px !important;
.mat-slider-wrapper {
left: 0 !important;
top: 16px !important;
}
.mat-slider-track-wrapper,
.mat-slider-track-fill {
height: 6px !important;
border-radius: 3px;
}
// For disabled state
.mat-slider-track-fill {
background-color: variables.$primary;
}
.mat-slider-track-background {
height: 4px !important;
margin-top: 1px;
border-radius: 3px;
background-color: variables.$grey-4 !important;
}
.mat-slider-focus-ring {
display: none;
}
}
.mat-slider-thumb {
width: 16px !important;
height: 16px !important;
border-width: 0 !important;
background-color: variables.$primary !important;
}
.mat-slider:not(.mat-slider-disabled):not(.mat-slider-sliding) .mat-slider-thumb {
transform: scale(1) !important;
}
.mat-slider-horizontal.mat-slider-disabled {
.mat-slider-thumb {
transform: translateX(-3px);
}
}

23
apps/red-ui/src/assets/styles/red-tables.scss
View File

@ -1,23 +0,0 @@
@use 'variables';
.default-table {
border-collapse: collapse;
th,
td {
padding: 8px;
text-align: left;
border: 1px solid variables.$separator;
}
}
.table-header-actions {
display: flex;
flex: 1;
align-items: center;
justify-content: flex-end;
> *:not(:last-child) {
margin-right: 10px;
}
}

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

@ -1,29 +0,0 @@
@use 'variables';
.red-tab {
&:not(:last-child) {
margin-right: 2px;
}
height: 30px;
line-height: 30px;
padding: 0 14px;
border-radius: 17px;
transition: background-color 0.2s;
cursor: pointer;
&:not(.disabled):not(.active):hover {
background-color: variables.$grey-6;
}
&.active {
background-color: rgba(variables.$primary, 0.1);
font-weight: 600;
color: variables.$primary;
}
&.disabled {
color: rgba(variables.$accent, 0.3);
cursor: not-allowed;
}
}

19
apps/red-ui/src/assets/styles/red-theme.scss
View File

@ -1,23 +1,4 @@
@use 'red-fonts';
@use '~ngx-toastr/toastr';
@use 'red-material-theme';
@use 'red-page-layout';
@use 'red-select';
@use 'red-autocomplete';
@use 'red-list';
@use 'red-checkbox';
@use 'red-toggle';
@use 'red-toggle-button';
@use 'red-menu';
@use 'red-tables';
@use 'red-components';
@use 'red-controls';
@use 'red-toasts';
@use 'red-tooltips';
@use 'red-breadcrumbs';
@use 'red-editor';
@use 'red-slider';
@use 'red-loading';
@use 'red-progress-bar';
@use 'red-tabs';
@use 'red-help-mode';

110
apps/red-ui/src/assets/styles/red-toasts.scss
View File

@ -1,110 +0,0 @@
@use 'variables';
$toast-width: 400px;
.toast-container .ngx-toastr,
.inline-dialog-toast {
padding: 11px 16px;
border-radius: 8px;
background-image: none;
font-family: Inter, sans-serif;
font-size: 13px;
line-height: 18px;
width: $toast-width;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: none;
> *:not(:last-child) {
margin-right: 10px;
}
&:hover {
box-shadow: none;
}
.actions-wrapper {
margin-top: 24px;
display: flex;
> *:not(:last-child) {
margin-right: 24px;
}
a {
font-size: 11px;
font-weight: 600;
line-height: 14px;
color: variables.$accent;
text-transform: uppercase;
cursor: pointer;
}
}
}
.toast-top-right {
top: 128px;
right: calc(50% - #{$toast-width} / 2);
}
.toast-file-preview {
top: 160px;
right: 405px;
}
.toast-close-button {
position: initial;
opacity: 1;
text-shadow: none;
mat-icon {
width: 10px;
}
&:hover {
opacity: 1;
}
}
.toast-warning,
.toast-success {
.toast-message {
color: variables.$accent;
}
.toast-close-button {
color: variables.$accent;
}
}
.toast-error,
.toast-info {
.toast-close-button:hover {
color: variables.$white;
}
}
.toast-success {
background-color: variables.$green-2;
}
.toast-error {
background-color: variables.$primary;
color: variables.$white;
}
.toast-warning {
background-color: variables.$yellow-2;
color: variables.$accent;
}
.toast-info {
background-color: variables.$accent;
}
.inline-dialog-toast {
width: calc(100% - 96px);
margin-left: 32px;
margin-top: 14px;
}

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

@ -1,23 +0,0 @@
@use 'variables';
.mat-button-toggle-standalone,
.mat-button-toggle-group {
box-shadow: none;
border-radius: 100px !important;
width: fit-content;
.mat-button-toggle:not(.mat-button-toggle-checked) {
.mat-button-toggle-button {
background: variables.$grey-6;
color: variables.$grey-7;
}
}
}
.mat-button-toggle-disabled {
.mat-button-toggle-button {
cursor: not-allowed !important;
}
outline: none;
}

42
apps/red-ui/src/assets/styles/red-toggle.scss
View File

@ -1,42 +0,0 @@
@use 'variables';
.mat-slide-toggle {
.mat-slide-toggle-bar {
height: 16px !important;
width: 30px !important;
border-radius: 16px !important;
background-color: variables.$grey-4;
}
.mat-slide-toggle-thumb-container {
top: 2px !important;
left: 2px !important;
height: 12px !important;
width: 12px !important;
}
.mat-slide-toggle-thumb {
height: 12px !important;
width: 12px !important;
box-shadow: none;
background-color: variables.$grey-2;
}
.mat-ripple {
display: none;
}
&.mat-primary.mat-checked {
.mat-slide-toggle-bar {
background-color: variables.$primary;
}
.mat-slide-toggle-thumb {
background-color: variables.$white;
}
.mat-slide-toggle-thumb-container {
transform: translate3d(14px, 0, 0);
}
}
}

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

@ -1,62 +0,0 @@
@use 'variables';
.mat-tooltip {
background-color: variables.$accent;
border-radius: 3px !important;
padding: 10px;
margin: 12px !important;
font-size: 11px;
line-height: 14px;
color: variables.$white !important;
position: relative;
overflow: visible !important;
text-align: center;
//&:after {
// content: '';
// position: absolute;
// left: 50%;
// margin-left: -5px;
// width: 0;
// height: 0;
// z-index: 3000;
// border-left: solid 5px transparent;
// border-right: solid 5px transparent;
// border-top: solid 6px $accent;
//}
&.small {
max-width: 160px;
}
&.warn {
background-color: variables.$yellow-2;
color: variables.$accent !important;
//&:after {
// border-top: solid 6px $yellow-2;
//}
}
}
//
//.mat-tooltip[style*='transform-origin: center top']:after {
// top: -6px;
// transform: rotate(180deg);
//}
//
//.mat-tooltip[style*='transform-origin: center bottom']:after {
// top: 100%;
//}
//
//.mat-tooltip[style*='transform-origin: right center']:after {
// top: 50%;
// left: 100%;
// transform: rotate(-90deg) translateY(3px) translateX(3px);
//}
//
//.mat-tooltip[style*='transform-origin: left center']:after {
// top: 50%;
// left: 0;
// transform: rotate(90deg) translateY(3px) translateX(-3px);
//}

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

@ -16,6 +16,8 @@
$iqser-btn-bg: vars.$btn-bg,
$iqser-warn: vars.$warn,
$iqser-white: vars.$white,
$iqser-black: vars.$black,
$iqser-light: vars.$light,
$iqser-separator: vars.$separator,
$iqser-quick-filter-border: vars.$quick-filter-border,
$iqser-grey-2: vars.$grey-2,
@ -23,6 +25,11 @@
$iqser-grey-4: vars.$grey-4,
$iqser-grey-5: vars.$grey-5,
$iqser-grey-6: vars.$grey-6,
$iqser-grey-7: vars.$grey-7,
$iqser-green-1: vars.$green-1,
$iqser-green-2: vars.$green-2,
$iqser-yellow-1: vars.$yellow-1,
$iqser-yellow-2: vars.$yellow-2,
$iqser-helpmode-primary: vars.$green-2
);

Some files were not shown because too many files have changed in this diff Show More