From 2b1afa724aad76f9c7782fa77397bc2b4b8f117a Mon Sep 17 00:00:00 2001
From: Aaron Kollasch <aaron@kollasch.dev>
Date: Wed, 3 Nov 2021 13:14:26 -0400
Subject: [PATCH] Add toolbar icon color

---
 src/css/popup.css | 2 +-
 src/js/popup.js   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/css/popup.css b/src/css/popup.css
index d07c25e..05a520e 100644
--- a/src/css/popup.css
+++ b/src/css/popup.css
@@ -61,7 +61,7 @@
   --icon-button-size: calc(calc(var(--block-line-separation-size) * 2) + 1.66rem); /* 20px */
   --inactive-opacity: 0.3;
   --overflow-size: 1px;
-  --icon-fit: 8;
+  --icon-fit: 9;
 
   background: var(--bgColor);
   margin-block: 0;
diff --git a/src/js/popup.js b/src/js/popup.js
index c52fe50..d874dc1 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -1813,7 +1813,7 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
       return Utils.escaped`<input type="radio" value="${containerColor}" name="container-color" id="edit-container-panel-choose-color-${containerColor}" />
      <label for="edit-container-panel-choose-color-${containerColor}" class="usercontext-icon choose-color-icon" data-identity-icon="circle" data-identity-color="${containerColor}">`;
     };
-    const colors = ["blue", "turquoise", "green", "yellow", "orange", "red", "pink", "purple"];
+    const colors = ["blue", "turquoise", "green", "yellow", "orange", "red", "pink", "purple", "toolbar"];
     const colorRadioFieldset = document.getElementById("edit-container-panel-choose-color");
     colors.forEach((containerColor) => {
       const templateInstance = document.createElement("div");