UI improvements

* Implement visibility choice on board creation;

* Rework the board header bar. Remove links to un-implemented
features;

* Implement a board star counter (visible if the board have >2 stars);

* Define a new icon (a thin cross) to close elements;

* Remove $(document).on('mouseover') event handlers that were
basically fired hundreds of times for nothing, we now define a proper
Tracker dependency to execute jquery-ui plugin initialization only
when something has changed;

* Bug fixes related to list scrolling.

2 files changed, 41 insertions, 80 deletions

diff --git a/client/styles/icons.styl b/client/styles/icons.styl
new file mode 100644
index 00000000..4de0da2b
--- /dev/null
+++ b/client/styles/icons.styl
@@ -0,0 +1,28 @@
+.emoji
+  height: 18px
+  width: 18px
+  vertical-align: text-bottom
+
+// Implement a thiner close icon as suggested in
+// https://github.com/FortAwesome/Font-Awesome/issues/1540#issuecomment-68689950
+.fa.fa-times-thin:before
+  content: '\00d7';
+
+.fa.fa-globe.colorful
+  color: #4caf50
+
+.fa.fa-lock.colorful
+  color: #f44336
+
+.pop-over .pop-over-list li a:hover
+  .fa, .fa.colorful
+    color: white
+
+    &:hover
+      color: white
+
+a.fa, a i.fa
+  color: darken(white, 35%)
+
+  &:hover
+    color: darken(white, 60%)
diff --git a/client/styles/main.styl b/client/styles/main.styl
index 8d1f9591..521e1f56 100644
--- a/client/styles/main.styl
+++ b/client/styles/main.styl
@@ -1,5 +1,7 @@
 @import 'nib'
 
+global-reset()
+
 html, body, input, select, textarea, button
   font: 14px "Helvetica Neue", Arial, Helvetica, sans-serif
   line-height: 18px
@@ -7,77 +9,8 @@ html, body, input, select, textarea, button
 
 html
   font-size: 100%
-  -webkit-text-size-adjust: 100%
-
-p
-  margin: 0
-
-ol,
-ul
-  list-style: none
-  margin: 0
-  padding: 0
-
-blockquote, q
-  quotes: none
-
-  &:before,
-  &:after
-    content: none
-
-ins
-  text-decoration: none
-
-del
-  text-decoration: line-through
-
-table
-  border-collapse: collapse
-  border-spacing: 0
-  width: 100%
-
-hr
-  height: 1px
-  border: 0
-  border: none
-  width: 100%
-  background: #dbdbdb
-  color: #dbdbdb
-  margin: 15px 0
-  padding: 0
-
-article,
-aside,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section
-  display: block
-
-caption, th, td
-  text-align: left
-  font-weight: 400
-
-a img
-  border: none
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section,
-summary
-  display: block
-
-html
   max-height: 100%
+  -webkit-text-size-adjust: 100%
 
 body
   background: darken(white, 10%)
@@ -162,6 +95,16 @@ blockquote
   color: #666
   padding: 0 0 0 8px
 
+hr
+  height: 1px
+  border: 0
+  border: none
+  width: 100%
+  background: #dbdbdb
+  color: #dbdbdb
+  margin: 15px 0
+  padding: 0
+
 table, td, th
   vertical-align: top
   border-top: 1px solid #ccc
@@ -188,11 +131,6 @@ dl, dt
 dd
   margin: 0 0 16px 24px
 
-.emoji
-  height: 18px
-  width: 18px
-  vertical-align: text-bottom
-
 .edit
   display: none
   position: relative
@@ -285,7 +223,6 @@ dd
     right: 9px
 
   &.focus
-
     .member
       opacity: 1
 
@@ -408,10 +345,6 @@ dd
     top: 0
     width: 18px
 
-.chrome .minicard.ui-sortable-helper,
-.safari .minicard.ui-sortable-helper
-  box-shadow: -2px 2px 6px rgba(0, 0, 0, .2)
-
 input[type="text"].attachment-add-link-input
   float: left
   margin: 0 0 8px