Icons
This commit is contained in:
parent
014c20b4f4
commit
9df9df4b94
9
src/assets/icons/arrow-right.svg
Normal file
9
src/assets/icons/arrow-right.svg
Normal file
@ -0,0 +1,9 @@
|
||||
<?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>
|
||||
|
After Width: | Height: | Size: 465 B |
8
src/assets/icons/plus.svg
Normal file
8
src/assets/icons/plus.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<?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>
|
||||
|
After Width: | Height: | Size: 417 B |
15
src/assets/icons/radio-indeterminate.svg
Normal file
15
src/assets/icons/radio-indeterminate.svg
Normal file
@ -0,0 +1,15 @@
|
||||
<?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>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
17
src/assets/icons/radio-selected.svg
Normal file
17
src/assets/icons/radio-selected.svg
Normal file
@ -0,0 +1,17 @@
|
||||
<?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>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@ -14,7 +14,7 @@ export class EmptyStateComponent implements OnInit {
|
||||
@Input() @Required() text!: string;
|
||||
@Input() icon?: string;
|
||||
@Input() showButton = true;
|
||||
@Input() buttonIcon = 'red:plus';
|
||||
@Input() buttonIcon = 'iqser:plus';
|
||||
@Input() buttonLabel?: string;
|
||||
@Input() horizontalPadding = 100;
|
||||
@Input() verticalPadding = 120;
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
<ng-container *ngIf="primaryFilterGroup$ | async as primaryGroup">
|
||||
<iqser-icon-button
|
||||
*ngIf="primaryGroup.icon"
|
||||
[attr.aria-expanded]="expanded$ | async"
|
||||
[icon]="primaryGroup.icon"
|
||||
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
|
||||
[matMenuTriggerFor]="filterMenu"
|
||||
[showDot]="hasActiveFilters$ | async"
|
||||
[attr.aria-expanded]="expanded$ | async"
|
||||
></iqser-icon-button>
|
||||
|
||||
<iqser-chevron-button
|
||||
*ngIf="!primaryGroup.icon"
|
||||
[attr.aria-expanded]="expanded$ | async"
|
||||
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
|
||||
[matMenuTriggerFor]="filterMenu"
|
||||
[showDot]="hasActiveFilters$ | async"
|
||||
[attr.aria-expanded]="expanded$ | async"
|
||||
></iqser-chevron-button>
|
||||
|
||||
<mat-menu
|
||||
@ -25,8 +25,8 @@
|
||||
<ng-template matMenuContent>
|
||||
<iqser-input-with-action
|
||||
(click)="$event.stopPropagation()"
|
||||
[(value)]="searchService.searchValue"
|
||||
*ngIf="primaryGroup.filterceptionPlaceholder"
|
||||
[(value)]="searchService.searchValue"
|
||||
[placeholder]="primaryGroup.filterceptionPlaceholder"
|
||||
[width]="'full'"
|
||||
></iqser-input-with-action>
|
||||
@ -95,7 +95,7 @@
|
||||
<div (click)="toggleFilterExpanded($event, filter)" class="mat-menu-item flex">
|
||||
<div *ngIf="filter.children?.length > 0" class="arrow-wrapper">
|
||||
<mat-icon *ngIf="filter.expanded" color="accent" svgIcon="iqser:arrow-down"></mat-icon>
|
||||
<mat-icon *ngIf="!filter.expanded" color="accent" svgIcon="red:arrow-right"></mat-icon>
|
||||
<mat-icon *ngIf="!filter.expanded" color="accent" svgIcon="iqser:arrow-right"></mat-icon>
|
||||
</div>
|
||||
|
||||
<div *ngIf="atLeastOneIsExpandable && filter.children?.length === 0" class="arrow-wrapper spacer"> </div>
|
||||
|
||||
@ -6,13 +6,14 @@ import { DomSanitizer } from '@angular/platform-browser';
|
||||
@NgModule({
|
||||
imports: [CommonModule, MatIconModule],
|
||||
declarations: [],
|
||||
exports: [MatIconModule],
|
||||
exports: [MatIconModule]
|
||||
})
|
||||
export class IqserIconsModule {
|
||||
constructor(private readonly _iconRegistry: MatIconRegistry, private readonly _sanitizer: DomSanitizer) {
|
||||
const icons: Set<string> = new Set([
|
||||
'arrow-down',
|
||||
'arrow-down-o',
|
||||
'arrow-right',
|
||||
'check',
|
||||
'close',
|
||||
'edit',
|
||||
@ -23,17 +24,16 @@ export class IqserIconsModule {
|
||||
'logout',
|
||||
'menu',
|
||||
'offline',
|
||||
'plus',
|
||||
'radio-indeterminate',
|
||||
'radio-selected',
|
||||
'refresh',
|
||||
'search',
|
||||
'sort-asc',
|
||||
'sort-desc',
|
||||
'sort-desc'
|
||||
]);
|
||||
icons.forEach(icon => {
|
||||
_iconRegistry.addSvgIconInNamespace(
|
||||
'iqser',
|
||||
icon,
|
||||
_sanitizer.bypassSecurityTrustResourceUrl(`/assets/icons/${icon}.svg`),
|
||||
);
|
||||
_iconRegistry.addSvgIconInNamespace('iqser', icon, _sanitizer.bypassSecurityTrustResourceUrl(`/assets/icons/${icon}.svg`));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -6,6 +6,6 @@
|
||||
[class.with-bg]="type === 'with-bg'"
|
||||
class="wrapper"
|
||||
>
|
||||
<mat-icon *ngIf="active && !indeterminate" svgIcon="red:radio-selected"></mat-icon>
|
||||
<mat-icon *ngIf="indeterminate" svgIcon="red:radio-indeterminate"></mat-icon>
|
||||
<mat-icon *ngIf="active && !indeterminate" svgIcon="iqser:radio-selected"></mat-icon>
|
||||
<mat-icon *ngIf="indeterminate" svgIcon="iqser:radio-indeterminate"></mat-icon>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user