diff --git a/chromesoul.css b/chromesoul.css index 7636075..6983178 100644 --- a/chromesoul.css +++ b/chromesoul.css @@ -161,9 +161,9 @@ body { } #tab-lst > li { - display: inline; + display: inline-block; margin: 0; - padding: 2px 20px 2px 20px; + padding: 2px 0px 2px 20px; color: #f3f3f3; cursor: pointer; background-color: #6c9ec0; @@ -171,6 +171,11 @@ body { border-left: 1px solid #347db0; } +#tab-lst > li > span { + display: inline-block; + margin-right: 15px; +} + #tab-lst > li > span::selection { background: transparent; } @@ -184,13 +189,19 @@ body { color: #c43434; } +.close-tab { + float: right; + margin: 3px 3px 0 0; + cursor: pointer; +} + /* * Chat */ #tab-body-wrapper { - margin: 2px 1px; + margin: 0px 1px; padding: 0; height: calc(100% - 20px); height: -webkit-calc(100% - 20px); diff --git a/lib/tab.nsui.js b/lib/tab.nsui.js index 75ff2cc..c4f8f26 100644 --- a/lib/tab.nsui.js +++ b/lib/tab.nsui.js @@ -31,15 +31,24 @@ Tab.prototype.filterName = function(name) { }; 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; this.el_lst = document.createElement("li"); - this.el_lst.addEventListener("click", (function(elem) { + inner.addEventListener("click", (function(elem) { return function() { elem.show(); }; })(this), false); + close.addEventListener("click", (function(elem) { + return function() { + elem.close(); + }; + })(this), false); this.el_lst.addEventListener("dblclick", (function(elem) { return function() { elem.close(); @@ -47,6 +56,7 @@ Tab.prototype.initListElement = function() { })(this), false); this.el_lst.appendChild(inner); + this.el_lst.appendChild(close); this.wr_lst.appendChild(this.el_lst); };