From 73ddddf00f393afa023a34029e9deaaf214e4459 Mon Sep 17 00:00:00 2001
From: Cory Chaplin <cory.chaplin@laposte.net>
Date: Tue, 11 Feb 2014 00:03:42 +0100
Subject: [PATCH] Chanlist styling

---
 client/assets/themes/basic/style.css   | 23 +++++++++++++++++++++++
 client/assets/themes/cli/style.css     | 23 +++++++++++++++++++++++
 client/assets/themes/mini/style.css    | 23 +++++++++++++++++++++++
 client/assets/themes/relaxed/style.css | 23 +++++++++++++++++++++++
 client/src/applets/chanlist.js         | 22 +++++++++++-----------
 client/src/index.html.tmpl             |  4 ++--
 6 files changed, 105 insertions(+), 13 deletions(-)

diff --git a/client/assets/themes/basic/style.css b/client/assets/themes/basic/style.css
index f676b3c..7295569 100644
--- a/client/assets/themes/basic/style.css
+++ b/client/assets/themes/basic/style.css
@@ -296,6 +296,29 @@
     border-bottom-right-radius:0;
     border-top-right-radius:0;
 }
+#kiwi #chanlist {
+    margin: 0.5em 1em;
+}
+#kiwi #chanlist table {
+    border-collapse: collapse;
+    width: 100%;
+}
+#kiwi #chanlist thead {
+    text-align: center;
+}
+#kiwi #chanlist tbody td {
+    border: 1px solid #C4C4C4;
+    padding: 0.3em 1em;
+}
+#kiwi #chanlist .chanlist_name, #kiwi #chanlist .chanlist_num_users {
+    border-width: 0 1px 0 0;
+}
+#kiwi #chanlist .chanlist_topic {
+    border-width: 0;
+}
+#kiwi #chanlist tr:nth-child(even) {
+    background: none repeat scroll 0 0 #DBDBDB;
+}
 
 
 #kiwi .ui_menu .ui_menu_foot .close { float:right; font-size:0.9em; margin-right:1em; color: #999; }
diff --git a/client/assets/themes/cli/style.css b/client/assets/themes/cli/style.css
index e85c6e5..63910a6 100644
--- a/client/assets/themes/cli/style.css
+++ b/client/assets/themes/cli/style.css
@@ -233,6 +233,29 @@
 #kiwi.chanlist_treeview .tabs ul li { display:block; float:none; }
 #kiwi.chanlist_treeview .tabs ul li .activity { float:right; }
 #kiwi.chanlist_treeview .tabs ul li.active { padding-left:1em; }
+#kiwi #chanlist {
+    margin: 0.5em 1em;
+}
+#kiwi #chanlist table {
+    border-collapse: collapse;
+    width: 100%;
+}
+#kiwi #chanlist thead {
+    text-align: center;
+}
+#kiwi #chanlist tbody td {
+    border: 1px solid #454545;
+    padding: 0.3em 1em;
+}
+#kiwi #chanlist .chanlist_name, #kiwi #chanlist .chanlist_num_users {
+    border-width: 0 1px 0 0;
+}
+#kiwi #chanlist .chanlist_topic {
+    border-width: 0;
+}
+#kiwi #chanlist tr:nth-child(even) {
+    background: none repeat scroll 0 0 #2B2929;
+}
 
 
 #kiwi .ui_menu {
diff --git a/client/assets/themes/mini/style.css b/client/assets/themes/mini/style.css
index c181abc..5e8b685 100644
--- a/client/assets/themes/mini/style.css
+++ b/client/assets/themes/mini/style.css
@@ -113,6 +113,29 @@
 #kiwi.chanlist_treeview .tabs ul li { display:block; float:none; }
 #kiwi.chanlist_treeview .tabs ul li .activity { float:right; }
 #kiwi.chanlist_treeview .tabs ul li.active { padding-left:1em; }
+#kiwi #chanlist {
+    margin: 0.5em 1em;
+}
+#kiwi #chanlist table {
+    border-collapse: collapse;
+    width: 100%;
+}
+#kiwi #chanlist thead {
+    text-align: center;
+}
+#kiwi #chanlist tbody td {
+    border: 1px solid #C4C4C4;
+    padding: 0.3em 1em;
+}
+#kiwi #chanlist .chanlist_name, #kiwi #chanlist .chanlist_num_users {
+    border-width: 0 1px 0 0;
+}
+#kiwi #chanlist .chanlist_topic {
+    border-width: 0;
+}
+#kiwi #chanlist tr:nth-child(even) {
+    background: none repeat scroll 0 0 #DBDBDB;
+}
 
 
 
diff --git a/client/assets/themes/relaxed/style.css b/client/assets/themes/relaxed/style.css
index 7e9f65d..4e23ac7 100644
--- a/client/assets/themes/relaxed/style.css
+++ b/client/assets/themes/relaxed/style.css
@@ -357,6 +357,29 @@
     border-bottom-right-radius:0;
     border-top-right-radius:0;
 }
+#kiwi #chanlist {
+    margin: 0.5em 1em;
+}
+#kiwi #chanlist table {
+    border-collapse: collapse;
+    width: 100%;
+}
+#kiwi #chanlist thead {
+    text-align: center;
+}
+#kiwi #chanlist tbody td {
+    border: 1px solid #C4C4C4;
+    padding: 0.3em 1em;
+}
+#kiwi #chanlist .chanlist_name, #kiwi #chanlist .chanlist_num_users {
+    border-width: 0 1px 0 0;
+}
+#kiwi #chanlist .chanlist_topic {
+    border-width: 0;
+}
+#kiwi #chanlist tr:nth-child(even) {
+    background: none repeat scroll 0 0 #DBDBDB;
+}
 
 
 #kiwi .applet > div.settings button.save {
diff --git a/client/src/applets/chanlist.js b/client/src/applets/chanlist.js
index fb3cee3..60d73c2 100644
--- a/client/src/applets/chanlist.js
+++ b/client/src/applets/chanlist.js
@@ -3,16 +3,16 @@
     var View = Backbone.View.extend({
         events: {
             "click .chan": "chanClick",
-            "click #channels_name": "sortChannelsByNameClick",
-            "click #users": "sortChannelsByUsersClick"
+            "click #channel_name_title": "sortChannelsByNameClick",
+            "click #users_title": "sortChannelsByUsersClick"
         },
 
         
         
         initialize: function (options) {
             var text = {
-                channel_name: '<a id="channels_name">' + _kiwi.global.i18n.translate('client_applets_chanlist_channelname').fetch() + '</a>',
-                users: '<a id="users">' + _kiwi.global.i18n.translate('client_applets_chanlist_users').fetch() + '</a>',
+                channel_name: '<a id="channel_name_title">' + _kiwi.global.i18n.translate('client_applets_chanlist_channelname').fetch() + '</a>',
+                users: '<a id="users_title">' + _kiwi.global.i18n.translate('client_applets_chanlist_users').fetch() + '</a>',
                 topic: _kiwi.global.i18n.translate('client_applets_chanlist_topic').fetch()
             };
             this.$el = $(_.template($('#tmpl_channel_list').html().trim(), text));
@@ -45,21 +45,21 @@
             }
 
             // Clean the sorting icon and add the new one
-            $('#chanlist #users').find('span').remove();
-            $('#chanlist #channels_name').find('span').remove();
+            $('#chanlist #users_title').find('span').remove();
+            $('#chanlist #channel_name_title').find('span').remove();
             switch (this.order) {
                 case 'user_desc':
                 default:
-                    $('#users').append(icon_desc);
+                    $('#users_title').append(icon_desc);
                     break;
                 case 'user_asc':
-                    $('#users').append(icon_asc);
+                    $('#users_title').append(icon_asc);
                     break;
                 case 'name_asc':
-                    $('#channels_name').append(icon_asc);
+                    $('#channel_name_title').append(icon_asc);
                     break;
                 case 'name_desc':
-                    $('#channels_name').append(icon_desc);
+                    $('#channel_name_title').append(icon_desc);
                     break;
             }
             
@@ -209,7 +209,7 @@
             _.each(channels, function (chan) {
                 var row;
                 row = document.createElement("tr");
-                row.innerHTML = '<td><a class="chan" data-channel="' + chan.channel + '">' + _.escape(chan.channel) + '</a></td><td class="num_users" style="text-align: center;">' + chan.num_users + '</td><td style="padding-left: 2em;">' + formatIRCMsg(_.escape(chan.topic)) + '</td>';
+                row.innerHTML = '<td class="chanlist_name"><a class="chan" data-channel="' + chan.channel + '">' + _.escape(chan.channel) + '</a></td><td class="chanlist_num_users" style="text-align: center;">' + chan.num_users + '</td><td style="padding-left: 2em;" class="chanlist_topic">' + formatIRCMsg(_.escape(chan.topic)) + '</td>';
                 chan.dom = row;
                 that.view.channels.push(chan);
             });
diff --git a/client/src/index.html.tmpl b/client/src/index.html.tmpl
index f0406de..270b22b 100644
--- a/client/src/index.html.tmpl
+++ b/client/src/index.html.tmpl
@@ -338,8 +338,8 @@
 
 
     <script type="text/html" id="tmpl_channel_list">
-        <div>
-            <table id="chanlist" style="margin:1em 2em;">
+        <div id="chanlist">
+            <table>
                 <thead style="font-weight: bold;">
                     <tr>
                         <td><%= channel_name %></td>
-- 
2.25.1