Inserted app.cssPrefix into static navicon.id + knobSpan.id in …

…`toggles.sidebar` ↞ [auto-sync from https://github.com/adamlui/ai-web-extensions]

greasemonkey/autoclear-chatgpt-history.user.js

@@ -225,7 +225,7 @@
 // @description:zu      Ziba itshala lokucabanga okuzoshintshwa ngokuzenzakalelayo uma ukubuka chatgpt.com
 // @author              Adam Lui
 // @namespace           https://github.com/adamlui
-// @version             2024.12.10.1
+// @version             2024.12.10.2
 // @license             MIT
 // @icon                https://media.autoclearchatgpt.com/images/icons/openai/black/icon48.png?a8868ef
 // @icon64              https://media.autoclearchatgpt.com/images/icons/openai/black/icon64.png?a8868ef
@@ -746,7 +746,7 @@
                 this.div = document.createElement('div')
 
                 // Create/ID/size/position navicon
-                const navicon = document.createElement('img') ; navicon.id = 'autoclear-toggle-navicon'
+                const navicon = document.createElement('img') ; navicon.id = `${app.cssPrefix}-toggle-navicon`
                 navicon.style.cssText = 'width: 1.25rem ; height: 1.25rem ; margin-left: 2px ; margin-right: 4px'
 
                 // Create/disable/hide checkbox
@@ -758,13 +758,13 @@
                 const switchSpan = document.createElement('span')
                 Object.assign(switchSpan.style, {
                     position: 'relative', left: `${ env.browser.isMobile ? 169 : !env.ui.firstLink ? 160 : 154 }px`,
+                    bottom: `${ !env.ui.firstLink ? -0.15 : 0 }em`, width: '30px', height: '15px',
                     backgroundColor: config.autoclear ? '#ccc' : '#AD68FF', // init opposite  final color
-                    bottom: `${ !env.ui.firstLink ? -0.15 : 0 }em`,
-                    width: '30px', height: '15px', '-webkit-transition': '.4s', transition: '0.4s',  borderRadius: '28px'
+                    '-webkit-transition': '.4s', transition: '0.4s',  borderRadius: '28px'
                 })
 
                 // Create/stylize knob, append to switch
-                const knobSpan = document.createElement('span') ; knobSpan.id = 'autoclear-toggle-knob-span'
+                const knobSpan = document.createElement('span') ; knobSpan.id = `${app.cssPrefix}-toggle-knob-span`
                 Object.assign(knobSpan.style, {
                     position: 'absolute', left: '3px', bottom: '1.25px',
                     width: '12px', height: '12px', content: '""', borderRadius: '28px',
@@ -806,7 +806,8 @@
             },
 
             insert() {
-                if (this.status?.startsWith('insert') || document.getElementById('autoclear-toggle-navicon')) return
+                if (this.status?.startsWith('insert') || document.getElementById(`${app.cssPrefix}-toggle-navicon`))
+                    return
                 this.status = 'inserting' ; if (!this.div) this.create()
 
                 // Insert toggle
@@ -815,8 +816,8 @@
                 sidebar.insertBefore(this.div, sidebar.children[1])
 
                 // Tweak styles
-                const knobSpan = document.getElementById('autoclear-toggle-knob-span'),
-                      navicon = document.getElementById('autoclear-toggle-navicon')
+                const knobSpan = document.getElementById(`${app.cssPrefix}-toggle-knob-span`),
+                      navicon = document.getElementById(`${app.cssPrefix}-toggle-navicon`)
                 this.div.style.flexGrow = 'unset' // overcome OpenAI .grow
                 this.div.style.paddingLeft = '8px'
                 if (knobSpan) knobSpan.style.boxShadow = (
@@ -915,7 +916,7 @@
 
     // Monitor NODE CHANGES to maintain sidebar toggle visibility
     new MutationObserver(() => {
-        if (!config.toggleHidden && !document.getElementById('autoclear-toggle-navicon')
+        if (!config.toggleHidden && !document.getElementById(`${app.cssPrefix}-toggle-navicon`)
             && toggles.sidebar.status != 'inserting') {
                 toggles.sidebar.status = 'missing' ; toggles.sidebar.insert() }
     }).observe(document.body, { attributes: true, subtree: true })