Add CC sticky sidebar headers feature

This commit introduces a feature which makes the headers in the CC
sidebar remain visible (by sticking at the top) when scrolling down.

The idea was taken from the suggestion made at pekb/thread/60784834.

Change-Id: I6bbab04da855dbfa35ff8f8b1bbbc6d15946c36c
diff --git a/src/_locales/ca/messages.json b/src/_locales/ca/messages.json
index 4a2d979..260c0f5 100644
--- a/src/_locales/ca/messages.json
+++ b/src/_locales/ca/messages.json
@@ -63,6 +63,10 @@
     "message": "Incrementa el contrast entre els fils llegits i no llegits a la Consola de la Comunitat.",
     "description": "Feature checkbox in the options page"
   },
+  "options_stickysidebarheaders": {
+    "message": "Fes que les capçaleres de la barra lateral de la Consola de la Comunitat es quedin enganxades a dalt (+info a <code>pekb/thread/60784834</code>).",
+    "description": "Feature checkbox in the options page"
+  },
   "options_save": {
     "message": "Desa",
     "description": "Button in the options page to save the settings"
diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
index 24b93c9..a02a2cb 100644
--- a/src/_locales/en/messages.json
+++ b/src/_locales/en/messages.json
@@ -59,6 +59,10 @@
     "message": "Enables the <code class=\"help\" title=\"This flag activates the functionality which allows a PE to move threads from a forum where they are currently a PE to another forum in the Community Console.\">enableMoveThread</code> Community Console flag.",
     "description": "Feature checkbox in the options page"
   },
+  "options_stickysidebarheaders": {
+    "message": "Make the headers in the Community Console sidebar stick at the top (+info at <code>pekb/thread/60784834</code>).",
+    "description": "Feature checkbox in the options page"
+  },
   "options_increasecontrast":{
     "message": "Increase contrast between read and unread threads in the Community Console.",
     "description": "Feature checkbox in the options page"
diff --git a/src/_locales/es/messages.json b/src/_locales/es/messages.json
index 2d075a1..38798b1 100644
--- a/src/_locales/es/messages.json
+++ b/src/_locales/es/messages.json
@@ -63,6 +63,10 @@
     "message": "Incrementa el contraste entre los hilos leídos y no leídos en la Consola de la Comunidad.",
     "description": "Feature checkbox in the options page"
   },
+  "options_stickysidebarheaders": {
+    "message": "Hacer que los encabezados de la barra lateral de la Consola de la Comunidad se queden pegados arriba (+info en <code>pekb/thread/60784834</code>).",
+    "description": "Feature checkbox in the options page"
+  },
   "options_save": {
     "message": "Guardar",
     "description": "Button in the options page to save the settings"
diff --git a/src/background.js b/src/background.js
index f83d807..315d6d8 100644
--- a/src/background.js
+++ b/src/background.js
@@ -13,7 +13,8 @@
   "batchduplicate": false,
   "escalatethreads": false,
   "movethreads": false,
-  "increasecontrast": false
+  "increasecontrast": false,
+  "stickysidebarheaders": false
 };
 
 function cleanUpOptions() {
diff --git a/src/console_inject.js b/src/console_inject.js
index b2ca80e..c97483b 100644
--- a/src/console_inject.js
+++ b/src/console_inject.js
@@ -88,4 +88,8 @@
   if (options.increasecontrast) {
     injectStyles(".thread-summary.read{background: #ecedee!important;}");
   }
+
+  if (options.stickysidebarheaders) {
+    injectStyles("material-drawer .main-header{background: #fff; position: sticky; top: 0; z-index: 1;}");
+  }
 });
diff --git a/src/options.html b/src/options.html
index b11393d..5bdb675 100644
--- a/src/options.html
+++ b/src/options.html
@@ -18,6 +18,7 @@
       <input type="checkbox" id="loaddrafts"> <label for="loaddrafts" data-i18n="loaddrafts"></label> <span style="color: gray;" data-i18n="experimental_label"></span><br>
       <input type="checkbox" id="batchduplicate"> <label for="batchduplicate" data-i18n="batchduplicate"></label> <span style="color: gray;" data-i18n="experimental_label"></span><br>
       <input type="checkbox" id="increasecontrast"> <label for="increasecontrast" data-i18n="increasecontrast"></label><br>
+      <input type="checkbox" id="stickysidebarheaders"> <label for="stickysidebarheaders" data-i18n="stickysidebarheaders"></label><br>
     </p>
     <p style="text-align: center;"><button id="save" data-i18n="save"></button></p>
     <script src="options.js"></script>
diff --git a/src/options.js b/src/options.js
index ebbf159..2bcd96f 100644
--- a/src/options.js
+++ b/src/options.js
@@ -13,7 +13,8 @@
   "batchduplicate": false,
   "escalatethreads": false,
   "movethreads": false,
-  "increasecontrast": false
+  "increasecontrast": false,
+  "stickysidebarheaders": false
 };
 
 const deprecatedOptions = [