From 8df3aacb22f140c0cd75ef37fd3ec609bb3df299 Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Sun, 22 Nov 2020 12:53:24 +0300
Subject: [PATCH] oldUI: restore 'disabled' bubble + show 'usercss' fully

---
 manage/manage.css | 15 +++++++++++++++
 manage/manage.js  |  7 ++++++-
 2 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/manage/manage.css b/manage/manage.css
index a60b0634..9c11cf3e 100644
--- a/manage/manage.css
+++ b/manage/manage.css
@@ -232,6 +232,7 @@ a:hover {
   display: none;
 }
 
+.oldUI .disabled h2::after,
 .entry.usercss .style-name-link::after {
   font-size: 11px;
   border-radius: 4px;
@@ -240,6 +241,20 @@ a:hover {
   content: "UC";
   background-color: hsla(180, 35%, 50%, .35);
   padding: 2px 3px;
+  color: #000;
+}
+.oldUI .disabled h2::after {
+  content: var(--genericDisabledLabel);
+  text-transform: lowercase;
+  font-weight: normal;
+  background: rgba(128, 128, 128, .2);
+  padding: 2px 5px 3px;
+  vertical-align: middle;
+}
+.oldUI .entry.usercss .style-name-link::after {
+  content: "usercss";
+  font-weight: normal;
+  vertical-align: middle;
 }
 
 .disabled h2 .style-name-link,
diff --git a/manage/manage.js b/manage/manage.js
index 1cada1fd..eeb334fe 100644
--- a/manage/manage.js
+++ b/manage/manage.js
@@ -54,7 +54,11 @@ Object.assign(newUI, {
     id === 'sliders' ? `ui.${id}` :
       id === 'enabled' ? 'manage.newUI' :
         `manage.newUI.${id}`,
-  renderClass: () => document.documentElement.classList.toggle('newUI', newUI.enabled),
+  renderClass: () => {
+    const cl = document.documentElement.classList;
+    cl.toggle('newUI', newUI.enabled);
+    cl.toggle('oldUI', !newUI.enabled);
+  },
   tpl: {
     getToggle() {
       return t.template[newUI.sliders ? 'toggleSlider' : 'toggleChecker'].cloneNode(true);
@@ -112,6 +116,7 @@ const handleEvent = {};
   // translate CSS manually
   document.styleSheets[0].insertRule(
     `:root {${[
+      'genericDisabledLabel',
       'updateAllCheckSucceededSomeEdited',
       'filteredStylesAllHidden',
     ].map(id => `--${id}:"${CSS.escape(t(id))}";`).join('')