From da913c425793982bbd7495787f316e1cec11c5cd Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Sat, 26 Jan 2019 22:45:20 -0500
Subject: [PATCH 1/7] moved icon style from Sources.css to Svg.css

---
 src/components/PrimaryPanes/Sources.css | 46 -------------------------
 src/components/shared/SourceIcon.css    |  6 ----
 src/components/shared/Svg.css           | 31 +++++++++++++++++
 3 files changed, 31 insertions(+), 52 deletions(-)

diff --git a/src/components/PrimaryPanes/Sources.css b/src/components/PrimaryPanes/Sources.css
index bc5dae4d33..57208ef2e2 100644
--- a/src/components/PrimaryPanes/Sources.css
+++ b/src/components/PrimaryPanes/Sources.css
@@ -26,31 +26,10 @@
   border-bottom: 1px solid var(--theme-splitter-color);
 }
 
-.sources-clear-root i {
-  margin-right: 5px;
-  position: relative;
-}
-
-.sources-clear-root svg {
-  width: 13px;
-  height: 13px;
-}
-
 .theme-dark .sources-clear-root {
   fill: var(--theme-body-color);
 }
 
-.sources-clear-root .home {
-  opacity: 0.5;
-}
-
-.sources-clear-root .breadcrumb {
-  width: 5px;
-  margin: 0 2px 0 6px;
-  vertical-align: bottom;
-  background: var(--theme-body-color-alt);
-}
-
 .sources-clear-root-label {
   margin-left: 5px;
 }
@@ -80,15 +59,6 @@
   width: 100%;
 }
 
-.sources-list .img {
-  margin-inline-end: 5px;
-}
-
-.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
-.sources-list .managed-tree .tree .node.focused .img.blackBox {
-  background: #ffffff;
-}
-
 .sources-list .tree .label .suffix {
   font-style: italic;
   font-size: 0.9em;
@@ -212,22 +182,6 @@
   margin-top: 4px;
 }
 
-.sources-list .managed-tree .tree .node .img.blackBox {
-  mask: url(/images/blackBox.svg) no-repeat;
-  mask-size: 100%;
-  background-color: var(--theme-highlight-blue);
-  width: 13px;
-  height: 13px;
-  display: inline-block;
-  margin-inline-end: 6px;
-  margin-inline-start: 1px;
-  margin-top: 2px;
-}
-
-.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
-  background-color: var(--theme-body-color);
-}
-
 /*
   Custom root styles
 */
diff --git a/src/components/shared/SourceIcon.css b/src/components/shared/SourceIcon.css
index 000d4da84d..486896e58a 100644
--- a/src/components/shared/SourceIcon.css
+++ b/src/components/shared/SourceIcon.css
@@ -28,12 +28,6 @@
   background-size: 13px 13px;
 }
 
-.source-icon.blackBox {
-  mask: url(/images/blackBox.svg) no-repeat;
-  mask-size: 100%;
-  background: var(--theme-highlight-blue);
-}
-
 .source-icon.react {
   mask-size: 100%;
   background: var(--theme-highlight-bluegrey);
diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index cff2551d7e..17a7a5fb49 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -78,6 +78,7 @@
 .img.javascript {
   mask: url(/images/javascript.svg) no-repeat;
   mask-size: 100%;
+  margin-inline-end: 5px;
 }
 
 .img.tab {
@@ -255,11 +256,16 @@ span.img.marko {
 .img.breadcrumb {
   mask: url(/images/breadcrumbs-divider.svg) no-repeat;
   mask-size: 100%;
+  width: 5px;
+  margin: 0 2px 0 6px;
+  vertical-align: bottom;
+  background: var(--theme-body-color-alt);
 }
 
 .img.home {
   mask: url(/images/home.svg) no-repeat;
   mask-size: 100%;
+  opacity: 0.5;
 }
 
 .img.angular {
@@ -395,3 +401,28 @@ html[dir="rtl"] .arrow,
 .source-icon svg {
   fill: var(--theme-comment);
 }
+
+.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
+.sources-list .managed-tree .tree .node.focused .img.blackBox {
+  background: #ffffff;
+}
+
+/* Blackbox stuff */
+.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
+  background-color: var(--theme-body-color);
+}
+
+.img.blackBox {
+  mask: url(/images/blackBox.svg) no-repeat;
+  mask-size: 100%;
+  background-color: var(--theme-highlight-blue);
+}
+
+.sources-list .img.blackBox {
+  width: 13px;
+  height: 13px;
+  margin-top: 2px;
+  margin-inline-start: 1px;
+  margin-inline-end: 6px;
+}
+/* Blackbox stuff end */

From 8e1bf896d13105345b14490c6e16c5c79ee78b7a Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Sun, 27 Jan 2019 00:10:43 -0500
Subject: [PATCH 2/7] moved SourceIcon.css styles to Svg.css

---
 src/components/shared/SourceIcon.css | 34 -------------
 src/components/shared/Svg.css        | 74 +++++++++++++++++-----------
 2 files changed, 45 insertions(+), 63 deletions(-)

diff --git a/src/components/shared/SourceIcon.css b/src/components/shared/SourceIcon.css
index 486896e58a..e69de29bb2 100644
--- a/src/components/shared/SourceIcon.css
+++ b/src/components/shared/SourceIcon.css
@@ -1,34 +0,0 @@
-.source-icon {
-  position: relative;
-  background-color: var(--theme-comment);
-  mask-size: 100%;
-  display: inline-block;
-  margin-inline-end: 5px;
-}
-
-.source-icon {
-  width: 15px;
-  height: 15px;
-}
-
-.source-icon.prettyPrint {
-  mask: url(/images/prettyPrint.svg) no-repeat;
-  mask-size: 100%;
-  background: var(--theme-highlight-blue);
-  fill: var(--theme-textbox-box-shadow);
-}
-
-.source-icon.vue {
-  background: url(/images/vuejs.svg) 1px 1px no-repeat;
-  background-size: 15px;
-}
-
-.source-icon.angular {
-  background: url(/images/angular.svg) 1px 1px no-repeat;
-  background-size: 13px 13px;
-}
-
-.source-icon.react {
-  mask-size: 100%;
-  background: var(--theme-highlight-bluegrey);
-}
diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index 17a7a5fb49..2a42dcec25 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -89,6 +89,7 @@
 .img.react {
   mask: url(/images/react.svg) no-repeat;
   mask-size: 100%;
+  background: var(--theme-highlight-bluegrey);
 }
 
 .img.aframe {
@@ -271,6 +272,7 @@ span.img.marko {
 .img.angular {
   background-image: url(/images/angular.svg);
   background-repeat: no-repeat;
+  margin-inline-end: 6px;
 }
 
 .img.angular,
@@ -354,6 +356,49 @@ span.img.marko {
   transition: transform 0.18s ease;
 }
 
+/* source icon specific styles */
+.source-icon {
+  width: 15px;
+  height: 15px;
+  position: relative;
+  background-color: var(--theme-comment);
+  mask-size: 100%;
+  display: inline-block;
+  margin-inline-end: 5px;
+}
+
+.img.blackBox {
+  mask: url(/images/blackBox.svg) no-repeat;
+  mask-size: 100%;
+  background-color: var(--theme-highlight-blue);
+}
+
+.sources-list .img.blackBox {
+  width: 13px;
+  height: 13px;
+  margin-top: 2px;
+  margin-inline-start: 1px;
+  margin-inline-end: 6px;
+}
+
+.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
+.sources-list .managed-tree .tree .node.focused .img.blackBox {
+  background: #ffffff;
+}
+
+.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
+  background-color: var(--theme-body-color);
+}
+
+.source-icon.prettyPrint {
+  mask: url(/images/prettyPrint.svg) no-repeat;
+  mask-size: 100%;
+  background: var(--theme-highlight-blue);
+  fill: var(--theme-textbox-box-shadow);
+}
+/* source icon specific styles */
+
+
 /* overrides tree component */
 .tree-node button.arrow {
   background: none;
@@ -397,32 +442,3 @@ html[dir="rtl"] .arrow,
 .theme-dark .webpack {
   opacity: 0.5;
 }
-
-.source-icon svg {
-  fill: var(--theme-comment);
-}
-
-.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
-.sources-list .managed-tree .tree .node.focused .img.blackBox {
-  background: #ffffff;
-}
-
-/* Blackbox stuff */
-.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
-  background-color: var(--theme-body-color);
-}
-
-.img.blackBox {
-  mask: url(/images/blackBox.svg) no-repeat;
-  mask-size: 100%;
-  background-color: var(--theme-highlight-blue);
-}
-
-.sources-list .img.blackBox {
-  width: 13px;
-  height: 13px;
-  margin-top: 2px;
-  margin-inline-start: 1px;
-  margin-inline-end: 6px;
-}
-/* Blackbox stuff end */

From 7f1eb4e3fddd0d92aa226e3bbd9e7c6f79b9ed2b Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Sun, 27 Jan 2019 00:14:02 -0500
Subject: [PATCH 3/7] linter

---
 src/components/shared/Svg.css | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index 2a42dcec25..7bd7aaa9e2 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -356,7 +356,7 @@ span.img.marko {
   transition: transform 0.18s ease;
 }
 
-/* source icon specific styles */
+/* source icon specific styles start*/
 .source-icon {
   width: 15px;
   height: 15px;
@@ -396,8 +396,7 @@ span.img.marko {
   background: var(--theme-highlight-blue);
   fill: var(--theme-textbox-box-shadow);
 }
-/* source icon specific styles */
-
+/* source icon specific styles end*/
 
 /* overrides tree component */
 .tree-node button.arrow {

From 748e661cdb8c7c721a7bda4a461b9b787e519d9c Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Mon, 28 Jan 2019 09:17:22 -0500
Subject: [PATCH 4/7] Refactored .blackBox styles

---
 src/components/shared/Svg.css | 25 +++++++++----------------
 1 file changed, 9 insertions(+), 16 deletions(-)

diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index 7bd7aaa9e2..dfc2e5e178 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -263,6 +263,12 @@ span.img.marko {
   background: var(--theme-body-color-alt);
 }
 
+.img.blackBox {
+  mask: url(/images/blackBox.svg) no-repeat;
+  mask-size: 100%;
+  background-color: var(--theme-highlight-blue);
+}
+
 .img.home {
   mask: url(/images/home.svg) no-repeat;
   mask-size: 100%;
@@ -356,7 +362,7 @@ span.img.marko {
   transition: transform 0.18s ease;
 }
 
-/* source icon specific styles start*/
+/* Source icons */
 .source-icon {
   width: 15px;
   height: 15px;
@@ -367,20 +373,6 @@ span.img.marko {
   margin-inline-end: 5px;
 }
 
-.img.blackBox {
-  mask: url(/images/blackBox.svg) no-repeat;
-  mask-size: 100%;
-  background-color: var(--theme-highlight-blue);
-}
-
-.sources-list .img.blackBox {
-  width: 13px;
-  height: 13px;
-  margin-top: 2px;
-  margin-inline-start: 1px;
-  margin-inline-end: 6px;
-}
-
 .sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
 .sources-list .managed-tree .tree .node.focused .img.blackBox {
   background: #ffffff;
@@ -390,13 +382,14 @@ span.img.marko {
   background-color: var(--theme-body-color);
 }
 
+/* Can't replicate .prettyPrint (see issue #7784). Once resolved, */
+/* selector can be changed to .img.prettyPrint for consistency */
 .source-icon.prettyPrint {
   mask: url(/images/prettyPrint.svg) no-repeat;
   mask-size: 100%;
   background: var(--theme-highlight-blue);
   fill: var(--theme-textbox-box-shadow);
 }
-/* source icon specific styles end*/
 
 /* overrides tree component */
 .tree-node button.arrow {

From d07f66c78059cad6b2d64a0e506baaff35388873 Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Mon, 28 Jan 2019 09:25:37 -0500
Subject: [PATCH 5/7] Removed SourceIcon.css

---
 src/components/shared/SourceIcon.css | 0
 src/components/shared/SourceIcon.js  | 2 --
 2 files changed, 2 deletions(-)
 delete mode 100644 src/components/shared/SourceIcon.css

diff --git a/src/components/shared/SourceIcon.css b/src/components/shared/SourceIcon.css
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/src/components/shared/SourceIcon.js b/src/components/shared/SourceIcon.js
index 777b860ddd..f230e4ab8f 100644
--- a/src/components/shared/SourceIcon.js
+++ b/src/components/shared/SourceIcon.js
@@ -17,8 +17,6 @@ import { getSourceMetaData, getTabs } from "../../selectors";
 import type { Source } from "../../types";
 import type { SourceMetaDataType } from "../../reducers/ast";
 
-import "./SourceIcon.css";
-
 type Props = {
   source: Source,
   // sourceMetaData will provide framework information

From 477ac3d0d6e13138a5463cf2bcab6d36821446b4 Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Mon, 28 Jan 2019 10:07:11 -0500
Subject: [PATCH 6/7] Took out non-base icon styles and put them back in
 SourceIcon.css

---
 src/components/shared/SourceIcon.css | 18 +++++++++++++
 src/components/shared/SourceIcon.js  |  2 ++
 src/components/shared/Svg.css        | 38 +++++++---------------------
 3 files changed, 29 insertions(+), 29 deletions(-)
 create mode 100644 src/components/shared/SourceIcon.css

diff --git a/src/components/shared/SourceIcon.css b/src/components/shared/SourceIcon.css
new file mode 100644
index 0000000000..35a06cb30c
--- /dev/null
+++ b/src/components/shared/SourceIcon.css
@@ -0,0 +1,18 @@
+.source-icon {
+  width: 15px;
+  height: 15px;
+  position: relative;
+  background-color: var(--theme-comment);
+  mask-size: 100%;
+  display: inline-block;
+  margin-inline-end: 5px;
+}
+
+.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
+.sources-list .managed-tree .tree .node.focused .img.blackBox {
+  background: #ffffff;
+}
+
+.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
+  background-color: var(--theme-body-color);
+}
diff --git a/src/components/shared/SourceIcon.js b/src/components/shared/SourceIcon.js
index f230e4ab8f..777b860ddd 100644
--- a/src/components/shared/SourceIcon.js
+++ b/src/components/shared/SourceIcon.js
@@ -17,6 +17,8 @@ import { getSourceMetaData, getTabs } from "../../selectors";
 import type { Source } from "../../types";
 import type { SourceMetaDataType } from "../../reducers/ast";
 
+import "./SourceIcon.css";
+
 type Props = {
   source: Source,
   // sourceMetaData will provide framework information
diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index dfc2e5e178..330c8c76f6 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -281,6 +281,15 @@ span.img.marko {
   margin-inline-end: 6px;
 }
 
+/* Can't replicate .prettyPrint (see issue #7784). Once resolved, */
+/* selector can be changed to .img.prettyPrint for consistency */
+.source-icon.prettyPrint {
+  mask: url(/images/prettyPrint.svg) no-repeat;
+  mask-size: 100%;
+  background: var(--theme-highlight-blue);
+  fill: var(--theme-textbox-box-shadow);
+}
+
 .img.angular,
 .img.webpack,
 .img.vue,
@@ -362,35 +371,6 @@ span.img.marko {
   transition: transform 0.18s ease;
 }
 
-/* Source icons */
-.source-icon {
-  width: 15px;
-  height: 15px;
-  position: relative;
-  background-color: var(--theme-comment);
-  mask-size: 100%;
-  display: inline-block;
-  margin-inline-end: 5px;
-}
-
-.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
-.sources-list .managed-tree .tree .node.focused .img.blackBox {
-  background: #ffffff;
-}
-
-.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
-  background-color: var(--theme-body-color);
-}
-
-/* Can't replicate .prettyPrint (see issue #7784). Once resolved, */
-/* selector can be changed to .img.prettyPrint for consistency */
-.source-icon.prettyPrint {
-  mask: url(/images/prettyPrint.svg) no-repeat;
-  mask-size: 100%;
-  background: var(--theme-highlight-blue);
-  fill: var(--theme-textbox-box-shadow);
-}
-
 /* overrides tree component */
 .tree-node button.arrow {
   background: none;

From d97d56342c244ce7a256ce0fdd4910e84f58c772 Mon Sep 17 00:00:00 2001
From: Jaril <jarilvalenciano@gmail.com>
Date: Tue, 29 Jan 2019 22:35:33 -0500
Subject: [PATCH 7/7] split up styles into respective components

---
 src/components/PrimaryPanes/Sources.css | 30 +++++++++++++++++
 src/components/shared/SourceIcon.css    |  9 -----
 src/components/shared/Svg.css           | 44 +++++++------------------
 3 files changed, 41 insertions(+), 42 deletions(-)

diff --git a/src/components/PrimaryPanes/Sources.css b/src/components/PrimaryPanes/Sources.css
index 57208ef2e2..33217202a1 100644
--- a/src/components/PrimaryPanes/Sources.css
+++ b/src/components/PrimaryPanes/Sources.css
@@ -91,6 +91,36 @@
   display: inline-block;
 }
 
+.sources-list .source-icon {
+  top: 2px;
+}
+
+.sources-list .img.angular,
+.sources-list .img.webpack,
+.sources-list .img.vue,
+.sources-list .img.aframe,
+.sources-list .img.dojo,
+.sources-list .img.ember,
+.sources-list .img.marko,
+.sources-list .img.mobx,
+.sources-list .img.nextjs,
+.sources-list .img.nuxtjs,
+.sources-list .img.preact,
+.sources-list .img.pug,
+.sources-list .img.rxjs,
+.sources-list .img.sencha-extjs {
+  top: 3px;
+}
+
+.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
+.sources-list .managed-tree .tree .node.focused .img.blackBox {
+  background: #ffffff;
+}
+
+.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
+  background-color: var(--theme-body-color);
+}
+
 .no-sources-message {
   width: 100%;
   font-style: italic;
diff --git a/src/components/shared/SourceIcon.css b/src/components/shared/SourceIcon.css
index 35a06cb30c..11e5b8f7bf 100644
--- a/src/components/shared/SourceIcon.css
+++ b/src/components/shared/SourceIcon.css
@@ -7,12 +7,3 @@
   display: inline-block;
   margin-inline-end: 5px;
 }
-
-.sources-list .tree .focused .img:not(.vue):not(.angular):not(.webpack):not(.dojo):not(.ember):not(.aframe):not(.marko):not(.mobx):not(.nextjs):not(.nuxtjs):not(.preact):not(.pug):not(.rxjs):not(.sencha-extjs),
-.sources-list .managed-tree .tree .node.focused .img.blackBox {
-  background: #ffffff;
-}
-
-.theme-dark .sources-list .managed-tree .tree .node .img.blackBox {
-  background-color: var(--theme-body-color);
-}
diff --git a/src/components/shared/Svg.css b/src/components/shared/Svg.css
index 330c8c76f6..afd86e2aa0 100644
--- a/src/components/shared/Svg.css
+++ b/src/components/shared/Svg.css
@@ -21,7 +21,6 @@
 .worker,
 .file,
 .folder,
-.sources-list .source-icon,
 .extension {
   position: relative;
   top: 2px;
@@ -78,7 +77,6 @@
 .img.javascript {
   mask: url(/images/javascript.svg) no-repeat;
   mask-size: 100%;
-  margin-inline-end: 5px;
 }
 
 .img.tab {
@@ -197,7 +195,6 @@ span.img.marko {
 
 .img.vue {
   background: url(/images/vuejs.svg) 1px 1px no-repeat;
-  background-size: 15px;
 }
 
 .img.typescript {
@@ -278,7 +275,6 @@ span.img.marko {
 .img.angular {
   background-image: url(/images/angular.svg);
   background-repeat: no-repeat;
-  margin-inline-end: 6px;
 }
 
 /* Can't replicate .prettyPrint (see issue #7784). Once resolved, */
@@ -311,27 +307,20 @@ span.img.marko {
   position: relative;
 }
 
-.sources-list .img.angular,
-.sources-list .img.webpack,
-.sources-list .img.vue,
-.sources-list .img.aframe,
-.sources-list .img.dojo,
-.sources-list .img.ember,
-.sources-list .img.marko,
-.sources-list .img.mobx,
-.sources-list .img.nextjs,
-.sources-list .img.nuxtjs,
-.sources-list .img.preact,
-.sources-list .img.pug,
-.sources-list .img.rxjs,
-.sources-list .img.sencha-extjs {
-  top: 3px;
+.img.angular,
+.img.webpack {
+  opacity: 0.8;
+  margin-inline-end: 5px;
+}
+
+.theme-dark .img.angular,
+.theme-dark .webpack {
+  opacity: 0.5;
 }
 
 .img.domain,
 .img.folder,
 .img.file,
-.sources-list .img.source-icon,
 .img.extension,
 .img.worker {
   mask-size: 100%;
@@ -348,8 +337,7 @@ span.img.marko {
 
 .img.refresh,
 .img.shortcut,
-.img.worker,
-.img.arrow {
+.img.worker {
   margin-inline-end: 5px;
 }
 
@@ -360,7 +348,7 @@ span.img.marko {
 
 .img.arrow {
   mask: url(/images/arrow.svg);
-  margin-inline-end: 4px;
+  margin-inline-end: 5px;
   width: 10px;
   height: 10px;
   padding-top: 9px;
@@ -404,13 +392,3 @@ html[dir="rtl"] .arrow,
 .arrow.hidden {
   visibility: hidden;
 }
-
-.angular,
-.webpack {
-  opacity: 0.8;
-}
-
-.theme-dark .angular,
-.theme-dark .webpack {
-  opacity: 0.5;
-}