Help please: how to set electron window frame to false

hologerry commented 1 month ago

Hi, I am new to here, previously I used apc-extension to achieve frameless title bar and solve the 1px top white line https://github.com/drcika/apc-extension/issues/169 https://github.com/microsoft/vscode/issues/144389:

"apc.electron": {
    "frame": false,
    "transparent": true,
}

However, the apc-extension is broken by the VSCode's latest version https://github.com/drcika/apc-extension/issues/230. May I ask how to do so with vscode-custom-css? Thanks a lot!

shahzaibkhalid commented 1 month ago

Also looking to do the same!

hologerry commented 1 month ago

I found a monkey patch solution for this: Change the file /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/code/electron-main/main.js

open this file and format it to readable (just open the folder out with VSCode and format it).

change this part:

l = {
  backgroundColor: r.getBackgroundColor(),
  minWidth: wp.WIDTH,
  minHeight: wp.HEIGHT,
  title: n.nameLong,
  show: e.mode !== 0 && e.mode !== 3,
  x: e.x,
  y: e.y,
  width: e.width,
  height: e.height,
  webPreferences: {
    ...s,
    enableWebSQL: !1,
    spellcheck: !1,
    zoomFactor: Tl(e.zoomLevel ?? c?.zoomLevel),
    autoplayPolicy: "user-gesture-required",
    enableBlinkFeatures: "HighlightAPI",
    sandbox: !0,
  },
  experimentalDarkMode: !0,
};

to

l = {
  backgroundColor: r.getBackgroundColor(),
  minWidth: wp.WIDTH,
  minHeight: wp.HEIGHT,
  title: n.nameLong,
  show: e.mode !== 0 && e.mode !== 3,
  x: e.x,
  y: e.y,
  width: e.width,
  height: e.height,
  webPreferences: {
    ...s,
    enableWebSQL: !1,
    spellcheck: !1,
    zoomFactor: Tl(e.zoomLevel ?? c?.zoomLevel),
    autoplayPolicy: "user-gesture-required",
    enableBlinkFeatures: "HighlightAPI",
    sandbox: !0,
  },
  experimentalDarkMode: !0,
  frame: false,
  transparent: true,
};

shahzaibkhalid commented 1 month ago

I found a monkey patch solution for this: Change the file /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/code/electron-main/main.js

open this file and format it to readable (just open the folder out with VSCode and format it).
change this part:

l = {
      backgroundColor: r.getBackgroundColor(),
      minWidth: wp.WIDTH,
      minHeight: wp.HEIGHT,
      title: n.nameLong,
      show: e.mode !== 0 && e.mode !== 3,
      x: e.x,
      y: e.y,
      width: e.width,
      height: e.height,
      webPreferences: {
        ...s,
        enableWebSQL: !1,
        spellcheck: !1,
        zoomFactor: Tl(e.zoomLevel ?? c?.zoomLevel),
        autoplayPolicy: "user-gesture-required",
        enableBlinkFeatures: "HighlightAPI",
        sandbox: !0,
      },
      experimentalDarkMode: !0,
    };

to

l = {
      backgroundColor: r.getBackgroundColor(),
      minWidth: wp.WIDTH,
      minHeight: wp.HEIGHT,
      title: n.nameLong,
      show: e.mode !== 0 && e.mode !== 3,
      x: e.x,
      y: e.y,
      width: e.width,
      height: e.height,
      webPreferences: {
        ...s,
        enableWebSQL: !1,
        spellcheck: !1,
        zoomFactor: Tl(e.zoomLevel ?? c?.zoomLevel),
        autoplayPolicy: "user-gesture-required",
        enableBlinkFeatures: "HighlightAPI",
        sandbox: !0,
      },
      experimentalDarkMode: !0,
      frame: false,
      transparent: true,
    };

Finally got to like VSCode again, thank you!

Blankeos commented 1 month ago

Monkey patch doesn't work for me D:

be5invis / vscode-custom-css

Help please: how to set electron window frame to false #236