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

Updated common-ui

Browse Source
This commit is contained in:
Adina Țeudan 2021-10-03 01:29:28 +03:00
parent 8b02bd868d
commit 7329b0cf69
68 changed files with 60 additions and 965 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 '@iqser/common-ui';
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 = [
{

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

@ -24,7 +24,7 @@
<div *ngIf="currentUser.isUser" class="menu flex-2 visible-lg breadcrumbs-container">
<a *ngIf="(isDossiersView$ | async) === false" class="breadcrumb back" redactionNavigateLastDossiersScreen>
<mat-icon svgIcon="red:expand"></mat-icon>
<mat-icon svgIcon="iqser:expand"></mat-icon>
{{ 'top-bar.navigation-items.back' | translate }}
</a>
@ -37,7 +37,7 @@
translate="top-bar.navigation-items.dossiers"
></a>
<mat-icon *ngIf="appStateService.activeDossier" svgIcon="red:arrow-right"></mat-icon>
<mat-icon *ngIf="appStateService.activeDossier" svgIcon="iqser:arrow-right"></mat-icon>
<a
*ngIf="appStateService.activeDossier"
@ -49,7 +49,7 @@
{{ appStateService.activeDossier.dossierName }}
</a>
<mat-icon *ngIf="appStateService.activeFile" svgIcon="red:arrow-right"></mat-icon>
<mat-icon *ngIf="appStateService.activeFile" svgIcon="iqser:arrow-right"></mat-icon>
<a
*ngIf="appStateService.activeFile"

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

@ -1,8 +1,5 @@
<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="content-inner">
<div class="content-container">

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/dictionary-listing/dictionary-listing-screen.component.html
View File

@ -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>

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

@ -4,11 +4,11 @@
<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="content-inner">
<div class="content-container">

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

@ -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>

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

@ -4,11 +4,11 @@
<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="content-inner">
<div class="content-container">
@ -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>

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

@ -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>

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

@ -4,12 +4,12 @@
<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="content-inner">
<div class="content-container">

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';

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

@ -1,11 +1,11 @@
<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="content-inner">
<div class="content-container">

2
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"

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>

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,

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>

5
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,7 +29,7 @@
icon="red:upload"
tooltipPosition="below"
></iqser-circle-button>
</redaction-page-header>
</iqser-page-header>
<div class="overlay-shadow"></div>

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'
}
];

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

@ -1,5 +1,5 @@
<section>
<redaction-page-header [buttonConfigs]="buttonConfigs"></redaction-page-header>
<iqser-page-header [buttonConfigs]="buttonConfigs"></iqser-page-header>
<div class="overlay-shadow"></div>

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 { DefaultListingServices, ListingComponent, 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';

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';

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

@ -1,11 +1,11 @@
<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>

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';
@ -15,7 +16,6 @@ import { ActivatedRoute, Router } from '@angular/router';
import { AppStateService } from '@state/app-state.service';
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';

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;

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>

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

@ -21,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';
@ -41,7 +40,6 @@ const components = [
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

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;
}
}

15
apps/red-ui/src/assets/styles/red-media-queries.scss
View File

@ -1,15 +0,0 @@
@media only screen and (max-width: 800px) {
.visible-lg {
display: none !important;
}
}
.visible-lt-lg {
display: none !important;
}
@media only screen and (max-width: 800px) {
.visible-lt-lg {
display: flex !important;
}
}

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);
}
}

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;
}
}

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

@ -1,17 +1,4 @@
@use 'red-fonts';
@use '~ngx-toastr/toastr';
@use 'red-material-theme';
@use 'red-select';
@use 'red-list';
@use 'red-toggle';
@use 'red-toggle-button';
@use 'red-media-queries';
@use 'red-components';
@use 'red-toasts';
@use 'red-tooltips';
@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);
//}

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

@ -25,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
);

2
libs/common-ui

@ -1 +1 @@
Subproject commit 52b8c90bbf283d2f78dbb0c2744ef1bca771b675
Subproject commit 5eda852e94ea98a48d8f5354b7ae7f31be94d575

2
package.json
View File

@ -6,7 +6,7 @@
"scripts": {
"build": "nx build",
"build-lint-all": "ng lint --project=red-ui-http --fix && ng lint --project=red-ui --fix && ng lint --project=common-ui --fix && ng build --project=red-ui --configuration production --base-href /ui/",
"build-paligo-styles": "mkdir -p dist/paligo-styles && sass --load-path=. paligo-styles/style.scss > dist/paligo-styles/redacto-theme.css && cp -r apps/red-ui/src/assets/font dist/paligo-styles/fonts",
"build-paligo-styles": "mkdir -p dist/paligo-styles && sass --load-path=. paligo-styles/style.scss > dist/paligo-styles/redacto-theme.css && cp -r libs/common-ui/src/assets/font dist/paligo-styles/fonts",
"i18n:extract": "ngx-translate-extract --input ./apps/red-ui/src ./libs/common-ui/src --output apps/red-ui/src/assets/i18n/en.json --clean --sort --format namespaced-json && prettier apps/red-ui/src/assets/i18n/*.json --write",
"postinstall": "ngcc --properties es2015 browser module main",
"lint": "ng lint --project=red-ui-http --fix && ng lint --project=red-ui --fix && ng lint --project=common-ui --fix",