Last active
July 13, 2026 14:16
-
-
Save DarrenSem/0d9da09fc5a7b95abcc0df95d65b02c7 to your computer and use it in GitHub Desktop.
width.js - Bookmarklet for OpenAI playground to fix maxWidth of "Configure" panel (due to latest layout update); add as browser Favorite then click to toggle visibility
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // width.js - Bookmarklet for OpenAI playground to fix maxWidth of "Configure" panel (due to latest layout update); add as browser Favorite then click to toggle visibility | |
| // https://gist.github.com/DarrenSem/0d9da09fc5a7b95abcc0df95d65b02c7 | |
| //// 13Jul2026 723am: start over from scratch, making it the simplest possible ONE-LINER... | |
| // 740am: 287 char javascript:(a=>{"0px"==getComputedStyle(a).maxWidth?a.style.removeProperty("max-width"):a.style.setProperty("max-width","0px","important");document.querySelector("button[aria-label=\"Close panel\"]")?.click()})([...document.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop()) | |
| // [FINAL ANSWER] 803am: 287 char javascript:((a,b,c="max-width")=>{(b=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&("0px"==getComputedStyle(b).maxWidth?b.style.removeProperty(c):b.style.setProperty(c,"0px","important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document) | |
| ( (doc, configurePane, MW = "max-width") => { | |
| if (configurePane = [...doc.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ) { | |
| if ( getComputedStyle(configurePane).maxWidth != "0px" ) { | |
| configurePane.style.setProperty(MW, "0px", "important"); | |
| } else { | |
| configurePane.style.removeProperty(MW); | |
| }; | |
| }; | |
| doc.querySelector('button[aria-label="Close panel"]')?.click(); | |
| } )(document); | |
| // [FINAL ANSWER] 803am: 287 char javascript:((a,b,c="max-width")=>{(b=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&("0px"==getComputedStyle(b).maxWidth?b.style.removeProperty(c):b.style.setProperty(c,"0px","important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document) | |
| // ( (doc, MW, configurePane) => { | |
| // if ( configurePane = [...doc.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ) { | |
| // if ( getComputedStyle(configurePane).maxWidth != "0px" ) { | |
| // configurePane.style.setProperty(MW, "0px", "important"); | |
| // } else { | |
| // configurePane.style.removeProperty(MW); | |
| // }; | |
| // }; | |
| // doc.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )(document, "max-width"); | |
| // 809am: 287 char javascript:((a,b,c)=>{(c=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&("0px"==getComputedStyle(c).maxWidth?c.style.removeProperty(b):c.style.setProperty(b,"0px","important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document,"max-width") | |
| // ( (doc, configurePane, MW = "max-width", style) => { | |
| // if (configurePane = [...doc.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ) { | |
| // style = configurePane.style; | |
| // if ( getComputedStyle(configurePane).maxWidth != "0px" ) { | |
| // style.setProperty(MW, "0px", "important"); | |
| // } else { | |
| // style.removeProperty(MW); | |
| // }; | |
| // }; | |
| // doc.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )(document); | |
| // 802am: 287 char javascript:((a,b,c="max-width",d)=>{(b=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&(d=b.style,"0px"==getComputedStyle(b).maxWidth?d.removeProperty(c):d.setProperty(c,"0px","important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document) | |
| // ( (doc, configurePane, SHRUNK = "0px", MW = "max-width", style) => { | |
| // if (configurePane = [...doc.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ) { | |
| // style = configurePane.style; | |
| // if ( getComputedStyle(configurePane).maxWidth != SHRUNK ) { | |
| // style.setProperty(MW, SHRUNK, "important"); | |
| // } else { | |
| // style.removeProperty(MW); | |
| // }; | |
| // }; | |
| // doc.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )(document); | |
| // 801am: 287 char javascript:((a,b,c="0px",d="max-width",e)=>{(b=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&(e=b.style,getComputedStyle(b).maxWidth==c?e.removeProperty(d):e.setProperty(d,c,"important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document) | |
| // ( (doc, configurePane, SHRUNK = "0px", MW = "max-width") => { | |
| // if (configurePane = [...doc.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ) { | |
| // if ( getComputedStyle(configurePane).maxWidth != SHRUNK ) { | |
| // configurePane.style.setProperty(MW, SHRUNK, "important"); | |
| // } else { | |
| // configurePane.style.removeProperty(MW); | |
| // }; | |
| // }; | |
| // doc.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )(document); | |
| // 759am: 287 char javascript:((a,b,c="0px",d="max-width")=>{(b=[...a.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop())&&(getComputedStyle(b).maxWidth==c?b.style.removeProperty(d):b.style.setProperty(d,c,"important"));a.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document) | |
| // ( (configurePane, MW = "max-width") => { | |
| // if (configurePane) { | |
| // if ( getComputedStyle(configurePane).maxWidth != "0px" ) { | |
| // configurePane.style.setProperty(MW, "0px", "important"); | |
| // } else { | |
| // configurePane.style.removeProperty(MW); | |
| // }; | |
| // }; | |
| // document.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )( [...document.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ); | |
| // 750am: 288 char javascript:((a,b="max-width")=>{a&&("0px"==getComputedStyle(a).maxWidth?a.style.removeProperty(b):a.style.setProperty(b,"0px","important"));document.querySelector("button[aria-label=\"Close panel\"]")?.click()})([...document.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop()) | |
| // ( (configurePane) => { | |
| // if (configurePane) { | |
| // if ( getComputedStyle( configurePane = configurePane[1] || configurePane[0] ).maxWidth != "0px" ) { | |
| // configurePane.style.setProperty("max-width", "0px", "important"); | |
| // } else { | |
| // configurePane.style.removeProperty("max-width"); | |
| // }; | |
| // }; | |
| // document.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )( document.querySelectorAll('[data-config-sidebar-side="left"]') ); | |
| // 745am: 292 char javascript:(a=>{a&&("0px"==getComputedStyle(a=a[1]||a[0]).maxWidth?a.style.removeProperty("max-width"):a.style.setProperty("max-width","0px","important"));document.querySelector("button[aria-label=\"Close panel\"]")?.click()})(document.querySelectorAll("[data-config-sidebar-side=\"left\"]")) | |
| // ( (configurePane) => { | |
| // if (configurePane) { | |
| // if ( getComputedStyle(configurePane).maxWidth != "0px" ) { | |
| // configurePane.style.setProperty("max-width", "0px", "important"); | |
| // } else { | |
| // configurePane.style.removeProperty("max-width"); | |
| // }; | |
| // }; | |
| // document.querySelector('button[aria-label="Close panel"]')?.click(); | |
| // } )( [...document.querySelectorAll('[data-config-sidebar-side="left"]')].pop() ); | |
| // 740am: 292 char javascript:(a=>{a&&("0px"==getComputedStyle(a).maxWidth?a.style.removeProperty("max-width"):a.style.setProperty("max-width","0px","important"));document.querySelector("button[aria-label=\"Close panel\"]")?.click()})([...document.querySelectorAll("[data-config-sidebar-side=\"left\"]")].pop()) |
Author
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://gist.github.com/DarrenSem/4d37711fb71a484b6ed2356c60e3c94a = above.js (PARENT element, levels = #) + next.js (SIBLING element, levels = #) helper functions instead of foo.parentElement.parentElement.parentElement etc.