Adding a close button on tabs

This commit is contained in:
Rodolphe Breard 2013-05-26 18:58:13 +02:00
parent 978c8b0b09
commit d8bf26c324
2 changed files with 26 additions and 5 deletions

View file

@ -161,9 +161,9 @@ body {
} }
#tab-lst > li { #tab-lst > li {
display: inline; display: inline-block;
margin: 0; margin: 0;
padding: 2px 20px 2px 20px; padding: 2px 0px 2px 20px;
color: #f3f3f3; color: #f3f3f3;
cursor: pointer; cursor: pointer;
background-color: #6c9ec0; background-color: #6c9ec0;
@ -171,6 +171,11 @@ body {
border-left: 1px solid #347db0; border-left: 1px solid #347db0;
} }
#tab-lst > li > span {
display: inline-block;
margin-right: 15px;
}
#tab-lst > li > span::selection { #tab-lst > li > span::selection {
background: transparent; background: transparent;
} }
@ -184,13 +189,19 @@ body {
color: #c43434; color: #c43434;
} }
.close-tab {
float: right;
margin: 3px 3px 0 0;
cursor: pointer;
}
/* /*
* Chat * Chat
*/ */
#tab-body-wrapper { #tab-body-wrapper {
margin: 2px 1px; margin: 0px 1px;
padding: 0; padding: 0;
height: calc(100% - 20px); height: calc(100% - 20px);
height: -webkit-calc(100% - 20px); height: -webkit-calc(100% - 20px);

View file

@ -31,15 +31,24 @@ Tab.prototype.filterName = function(name) {
}; };
Tab.prototype.initListElement = function() { Tab.prototype.initListElement = function() {
var inner = document.createElement("span"); var inner = document.createElement("span"), close = document.createElement("img");
close.src = "img/delcontact.png";
close.alt = "x";
close.title = "Close tab";
close.classList.add("close-tab");
inner.innerHTML = this.name; inner.innerHTML = this.name;
this.el_lst = document.createElement("li"); this.el_lst = document.createElement("li");
this.el_lst.addEventListener("click", (function(elem) { inner.addEventListener("click", (function(elem) {
return function() { return function() {
elem.show(); elem.show();
}; };
})(this), false); })(this), false);
close.addEventListener("click", (function(elem) {
return function() {
elem.close();
};
})(this), false);
this.el_lst.addEventListener("dblclick", (function(elem) { this.el_lst.addEventListener("dblclick", (function(elem) {
return function() { return function() {
elem.close(); elem.close();
@ -47,6 +56,7 @@ Tab.prototype.initListElement = function() {
})(this), false); })(this), false);
this.el_lst.appendChild(inner); this.el_lst.appendChild(inner);
this.el_lst.appendChild(close);
this.wr_lst.appendChild(this.el_lst); this.wr_lst.appendChild(this.el_lst);
}; };