Add site color variables to ui-colors

These are used by the collaboration package to represent
participants in the current session.

static/ui-colors.less

@@ -53,3 +53,10 @@
 @accent-color-success-1: #1fe977;
 @accent-color-success-2: #17ca65;
 @accent-color-success-3: #58f79d;
+
+// Distinct colors for site representations
+@site-color-1: #f00;
+@site-color-2: #0f0;
+@site-color-3: #00f;
+@site-color-4: #ff0;
+@site-color-5: #f0f;

themes/atom-dark-ui/collaboration.less

@@ -1,75 +0,0 @@
-@guest-color: #96cbfe;
-@running-color: #99cc99;
-
-@site-1-color: #4dd157;
-@site-2-color: #3facc1;
-@site-3-color: #db2ff4;
-@site-4-color: #f4541e;
-@site-5-color: #f5e11d;
-
-@action-icon-disabled-color: rgba(255, 255, 255, 0.5);
-@action-icon-disabled-hover-color: #fff;
-
-@action-icon-color: fade(@running-color, 80%);
-@action-icon-hover-color: @running-color;
-
-.site-colors(@site, @color) {
-  .collaboration-participant{
-    .site-@{site} {
-      background-color: @color;
-      &.lighter {
-        background-color: lighten(@color, 30%);
-      }
-    }
-  }
-  .editor .selection.site-@{site} .region {
-    background-color: darken(@color, 30%);
-  }
-  .editor .cursor.site-@{site} {
-    border-color: @color;
-    border-width: 2px;
-  }
-}
-
-.site-colors(1, @site-1-color);
-.site-colors(2, @site-2-color);
-.site-colors(3, @site-3-color);
-.site-colors(4, @site-4-color);
-.site-colors(5, @site-5-color);
-
-.site-colors(6, @site-1-color);
-.site-colors(7, @site-2-color);
-.site-colors(8, @site-3-color);
-.site-colors(9, @site-4-color);
-.site-colors(10, @site-5-color);
-
-.collaboration-status{
-  .guest {
-    color: @guest-color;
-  }
-
-  .running {
-    color: @running-color;
-    &:hover { color: lighten(@running-color, 15%); }
-  }
-}
-
-.collaboration-participant {
-  &.large{
-    .actions{
-      .remove:before, .toggle-audio.disabled:before, .toggle-video.disabled:before {
-        color: @action-icon-disabled-color;
-      }
-      .remove:hover:before, .toggle-audio.disabled:hover:before, .toggle-video.disabled:hover:before {
-        color: @action-icon-disabled-hover-color;
-      }
-
-      .toggle-audio:before, .toggle-video:before {
-        color: @action-icon-color;
-      }
-      .toggle-audio:hover:before, .toggle-video:hover:before {
-        color: @action-icon-hover-color;
-      }
-    }
-  }
-}

themes/atom-dark-ui/package.cson

@@ -10,7 +10,6 @@
   'blurred'
   'image-view'
   'archive-view'
-  'collaboration'
   'overlay'
   'buttons'
 ]

themes/atom-dark-ui/ui-colors.less

@@ -55,4 +55,10 @@
 
 @button-color-1: #303030;
 @button-color-hover-1: #353536;
-@button-color-active-1: #404040;
+@button-color-active-1: #404040;
+
+@site-color-1: #4dd157;
+@site-color-2: #3facc1;
+@site-color-3: #db2ff4;
+@site-color-4: #f4541e;
+@site-color-5: #f5e11d;

themes/atom-light-ui/collaboration.less

@@ -1,18 +0,0 @@
-@runningColor: #f78a46;
-
-.collaboration {
-  background: #dde3e8;
-  border-left: 1px solid #989898;
-
-  .guest {
-    color: #5293d8;
-  }
-
-  .running {
-    color: @runningColor;
-
-    &:hover {
-      color: darken(@runningColor, 10%);
-    }
-  }
-}

themes/atom-light-ui/package.cson

@@ -11,6 +11,5 @@
   'blurred'
   'image-view'
   'archive-view'
-  'collaboration'
   'buttons'
 ]

themes/atom-light-ui/ui-colors.less

@@ -49,4 +49,10 @@
 // Colors that are not standard for themes.
 @button-color-1: rgba(0,0,0,.15);
 @button-color-hover-1: rgba(0,0,0,.2);
-@button-color-active-1: rgba(0,0,0,.1);
+@button-color-active-1: rgba(0,0,0,.1);
+
+@site-color-1: #4dd157;
+@site-color-2: #3facc1;
+@site-color-3: #db2ff4;
+@site-color-4: #f4541e;
+@site-color-5: #f5e11d;