From f3f819b67a98353ec36eadc8c45ae77faebc7956 Mon Sep 17 00:00:00 2001
From: JC Brand <jc@opkode.com>
Date: Mon, 10 Dec 2018 15:01:07 +0100
Subject: [PATCH] CSS: Also color the room and contact toggles

---
 css/converse.css      | 14 ++++++++++++++
 sass/_bookmarks.scss  | 11 +++++++++++
 sass/_controlbox.scss |  8 ++++++++
 sass/_roster.scss     |  7 +++++++
 sass/_variables.scss  |  3 ++-
 5 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/css/converse.css b/css/converse.css
index 2af7560d3..b53ca4537 100644
--- a/css/converse.css
+++ b/css/converse.css
@@ -9320,6 +9320,7 @@ readers do not read off random characters that represent icons */
   --flyout-padding: 1.2em;
   --chat-head-color: #3AA569;
   --chat-head-color-dark: #1E9652;
+  --chat-head-color-darker: #0E763B;
   --chat-head-color-lighten-50-percent: #e7f7ee;
   --chat-head-text-color: white;
   --chat-correcting-color: var(--chat-head-color-lighten-50-percent);
@@ -10690,6 +10691,10 @@ body.reset {
 
 #conversejs #controlbox {
   margin-right: calc(3 * var(--chat-gutter)); }
+  #conversejs #controlbox .open-rooms-toggle, #conversejs #controlbox .open-rooms-toggle .fa {
+    color: var(--chatroom-head-color) !important; }
+    #conversejs #controlbox .open-rooms-toggle:hover, #conversejs #controlbox .open-rooms-toggle .fa:hover {
+      color: var(--chatroom-head-color-dark) !important; }
   #conversejs #controlbox .box-flyout {
     background-color: white; }
   #conversejs #controlbox.logged-out .box-flyout .controlbox-pane {
@@ -11190,6 +11195,10 @@ body.reset {
         width: 100%;
         padding-top: 0;
         padding-bottom: 0.3rem; }
+      #conversejs #converse-roster .roster-contacts .roster-group .group-toggle, #conversejs #converse-roster .roster-contacts .roster-group .group-toggle .fa {
+        color: var(--chat-head-color-dark) !important; }
+        #conversejs #converse-roster .roster-contacts .roster-group .group-toggle:hover, #conversejs #converse-roster .roster-contacts .roster-group .group-toggle .fa:hover {
+          color: var(--chat-head-color-darker) !important; }
       #conversejs #converse-roster .roster-contacts .roster-group li.requesting-xmpp-contact a {
         line-height: var(--line-height); }
       #conversejs #converse-roster .roster-contacts .roster-group li.requesting-xmpp-contact .req-contact-name {
@@ -12013,6 +12022,11 @@ body.reset {
   #conversejs.converse-overlayed #minimized-chats .chat-head-message-count-hidden {
     display: none; }
 
+#conversejs #controlbox .bookmarks-toggle, #conversejs #controlbox .bookmarks-toggle .fa {
+  color: var(--chatroom-head-color) !important; }
+  #conversejs #controlbox .bookmarks-toggle:hover, #conversejs #controlbox .bookmarks-toggle .fa:hover {
+    color: var(--chatroom-head-color-dark) !important; }
+
 #conversejs.fullscreen #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom a.open-room {
   width: 80%; }
 
diff --git a/sass/_bookmarks.scss b/sass/_bookmarks.scss
index f79747702..0dd8af09e 100644
--- a/sass/_bookmarks.scss
+++ b/sass/_bookmarks.scss
@@ -1,3 +1,14 @@
+#conversejs {
+    #controlbox {
+        .bookmarks-toggle, .bookmarks-toggle .fa {
+            color: var(--chatroom-head-color) !important;
+            &:hover {
+                color: var(--chatroom-head-color-dark) !important;
+            }
+        }
+    }
+}
+
 #conversejs.fullscreen {
     #controlbox {
         #chatrooms {
diff --git a/sass/_controlbox.scss b/sass/_controlbox.scss
index 8a92b6c71..a2605e421 100644
--- a/sass/_controlbox.scss
+++ b/sass/_controlbox.scss
@@ -61,6 +61,14 @@
     }
 
     #controlbox {
+
+        .open-rooms-toggle, .open-rooms-toggle .fa {
+            color: var(--chatroom-head-color) !important;
+            &:hover {
+                color: var(--chatroom-head-color-dark) !important;
+            }
+        }
+
         .box-flyout {
             background-color: white;
         }
diff --git a/sass/_roster.scss b/sass/_roster.scss
index 671493af2..1616dd137 100644
--- a/sass/_roster.scss
+++ b/sass/_roster.scss
@@ -67,6 +67,13 @@
                 padding-bottom: 0.3rem;
             }
 
+            .group-toggle, .group-toggle .fa {
+                color: var(--chat-head-color-dark) !important;
+                &:hover {
+                    color: var(--chat-head-color-darker) !important;
+                }
+            }
+
             li {
                 &.requesting-xmpp-contact {
                     a {
diff --git a/sass/_variables.scss b/sass/_variables.scss
index 75baa6e92..b8b7762b4 100644
--- a/sass/_variables.scss
+++ b/sass/_variables.scss
@@ -46,7 +46,8 @@ $font-path: "webfonts/icomoon/fonts/" !default;
     --flyout-padding: 1.2em;
 
     --chat-head-color: #3AA569; // $green
-    --chat-head-color-dark: #1E9652; // $green
+    --chat-head-color-dark: #1E9652;
+    --chat-head-color-darker: #0E763B;
     --chat-head-color-lighten-50-percent: #e7f7ee; // lighten($green, 50%)
     --chat-head-text-color: white;
     --chat-correcting-color: var(--chat-head-color-lighten-50-percent);