Skip to content

style(about): apply dark frosted glass appearance for minimal/dark themes#632

Draft
kud wants to merge 1 commit into
gnachman:masterfrom
kud:feat/about-panel-dark-minimal
Draft

style(about): apply dark frosted glass appearance for minimal/dark themes#632
kud wants to merge 1 commit into
gnachman:masterfrom
kud:feat/about-panel-dark-minimal

Conversation

@kud
Copy link
Copy Markdown
Contributor

@kud kud commented Mar 26, 2026

🎟️ Ticket

Ticket: N/A

📄 Description

Applies a frosted-glass dark appearance to the About panel when the user is running a dark or minimal theme (Minimal/Dark/Dark High Contrast). Without this change the About window renders with an opaque white/system background that looks visually inconsistent on dark-themed setups.

Changes:

  • iTermAboutWindow.m: Override isOpaque to return NO so the window composites correctly behind a NSVisualEffectView.
  • iTermAboutWindowController.m: Configure the visual effect view with NSVisualEffectMaterialHUDWindow + NSVisualEffectBlendingModeBehindWindow; set the window background to clearColor; conditionally assign NSAppearanceNameVibrantDark when the active tab style is Minimal (and system appearance is dark), Dark, or Dark High Contrast; switch version-string attributes to secondaryLabelColor + NSFontWeightMedium for better legibility on the frosted surface; tighten line spacing from 3 → 2 pt.
  • AboutWindow.xib: Bump the title field from 22 pt system to 26 pt bold for a more prominent heading; switch subtitle colour from labelColor to secondaryLabelColor to match the new hierarchy.

📽️ Screencast

No visual changes included in this PR description — the difference is visible only at runtime when iTerm2 is using a dark/minimal theme.

✅ How to Validate

  1. Build iTerm2 (tools/build.sh).
  2. In Preferences → Appearance, set Theme to Minimal and ensure macOS is in Dark mode — open iTerm2 → About iTerm2 and confirm the panel has a frosted dark glass background.
  3. Repeat with Theme set to Dark and Dark High Contrast — both should show the vibrant dark appearance regardless of the system appearance setting.
  4. Switch Theme to Light or Default — the About panel should render with the standard system background (no frosted glass).
  5. Confirm the title reads "iTerm2" in 26 pt bold and the subtitle ("By George Nachman and Contributors") appears in a secondary/muted colour.

🛠️ Developer Checklist

  • Code is readable and maintainable
  • Tests included and passing (if applicable)
  • PR is atomic and focused on a single feature or bug
  • Commits follow Conventional Commits

@kud
Copy link
Copy Markdown
Contributor Author

kud commented Mar 26, 2026

Once I have properly tested it and added a screenshot, I will move it out of draft.

@gnachman
Copy link
Copy Markdown
Owner

gnachman commented Apr 1, 2026

The core idea (frosted glass for dark themes) is reasonable, but this PR needs significant rework:

  1. Remove all binary/framework artifacts — only ship source changes
  2. Remove the submodule change
  3. Squash WIP commits
  4. Move theme detection out of -init to handle theme changes
  5. Reconsider the 75% height and removal of dynamic sizing — these are significant behavioral changes
  6. Keep link color as linkColor for accessibility
  7. Don't remove the sponsor label

@kud
Copy link
Copy Markdown
Contributor Author

kud commented Apr 1, 2026

@gnachman Thanks for the feedback; I will adjust the PR.

Also, for now, I publish draft PRs to ensure people are aware of the work I'm doing. Perhaps opening an issue and stating that I will work on it would be better?

Regarding the commits, I will certainly polish the PR at the end.

Enhances the About window with dynamic dark mode adaptation using app theme preference and improves sponsor section UI. Updates window and content view appearance to support vibrancy, adds conditional styling for dark/light themes, refactors sponsor logo layout, and updates font and colour in About xib for improved readability.
@kud kud force-pushed the feat/about-panel-dark-minimal branch from 61c726f to e1e4429 Compare April 5, 2026 23:59
Copy link
Copy Markdown
Owner

@gnachman gnachman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the contribution! The idea of making the About panel respect dark themes is welcome. However, there are several issues that need to be addressed before this can be merged.

Use the existing theme API

The PR manually checks tab styles and queries currentTerminal to determine dark/light mode, but iTerm2 already has a centralized API for this in NSAppearance+iTerm.h:

self.window.appearance = [NSAppearance it_appearanceForCurrentTheme];

This is what iTermOpenQuicklyWindowController and other non-terminal windows use. It correctly handles all tab styles (including Automatic and Compact, which this PR misses) and doesn't require a terminal window to exist. The current approach would silently fall through to light mode for Automatic/Compact users in dark mode, and has undefined behavior when no terminal is open under Minimal.

Using it_appearanceForCurrentTheme would also eliminate most of the new #imports (iTermController.h, PseudoTerminal.h, PTYWindow.h, PreferencePanel.h) which create unnecessary coupling between the About window and the terminal infrastructure.

To determine the BOOL dark value for configureForDark:, you can use:

BOOL isDark = [NSAppearance it_appearanceForCurrentTheme].it_isDark;

Unconditional HUD material

awakeFromNib unconditionally sets NSVisualEffectMaterialHUDWindow on the content view. This material is designed for dark floating panels and will affect the appearance even in light mode. The material/blending configuration should be conditional, or use a material that works well in both modes (or skip the vibrancy for light themes entirely).

Hardcoded magic numbers

The alpha values (0.18, 0.22, 0.07, 0.05), corner radii (10, 8), insets (16, 12) are scattered without explanation. Please define these as named static const values at file scope with comments explaining the intent.

Duplicated constants

kWrapperInset and kWrapperGap are defined identically in both updateSponsorWrapperLayout and configureForDark:. Hoist them to file-scope static const values.

PR description vs. actual diff

The description mentions two changes that aren't in the diff:

  • "switch version-string attributes to secondaryLabelColor + NSFontWeightMedium" — the version text still uses controlTextColor
  • "tighten line spacing from 3 → 2 pt" — setLineSpacing:3 is unchanged

Please either include these changes or update the description.

_sponsorWrapper lifecycle

Once created, the sponsor wrapper is never hidden or removed. If the theme changes from dark to light at runtime, it remains visible with a slightly different background. Consider hiding it for light themes or making it truly transparent.

Minor

The XIB changes (22→26pt bold title, labelColorsecondaryLabelColor subtitle) are cosmetic choices I'll defer to @gnachman on.

@kud
Copy link
Copy Markdown
Contributor Author

kud commented Apr 8, 2026

@gnachman haha the last comment :D I see you using AI :P (as I do)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants