presence: Avoid doc/naming references to "orange".

It seems like orange is the loudest possible color to
denote a quasi-neutral-idle state, so we hope to
replace it with another color.

This commit does not change any styling.

I removed the sentences in the doc, since they are
kind of too vague to be useful. If we want to say that
the idle state is correlated with the half-orange
circles in the buddy list, then we want to say that
more specifically.

docs/subsystems/presence.md

@@ -23,11 +23,10 @@ requests contains a few parameters. The most important is "status",
 which had 2 valid values:
 
 - "active" -- this means the user has interacted with the client
-  recently. We use this for the "green" state in the web app.
+  recently.
 - "idle" -- the user has not interacted with the client recently.
   This is important for the case where a user left a Zulip tab open on
-  their desktop at work and went home for the weekend. We use this
-  for the "orange" state in the web app.
+  their desktop at work and went home for the weekend.
 
 The client receives in the response to that request a data set that,
 for each user, contains their status and timestamp that we last heard

frontend_tests/node_tests/buddy_data.js

@@ -142,7 +142,7 @@ test("user_circle, level, status_description", () => {
     assert.equal(buddy_data.get_user_circle_class(me.user_id), "user_circle_green");
 
     set_presence(fred.user_id, "idle");
-    assert.equal(buddy_data.get_user_circle_class(fred.user_id), "user_circle_orange");
+    assert.equal(buddy_data.get_user_circle_class(fred.user_id), "user_circle_idle");
     assert.equal(buddy_data.level(fred.user_id), 2);
     assert.equal(buddy_data.status_description(fred.user_id), "translated: Idle");
 

static/js/buddy_data.js

@@ -41,7 +41,7 @@ export function get_user_circle_class(user_id) {
         case "active":
             return "user_circle_green";
         case "idle":
-            return "user_circle_orange";
+            return "user_circle_idle";
         case "away_them":
         case "away_me":
             return "user_circle_empty_line";

static/styles/user_circles.css

@@ -1,5 +1,7 @@
+$idle_color: hsl(29, 84%, 51%);
+
 .user_circle_green,
-.user_circle_orange,
+.user_circle_idle,
 .user_circle_empty,
 .user_circle_empty_line {
     border-radius: 50%;
@@ -14,12 +16,12 @@
     border-color: hsl(106, 74%, 44%);
 }
 
-.user_circle_orange {
-    border-color: hsl(29, 84%, 51%);
+.user_circle_idle {
+    border-color: $idle_color;
     background: linear-gradient(
         to bottom,
         hsla(0, 0%, 100%, 0) 50%,
-        hsla(29, 84%, 51%, 1) 50%
+        $idle_color 50%
     );
 }