search

microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
163.8k stars 29.12k forks source link

Top padding is wrong on comment view zone #193140

Closed Tyriar closed 1 year ago

Tyriar commented 1 year ago

Notice the hover feedback is cut off vertically and should have additional spacing.

Image

Setup:

  1. Korean language pack (may impact?)
  2. `"window.zoomLevel": 2

It also happens with other zoom levels:

Image

alexr00 commented 1 year ago

Korean language pack + default zoom level:

image

And with zoom level 2:

image

Do you have any other settings that may impact this?

Tyriar commented 1 year ago

When I comment all my settings out, there is still a lack of padding on the top imo:

image

Toggling parts of my settings can make this happen, it didn't seem obvious to me what setting is the problem. Also there's a delayed layout after saving which was a little strange

Recording 2023-09-15 at 04 43 58

My settings:

{
  "terminal.integrated.wordSeparators": " ()[]{}',\"`─‘’|",
  "diffEditor.hideUnchangedRegions.contextLineCount": 20,
  "workbench.settings.enableNaturalLanguageSearch": true,
  "editor.accessibilitySupport": "off",
  "terminal.integrated.gpuAcceleration": "on",
  "terminal.integrated.shellIntegration.enabled": true,
  "telemetry.internalTesting": true,
  // "terminal.integrated.developer.ptyHost.latency": 1000,
  // "terminal.integrated.developer.ptyHost.startupDelay": 5000,

  // =========================
  // Core - Experimental
  // =========================
  // "editor.experimental.asyncTokenization": true,
  "window.experimental.nativeContextMenuLocation": true,

  // =========================
  // Core
  // =========================
  "audioCues.onDebugBreak": "on",
  // "audioCues.terminalQuickFix": "on",

  "comments.openView": "never",

  "breadcrumbs.showVariables": false,
  "breadcrumbs.showFields": false,
  "breadcrumbs.showProperties": false,

  "debug.console.acceptSuggestionOnEnter": "on",
  "debug.internalConsoleOptions": "neverOpen",
  "debug.javascript.autoAttachFilter": "disabled",
  "debug.javascript.debugByLinkOptions": "on",
  "debug.toolBarLocation": "floating",
  "debug.saveBeforeStart": "none",
  "debug.showInStatusBar": "onFirstSessionStart",

  "editor.autoClosingBrackets": "never",
  "editor.autoClosingQuotes": "never",
  "editor.autoSurround": "never",
  "editor.bracketPairColorization.enabled": false,
  "editor.codeLens": false,
  "editor.copyWithSyntaxHighlighting": false,
  // "editor.folding": false,
  "editor.fontFamily": "Hack, 'Powerline Extra Symbols', 'Hack NF'",
  "editor.fontSize": 10,
  "editor.formatOnPaste": false,
  "editor.formatOnSave": false,
  "editor.guides.indentation": true,
  "editor.inlayHints.enabled": "off",
  "editor.inlineSuggest.enabled": false,
  "editor.minimap.renderCharacters": false,
  "editor.minimap.showSlider": "always",
  "editor.parameterHints.cycle": true,
  "editor.renderControlCharacters": true,
  "editor.renderLineHighlight": "all",
  "editor.renderWhitespace": "boundary",
  "editor.roundedSelection": false,
  "editor.rulers": [
    80,
    100,
    120
  ],
  "editor.smoothScrolling": false,
  "editor.stickyScroll.enabled": true,
  "editor.suggestSelection": "first",
  "editor.suggest.snippetsPreventQuickSuggestions": false,

  "explorer.autoReveal": false,

  "extensions.autoUpdate": true,
  "extensions.ignoreRecommendations": true,

  "git.enableStatusBarSync": true,

  "files.defaultLanguage": "markdown",
  "files.hotExit": "onExitAndWindowClose",
  "files.simpleDialog.enable": true,

  "outline.showFunctions": false,
  "outline.showProperties": false,
  "outline.showVariables": false,

  "problems.sortOrder": "position",

  "search.maxResults": 100000,

  "security.workspace.trust.emptyWindow": true,
  "security.workspace.trust.untrustedFiles": "open",

  "settingsSync.ignoredExtensions": [
    "ms-vscode.node-debug",
    "ms-vscode.azurecli",
    "ms-vsliveshare.vsliveshare",
    "tyriar.luna-paint",
    "jrieken.vscode-pr-pinger"
  ],
  "settingsSync.ignoredSettings": [
    "workbench.colorTheme",
    "update.mode",
    "editor.accessibilitySupport"
  ],
  "settingsSync.keybindingsPerPlatform": false,

  "task.allowAutomaticTasks": "off",
  "task.saveBeforeRun": "never",

  "terminal.external.windowsExec": "wt",
  "terminal.external.linuxExec": "wt.exe",
  "terminal.integrated.allowMnemonics": true,
  "terminal.integrated.autoReplies": {
    "Terminate batch job (Y/N)": "Y\r"
  },
  "terminal.integrated.commandsToSkipShell": [
    "workbench.action.toggleSidebarVisibility"
  ],
  "terminal.integrated.cursorBlinking": true,
  "terminal.integrated.enableBell": true,
  "terminal.integrated.environmentChangesIndicator": "on",
  "terminal.integrated.fontSize": 10,
  "terminal.integrated.lineHeight": 1.1,
  // "terminal.integrated.localEchoEnabled": "on",
  // "terminal.integrated.localEchoLatencyThreshold": 20,
  // "terminal.integrated.localEchoLatencyThreshold": 0,
  "terminal.integrated.localEchoStyle": "underlined",
  "terminal.integrated.minimumContrastRatio": 7,
  "terminal.integrated.persistentSessionReviveProcess": "onExitAndWindowClose",
  "terminal.integrated.scrollback": 50000,
  "terminal.integrated.smoothScrolling": true,
  "terminal.integrated.splitCwd": "inherited",
  "terminal.integrated.tabs.showActions": "singleTerminalOrNarrow",
  "terminal.integrated.tabs.showActiveTerminal": "always",
  "terminal.integrated.defaultProfile.windows": "PowerShell",
  "terminal.integrated.profiles.windows": {
    "PowerShell": {
      "source": "PowerShell",
      "icon": "terminal-powershell"
    },
    "Command Prompt": {
      "path": [
        "${env:windir}\\Sysnative\\cmd.exe",
        "${env:windir}\\System32\\cmd.exe"
      ],
      "args": [],
      "icon": "terminal-cmd"
    },
    "Git Bash": {
      "source": "Git Bash"
    },
    "Windows PowerShell": {
      "path": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe"
    },
    "bash (MSYS2)": {
      "path": "C:\\msys64\\usr\\bin\\bash.exe",
      "args": [
        "--login",
        "-i"
      ]
    },
    "Ubuntu (WSL)": {
      "path": "C:\\WINDOWS\\System32\\wsl.exe",
      "args": [
        "-d",
        "Ubuntu"
      ]
    }
  },
  "terminal.integrated.tabs.description": "${task}${separator}${local}${separator}${cwdFolder}",

  // "testing.automaticallyOpenPeekView": "never",
  "testing.openTesting": "neverOpen",
  "testing.defaultGutterClickAction": "debug",

  "window.commandCenter": false,
  "window.openFoldersInNewWindow": "on",
  "window.restoreWindows": "all",
  "window.title": "${rootName}${separator}${activeEditorMedium}",
  "window.titleBarStyle": "custom",

  "workbench.colorCustomizations": {
    "[Default Light+]": {
      "terminal.selectionBackground": "#add6ff"
    },
    "[Visual Studio Light]": {
      "terminal.selectionBackground": "#add6ff"
    },
    "[Dark+]": {
      "terminal.tab.activeBorder": "#f9826c"
    },
    "[Default Dark+ Experimental]": {
      "terminal.tab.activeBorder": "#2488d8"
    },
    "[Default Light+ Experimental]": {
      "terminal.tab.activeBorder": "#005fb8"
    },
    "[Sapphire]": {
      "editor.wordHighlightStrongBackground": "#0000",
      "editor.wordHighlightStrongBorder": "#399ef4",
      "editor.wordHighlightBackground": "#0000",
      "editor.wordHighlightBorder": "#399ef4",
      "editor.selectionHighlightBackground": "#399ef420",
      "editor.selectionBackground": "#399ef440",
      "diffEditorGutter.insertedLineBackground": "#33674D",
      "diffEditorGutter.removedLineBackground": "#79424D",
      "diffEditorOverview.insertedForeground": "#33674D",
      "diffEditorOverview.removedForeground": "#79424D",
      "editorStickyScrollHover.background": "#1C2E42"
    },
    "[Sapphire (Dim)]": {
      "editor.wordHighlightStrongBackground": "#0000",
      "editor.wordHighlightStrongBorder": "#399ef4",
      "editor.wordHighlightBackground": "#0000",
      "editor.wordHighlightBorder": "#399ef4",
      "editor.selectionHighlightBackground": "#399ef420",
      "editor.selectionBackground": "#399ef440",
      "editor.symbolHighlightBackground": "#0000",
      "editor.symbolHighlightBorder": "#399ef4",
      "sideBarSectionHeader.background": "#090f18",
      "sideBarSectionHeader.border": "#060a10",
      "activityBar.background": "#060a10"
    },
    "[Topaz (Dim)]": {
      "terminal.selectionBackground": "#42400f",
      "editor.symbolHighlightBorder": "#e0ed36",
      "tab.activeBorder": "#0000",
      "tab.activeBorderTop": "#e0ed36"
    },
    "[Default High Contrast]": {
      "editorIndentGuide.background1": "#606060"
    }
  },
  "workbench.dialogs.useSimplified": "true",
  "workbench.editor.empty.hint": "hidden",
  "workbench.editor.enablePreviewFromQuickOpen": false,
  "workbench.editor.closeEmptyGroups": false,
  "workbench.editorAssociations": {
    "*.{bmp,ico,jpg,jpeg,png}": "luna.editor",
    "*.webp": "luna.editor",
    "*.jpe": "luna.editor",
    "*.ipynb": "jupyter-notebook"
  },
  "workbench.iconTheme": "chalice-icon-theme",
  "workbench.layoutControl.enabled": false,
  "workbench.settings.editor": "json",
  "workbench.settings.openDefaultSettings": false,
  "workbench.startupEditor": "none",
  "workbench.tips.enabled": false,
  "workbench.tree.expandMode": "doubleClick",

  "zenMode.centerLayout": false,

  // =========================
  // Core - Languages
  // =========================
  "javascript.updateImportsOnFileMove.enabled": "always",
  "markdown.preview.scrollEditorWithPreview": false,
  "markdown.updateLinksOnFileMove.enabled": "always",
  "[markdown]": {
    "editor.quickSuggestions": {
      "comments": "off",
      "strings": "off",
      "other": "off"
    }
  },

  // =========================
  // Extension - Chalice Icons
  // =========================
  "chaliceIcons.showArrows": true,

  // ==========================
  // Extension - GitHub Copilot
  // ==========================
  "github.copilot.enable": {
    "*": true,
    "plaintext": true,
    "markdown": true,
    "scminput": false,
    "yaml": true
  },
  "github.copilot.advanced": {
    "debug.conversation": true,
    "debug.overrideLogLevels": {
      "*": "DEBUG"
    },
    // "variables": {
    //   "*": true
    // },
  },

  // =========================
  // Extension - GitHub PRI
  // =========================
  "githubIssues.queries": [
    {
      "label": "My Issues",
      "query": "default"
    },
    {
      "label": "Created Issues",
      "query": "author:${user} state:open repo:${owner}/${repository}"
    },
        {
            "label": "Luna",
            "query": "is:open repo:lunapaint/luna sort:updated-desc"
        }
  ],
  "githubPullRequests.commentExpandState": "collapseAll",
  "githubPullRequests.pullBranch": "never",
  "githubPullRequests.queries": [
    {
      "label": "Waiting For My Review",
      "query": "is:open review-requested:${user}"
    },
    {
      "label": "Assigned To Me",
      "query": "is:open assignee:${user}"
    },
    {
      "label": "Assigned To Megan",
      "query": "is:open assignee:meganrogge"
    },
    {
      "label": "Created By Me",
      "query": "is:open author:${user}"
    }
  ],
  "githubPullRequests.remotes": [
    "origin",
    "ups",
    "upstream"
  ],
  "githubPullRequests.terminalLinksHandler": "github",
  "githubPullRequests.focusedMode": false,

  // ======================
  // Extension - Hex Editor
  // ======================
  "hexeditor.dataInspector.autoReveal": false,

  // ======================
  // Extension - Live Share
  // ======================
  "liveshare.comments": false,

  // ======================
  // Extension - Luna Paint
  // ======================
  "luna.defaultImageSize": {
    "width": 800,
    "height": 600
  },
  "luna.defaultTool": "selection",
  "luna.developer.logPerfMetrics": true,
  // "luna.retainContextWhenHidden": false,

  // ===============================
  // Extension - Material Icon Theme
  // ===============================
  "material-icon-theme.showReloadMessage": false,
  "material-icon-theme.showWelcomeMessage": false,
  "material-icon-theme.files.associations": {
    ".eslintrc": "json",
    "appveyor.yml": "yaml",
    ".travis.yml": "yaml",
    ".mention-bot": "git",
    ".yarnrc": "nodejs",
    "yarn.lock": "nodejs",
    "mocha.opts": "nodejs",
    "gulpfile.js": "nodejs",
    "webpack.config.js": "nodejs",
    ".editorconfig": "settings",
    "Procfile": "settings",
    ".mailmap": "settings",
    ".npmrc": "nodejs",
    ".npmignore": "nodejs",
    "tsconfig.json": "json",
    "tsconfig.base.json": "json",
    "**.md": "document",
    "**.txt": "document",
    "LICENSE": "document",
    "azure-pipelines.yml": "settings",
    "router.ts": "typescript"
  },
  "material-icon-theme.folders.associations": {
    "src": "src"
  },
  "material-icon-theme.folders.theme": "classic",

  // ======================
  // Extension - PowerShell
  // ======================
  "powershell.integratedConsole.showOnStartup": false,
  "powershell.promptToUpdatePowerShell": false,

  // =====================================
  // Extension - Template String Converter
  // =====================================
  "template-string-converter.convertOutermostQuotes": true,

  // ==========================
  // Extension - TODO HIGHLIGHT
  // ==========================
  "todohighlight.keywords": [
    {
      "text": "TODO:",
      "color": "#399EF4",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    },
    {
      "text": "FIXME:",
      "color": "#399EF4",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    },
    {
      "text": "DEBUG:",
      "color": "#DA6771",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    },
    {
      "text": "HACK:",
      "color": "#DA6771",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    },
    {
      "text": "IMPORTANT:",
      "color": "#DA6771",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    },
    {
      "text": "NOTE:",
      "color": "#DA6771",
      "backgroundColor": "transparent",
      "overviewRulerColor": "transparent"
    }
  ],

  // ========================================
  // Extension - Windows Terminal Integration
  // ========================================
  "windowsTerminal.channel": "auto",

  // ========================
  // Extension - Remote - SSH
  // ========================
  "remote.SSH.remotePlatform": {
    "robwin": "windows"
  },
  "git.openRepositoryInParentFolders": "never",
  "terminal.integrated.defaultProfile.osx": "bash",
  "git.autofetch": true,
  "workbench.colorTheme": "Sapphire",
  "window.zoomLevel": 1
}
alexr00 commented 1 year ago

When I comment all my settings out, there is still a lack of padding on the top imo:

This is at least the intended amount of padding.

The big layout change is probably this setting diffEditor.renderSideBySide.

alexr00 commented 1 year ago

I can repro with your settings. "editor.fontSize": 10 is causing this.

alexr00 commented 1 year ago

Seems to be a peek view problem:

image

@jrieken I think it's coming from here. Is this by design?

https://github.com/microsoft/vscode/blob/f9f514aec925c1b54dd9681e68b0229f758e73f6/src/vs/editor/contrib/peekView/browser/peekView.ts#L259-L260

This was copied into comments:

https://github.com/microsoft/vscode/blob/f9f514aec925c1b54dd9681e68b0229f758e73f6/src/vs/workbench/contrib/comments/browser/commentThreadWidget.ts#L203-L204

Tyriar commented 1 year ago

cc @daviddossett

daviddossett commented 1 year ago

Sorry, what exactly is the issue here? I see various things happening above:

  • Icon buttons mashed up against the top of the comment view zone
  • Squashed icon buttons in the peek view

Under normal circumstances I don't see any obvious issues:

CleanShot 2023-09-15 at 08 54 21@2x CleanShot 2023-09-15 at 08 53 41@2x

Possible some padding massaging needed but I can't seem to repro the other issues above.

Tyriar commented 1 year ago

@daviddossett I expect these two red lines to be of equal length, we should either have additional top padding or remove some bottom padding:

image

The worst part of the issue which does look like a bug is the fact that the top of the button is cut off sometimes:

image

daviddossett commented 1 year ago

Agree on the top. I see the issue below but I'm not sure how to repro. I have more padding than that:

CleanShot 2023-09-15 at 09 14 44@2x
Tyriar commented 1 year ago

@daviddossett Alex found "editor.fontSize": 10 is related to the repro

daviddossett commented 1 year ago

Tried that with no effect. In any case, I agree that the header + toolbar row here should have equal padding and be vertically centered regardless of font size.

There's a margin on the input wrapper that looks to cause the extra apparent spacing between the header an input.

bhavyaus commented 1 year ago

Tried with "editor.fontSize": 20 and do not see any issue with the padding.