Update alfresco tag with the material chips #1499 (#1500)

* Update alfresco tag with the material chips #1499

* remove unused css
This commit is contained in:
Eugenio Romano
2017-01-18 14:42:28 +00:00
committed by Will Abson
parent 9c0604a6c2
commit a0ccd6c8b3
3 changed files with 7 additions and 59 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 23 KiB

@@ -6,60 +6,3 @@
.tags li {
display: inline;
}
.tag-name {
cursor: default;
float:left;
max-height: 22px;
max-width: 100px;
background-color: #8EC44B;
-webkit-border-radius: 4px 0px 0px 4px;
-moz-border-radius: 4px 0px 0px 4px;
border-radius: 4px 0px 0px 4px;
position: relative;
color: #fff;
display: inline-block;
text-decoration: none;
font-family: arial, helvetica, sans-serif;
font-size: 14px;
zoom: 1;
line-height: 22px;
padding: 0 0px 0 10px;
margin: 4px 0px 4px 8px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.tag-delete {
cursor: pointer;
float:left;
max-height: 22px;
max-width: 30px;
background-color: #8EC44B;
-webkit-border-radius: 0px 4px 4px 0px;
-moz-border-radius: 0px 4px 4px 0px;
border-radius: 0px 4px 4px 0px;
position: relative;
color: #fff;
display: inline-block;
text-decoration: none;
font-family: arial, helvetica, sans-serif;
font-size: 14px;
zoom: 1;
line-height: 22px;
padding: 0 4px 0 6px;
margin: 4px 4px 4px 0px;
white-space: nowrap;
overflow: hidden;
}
.tag-delete:hover{
color: lightgray;
}
.delete-icon{
font-size: 22px!important;
}
@@ -1,8 +1,13 @@
<div class="tag-list-container">
<ul class="tags">
<li *ngFor="let currentEntry of tagsEntries; let idx = index">
<div id="tag_name_{{idx}}" class="tag-name">{{currentEntry.entry.tag}}</div>
<div id="tag_delete_{{idx}}" class="tag-delete" (click)="removeTag(currentEntry.entry.id)" ><i class="material-icons delete-icon">close</i></div>
<span class="mdl-chip mdl-chip--deletable">
<span id="tag_name_{{idx}}" class="mdl-chip__text">{{currentEntry.entry.tag}}</span>
<button id="tag_delete_{{idx}}" type="button" class="mdl-chip__action"
(click)="removeTag(currentEntry.entry.id)">
<i class="material-icons">cancel</i>
</button>
</span>
</li>
</ul>
</div>