Use material buttons in war list
parent
5ba7c48744
commit
fab0b438cd
|
|
@ -35,9 +35,13 @@ export class AppComponent implements OnInit {
|
||||||
private sanitizer: DomSanitizer,
|
private sanitizer: DomSanitizer,
|
||||||
@Inject(DOCUMENT) private document) {
|
@Inject(DOCUMENT) private document) {
|
||||||
this.iconRegistry.addSvgIcon('add',
|
this.iconRegistry.addSvgIcon('add',
|
||||||
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/twotone-add_circle-24px.svg'));
|
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/outline-add_box-24px.svg'));
|
||||||
this.iconRegistry.addSvgIcon('add-user',
|
this.iconRegistry.addSvgIcon('add-user',
|
||||||
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/twotone-person_add-24px.svg'));
|
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/twotone-person_add-24px.svg'));
|
||||||
|
this.iconRegistry.addSvgIcon('edit',
|
||||||
|
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/twotone-edit-24px.svg'));
|
||||||
|
this.iconRegistry.addSvgIcon('delete',
|
||||||
|
sanitizer.bypassSecurityTrustResourceUrl('../assets/icon/twotone-delete-24px.svg'));
|
||||||
|
|
||||||
router.events.subscribe(event => {
|
router.events.subscribe(event => {
|
||||||
if (event instanceof NavigationStart) {
|
if (event instanceof NavigationStart) {
|
||||||
|
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
.interact-ico-container {
|
|
||||||
padding-right: 15px;
|
|
||||||
float: right;
|
|
||||||
display: grid;
|
|
||||||
}
|
|
||||||
|
|
||||||
.interact-ico-container > span {
|
|
||||||
font-size: 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.interact-ico-container > span:last-child {
|
|
||||||
padding-top: 7px;
|
|
||||||
}
|
|
||||||
|
|
@ -11,8 +11,18 @@
|
||||||
|
|
||||||
<div *ngIf="loginService.hasPermission(3)"
|
<div *ngIf="loginService.hasPermission(3)"
|
||||||
class="interact-ico-container">
|
class="interact-ico-container">
|
||||||
<span class="glyphicon glyphicon-edit" (click)="edit(); $event.stopPropagation()" matTooltip="Bearbeiten"></span>
|
<button mat-icon-button
|
||||||
<span class="glyphicon glyphicon-trash" (click)="delete(); $event.stopPropagation()" matTooltip="Löschen"></span>
|
class="add-btn"
|
||||||
|
matTooltip="Bearbeiten"
|
||||||
|
(click)="edit(); $event.stopPropagation()">
|
||||||
|
<mat-icon svgIcon="edit"></mat-icon>
|
||||||
|
</button>
|
||||||
|
<button mat-icon-button
|
||||||
|
class="add-btn"
|
||||||
|
matTooltip="Löschen"
|
||||||
|
(click)="delete(); $event.stopPropagation()">
|
||||||
|
<mat-icon svgIcon="delete"></mat-icon>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -15,13 +15,18 @@
|
||||||
{{campaign.title}}
|
{{campaign.title}}
|
||||||
</mat-panel-title>
|
</mat-panel-title>
|
||||||
<mat-panel-description class="war-interaction-panel" *ngIf="loginService.hasPermission(3)">
|
<mat-panel-description class="war-interaction-panel" *ngIf="loginService.hasPermission(3)">
|
||||||
<span (click)="deleteCampaign(campaign); $event.stopPropagation()" matTooltip="Löschen"
|
<button mat-icon-button
|
||||||
class="glyphicon glyphicon-trash trash">
|
class="add-btn"
|
||||||
</span>
|
matTooltip="Bearbeiten"
|
||||||
<span (click)="editCampaign(campaign); $event.stopPropagation()" matTooltip="Bearbeiten"
|
(click)="editCampaign(campaign); $event.stopPropagation()">
|
||||||
class="glyphicon glyphicon-edit trash"
|
<mat-icon svgIcon="edit"></mat-icon>
|
||||||
style="padding-right: 10px;">
|
</button>
|
||||||
</span>
|
<button mat-icon-button
|
||||||
|
class="add-btn"
|
||||||
|
matTooltip="Löschen"
|
||||||
|
(click)="deleteCampaign(campaign); $event.stopPropagation()">
|
||||||
|
<mat-icon svgIcon="delete"></mat-icon>
|
||||||
|
</button>
|
||||||
</mat-panel-description>
|
</mat-panel-description>
|
||||||
</mat-expansion-panel-header>
|
</mat-expansion-panel-header>
|
||||||
<div class="top-list-entry">
|
<div class="top-list-entry">
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,10 @@ div.list-entry:hover, a.list-entry:hover {
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:host/deep/.list-entry mat-icon > svg {
|
||||||
|
color: #222222;
|
||||||
|
}
|
||||||
|
|
||||||
.decoration-list-preview, .squad-list-preview {
|
.decoration-list-preview, .squad-list-preview {
|
||||||
float: left;
|
float: left;
|
||||||
margin-right: 12px;
|
margin-right: 12px;
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,3 @@
|
||||||
.select-list {
|
.select-list {
|
||||||
padding: 20px 2% 0 5%;
|
padding: 20px 3% 12px 5%;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -7,15 +7,12 @@
|
||||||
</g>
|
</g>
|
||||||
<path fill="none" d="M0,0h24v24H0V0z"/>
|
<path fill="none" d="M0,0h24v24H0V0z"/>
|
||||||
</g>
|
</g>
|
||||||
<g id="Duotone">
|
<g id="Outline">
|
||||||
<g id="ui_x5F_spec_x5F_header_copy_2" display="none">
|
<g id="ui_x5F_spec_x5F_header" display="none">
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
<path opacity="0.3" d="M12,4c-4.41,0-8,3.59-8,8c0,4.41,3.59,8,8,8s8-3.59,8-8C20,7.59,16.41,4,12,4z M17,13h-4v4h-2v-4H7v-2h4V7
|
<path d="M19,3H5C3.89,3,3,3.9,3,5v14c0,1.1,0.89,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M19,19H5V5h14V19z"/>
|
||||||
h2v4h4V13z"/>
|
<polygon points="11,17 13,17 13,13 17,13 17,11 13,11 13,7 11,7 11,11 7,11 7,13 11,13 "/>
|
||||||
<polygon points="13,7 11,7 11,11 7,11 7,13 11,13 11,17 13,17 13,13 17,13 17,11 13,11 "/>
|
|
||||||
<path d="M12,2C6.48,2,2,6.48,2,12c0,5.52,4.48,10,10,10s10-4.48,10-10C22,6.48,17.52,2,12,2z M12,20c-4.41,0-8-3.59-8-8
|
|
||||||
c0-4.41,3.59-8,8-8s8,3.59,8,8C20,16.41,16.41,20,12,20z"/>
|
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 1002 B After Width: | Height: | Size: 788 B |
|
|
@ -0,0 +1,49 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
|
||||||
|
height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
||||||
|
<g id="Header_x2F_BG" display="none">
|
||||||
|
<rect x="-270" y="-270" display="inline" fill="#F1F1F2" width="520" height="520"/>
|
||||||
|
</g>
|
||||||
|
<g id="Bounding_Boxes">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_3">
|
||||||
|
</g>
|
||||||
|
<path fill="none" d="M0,0h24v24H0V0z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Rounded" display="none">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_5" display="inline">
|
||||||
|
</g>
|
||||||
|
<path display="inline" d="M6,19c0,1.1,0.9,2,2,2h8c1.1,0,2-0.9,2-2V9c0-1.1-0.9-2-2-2H8C6.9,7,6,7.9,6,9V19z M18,4h-2.5l-0.71-0.71
|
||||||
|
C14.61,3.11,14.35,3,14.09,3H9.91C9.65,3,9.39,3.11,9.21,3.29L8.5,4H6C5.45,4,5,4.45,5,5v0c0,0.55,0.45,1,1,1h12c0.55,0,1-0.45,1-1
|
||||||
|
v0C19,4.45,18.55,4,18,4z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Sharp" display="none">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_4" display="inline">
|
||||||
|
</g>
|
||||||
|
<path display="inline" d="M6,21h12V7H6V21z M19,4h-3.5l-1-1h-5l-1,1H5v2h14V4z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Outline" display="none">
|
||||||
|
<g id="ui_x5F_spec_x5F_header" display="inline">
|
||||||
|
</g>
|
||||||
|
<path id="XMLID_282_" display="inline" d="M16,9v10H8V9H16 M14.5,3h-5l-1,1H5v2h14V4h-3.5L14.5,3L14.5,3z M18,7H6v12
|
||||||
|
c0,1.1,0.9,2,2,2h8c1.1,0,2-0.9,2-2V7L18,7z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Duotone">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_2">
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="8" y="9" opacity="0.3" width="8" height="10"/>
|
||||||
|
<g>
|
||||||
|
<polygon points="15.5,4 14.5,3 9.5,3 8.5,4 5,4 5,6 19,6 19,4 "/>
|
||||||
|
<path d="M6,19c0,1.1,0.9,2,2,2h8c1.1,0,2-0.9,2-2V7H6V19z M8,9h8v10H8V9z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g id="Fill" display="none">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy" display="inline">
|
||||||
|
</g>
|
||||||
|
<path display="inline" d="M6,19c0,1.1,0.9,2,2,2h8c1.1,0,2-0.9,2-2V7H6V19z M19,4h-3.5l-1-1h-5l-1,1H5v2h14V4z"/>
|
||||||
|
</g>
|
||||||
|
<g id="nyt_x5F_exporter_x5F_info" display="none">
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,20 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
|
||||||
|
height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
||||||
|
<g id="Bounding_Boxes">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_3">
|
||||||
|
</g>
|
||||||
|
<path fill="none" d="M0,0h24v24H0V0z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Duotone">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_5">
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon opacity="0.3" points="5,18.08 5,19 5.92,19 14.98,9.94 14.06,9.02 "/>
|
||||||
|
<path d="M20.71,7.04c0.39-0.39,0.39-1.02,0-1.41l-2.34-2.34C18.17,3.09,17.92,3,17.66,3s-0.51,0.1-0.7,0.29l-1.83,1.83l3.75,3.75
|
||||||
|
L20.71,7.04z"/>
|
||||||
|
<path d="M3,17.25V21h3.75L17.81,9.94l-3.75-3.75L3,17.25z M5.92,19H5v-0.92l9.06-9.06l0.92,0.92L5.92,19z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 891 B |
Loading…
Reference in New Issue