diff --git a/src/assets/icons/alert-circle.svg b/src/assets/icons/alert-circle.svg new file mode 100644 index 0000000..32d58d7 --- /dev/null +++ b/src/assets/icons/alert-circle.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + diff --git a/src/assets/styles/common-loading.scss b/src/assets/styles/common-loading.scss index 51bd1d3..2ca4711 100644 --- a/src/assets/styles/common-loading.scss +++ b/src/assets/styles/common-loading.scss @@ -10,15 +10,15 @@ text-shadow: 0.25em 0 0 rgba(var(--iqser-accent-rgb), 0), 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0); } 40% { - color: #283241; + color: var(--iqser-accent); text-shadow: 0.25em 0 0 rgba(var(--iqser-accent-rgb), 0), 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0); } 60% { - text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0); + text-shadow: 0.25em 0 0 var(--iqser-accent), 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0); } 80%, 100% { - text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 #283241; + text-shadow: 0.25em 0 0 var(--iqser-accent), 0.5em 0 0 var(--iqser-accent); } } diff --git a/src/assets/styles/common-texts.scss b/src/assets/styles/common-texts.scss index bfd8b03..0e9194e 100644 --- a/src/assets/styles/common-texts.scss +++ b/src/assets/styles/common-texts.scss @@ -78,6 +78,12 @@ pre { line-height: 24px; } +.heading-md { + font-size: 18px; + font-weight: 600; + line-height: 22px; +} + .heading { font-size: 16px; line-height: 20px; diff --git a/src/lib/listing/services/index.ts b/src/lib/listing/services/index.ts index 2bd0d5c..a5d0056 100644 --- a/src/lib/listing/services/index.ts +++ b/src/lib/listing/services/index.ts @@ -1,2 +1,3 @@ export * from './entities.service'; +export * from './paginated-entities.service'; export * from './listing.service'; diff --git a/src/lib/listing/services/paginated-entities.service.ts b/src/lib/listing/services/paginated-entities.service.ts new file mode 100644 index 0000000..95553da --- /dev/null +++ b/src/lib/listing/services/paginated-entities.service.ts @@ -0,0 +1,29 @@ +import { Injectable } from '@angular/core'; +import { Id, IListable } from '../models'; +import { EntitiesService } from './entities.service'; +import { Observable } from 'rxjs'; +import { map, tap } from 'rxjs/operators'; +import { mapEach } from '../../utils'; + +@Injectable() +/** + * By default, if no implementation (class) is provided, Class = Interface & IListable + */ +export class PaginatedEntitiesService< + Interface, + Class extends Interface & IListable, + PrimaryKey extends Id = Class['id'], +> extends EntitiesService { + loadPage(page = 0, pageSize = 100): Observable { + const queryParams = [ + { key: 'page', value: page }, + { key: 'pageSize', value: pageSize }, + ]; + + return super.getAll<{ elements: Interface[] }>(this._defaultModelPath, queryParams).pipe( + map(response => response.elements), + mapEach(entity => (this._entityClass ? new this._entityClass(entity) : (entity as unknown as Class))), + tap((entities: Class[]) => this.setEntities(entities)), + ); + } +} diff --git a/src/lib/shared/logo/logo.component.ts b/src/lib/shared/logo/logo.component.ts index 61871d0..84f948f 100644 --- a/src/lib/shared/logo/logo.component.ts +++ b/src/lib/shared/logo/logo.component.ts @@ -11,8 +11,8 @@ import { MatIconModule } from '@angular/material/icon'; } mat-icon { - width: 28px; height: 28px; + width: unset; } `, ], diff --git a/src/lib/upload-file/upload-file.component.scss b/src/lib/upload-file/upload-file.component.scss index 5c716cc..83d7b43 100644 --- a/src/lib/upload-file/upload-file.component.scss +++ b/src/lib/upload-file/upload-file.component.scss @@ -4,6 +4,7 @@ align-items: center; border-radius: 8px; width: 100%; + box-sizing: border-box; background: var(--iqser-alt-background); &.drag-over { @@ -15,6 +16,7 @@ gap: 16px; height: 88px; cursor: pointer; + padding: 0 32px; mat-icon, div { @@ -22,10 +24,6 @@ transition: 0.1s; } - mat-icon { - margin-left: 32px; - } - div { font-size: 16px; font-weight: 500; diff --git a/src/lib/utils/constants.ts b/src/lib/utils/constants.ts index beb8264..e751b20 100644 --- a/src/lib/utils/constants.ts +++ b/src/lib/utils/constants.ts @@ -1,4 +1,5 @@ export const ICONS = new Set([ + 'alert-circle', 'arrow-down', 'arrow-down-o', 'arrow-right',