Skip to content

Fix sidebar top padding on Windows#3026

Merged
nightnei merged 1 commit intotrunkfrom
fixSidebarPaddingOnWindows
Apr 10, 2026
Merged

Fix sidebar top padding on Windows#3026
nightnei merged 1 commit intotrunkfrom
fixSidebarPaddingOnWindows

Conversation

@nightnei
Copy link
Copy Markdown
Contributor

@nightnei nightnei commented Apr 9, 2026

Proposed Changes

I don't know why we didn't notice it before, but on Windows we have huge gap at the top of main sidebar. I checked - we always had it. I propose to align it with macOS, since it feels like something is broken and I don't see a reson to have different padding top.

Screenshot 2026-04-09 at 14 08 04

Fix sidebar top padding on Windows

Testing Instructions

Run Studio on MacOS and Windows and assert that top padding looks good
Screenshot 2026-04-09 at 13 57 43
Screenshot 2026-04-09 at 14 08 46

@nightnei nightnei requested a review from a team April 9, 2026 13:08
@nightnei nightnei self-assigned this Apr 9, 2026
@wpmobilebot
Copy link
Copy Markdown
Collaborator

📊 Performance Test Results

Comparing fa59980 vs trunk

app-size

Metric trunk fa59980 Diff Change
App Size (Mac) 1261.14 MB 1260.99 MB 0.15 MB ⚪ 0.0%

site-editor

Metric trunk fa59980 Diff Change
load 1870 ms 1784 ms 86 ms 🟢 -4.6%

site-startup

Metric trunk fa59980 Diff Change
siteCreation 8114 ms 8163 ms +49 ms ⚪ 0.0%
siteStartup 4049 ms 4172 ms +123 ms 🔴 3.0%

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

Copy link
Copy Markdown
Contributor

@epeicher epeicher left a comment

Choose a reason for hiding this comment

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

Thanks @nightnei for fixing this! I have tested it, and it looks better now. LGTM!

Before After
Image Image

Copy link
Copy Markdown
Contributor

@katinthehatsite katinthehatsite left a comment

Choose a reason for hiding this comment

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

I checked for regressions for macOS and the changes look good for me there 👍

@nightnei nightnei merged commit 090a010 into trunk Apr 10, 2026
10 checks passed
@nightnei nightnei deleted the fixSidebarPaddingOnWindows branch April 10, 2026 09:22
lezama pushed a commit that referenced this pull request Apr 10, 2026
katinthehatsite added a commit that referenced this pull request Apr 10, 2026
* [skip ci] Code freeze: Update translatable strings for 1.7.8

* [skip ci] Code freeze: Add draft release notes for 1.7.8

* Add push/pull/import/export MCP tools for AI agents (#3022)

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

* Sort studio code commands and subcommands alphabetically (#3027)

* Moved the `code` command registration in `apps/cli/index.ts` so that top-level CLI commands appear in alphabetical order

* Strip unnecessary fields in wpcom_request response (#3005)

* Strip bloated plan.features from wpcom_request responses

The WP.com /sites/{id} endpoint returns a plan object whose features
sub-field alone is 60K+ characters, pushing the total response past
Claude Code's ~100K character MCP tool result limit. The agent only
needs product_slug, is_free, and expired to gate features, since the
system prompt hardcodes what each plan tier can and can't do. Strip
plan.features and keep only essential plan properties.

* Also compact large array responses by stripping content and _links

List endpoints like GET /templates can return 80K+ chars of block markup.
Strip content and _links from array items when the response exceeds 80K
chars — the agent can still identify items by slug/title and fetch
individual ones for full content.

* Add _fields prompt guidance and scope plan compaction as special case

Add system prompt hint instructing the agent to use _fields on wp/v2
listing endpoints to minimize response sizes. Scope compactResponse()
to only handle plan.features stripping with a clear comment that this
is a special case (the API doesn't support sub-field filtering). Remove
the generic array compaction in favor of prompt-driven field selection.

* Add fields guidance for v1.1, rename stripOversizedFields

Update system prompt to instruct the agent to use fields (v1.1) and
_fields (wp/v2) to minimize response sizes, always including ID for
v1.1 requests. Rename compactResponse to stripOversizedFields for
clarity.

* Remove indentation in JSON to save tokens

* Fix dark mode visibility for error/success text in site list (#3034)

* Fix dark mode onbiarding screen (#3025)

Co-authored-by: Kateryna Kodonenko <kateryna@automattic.com>

* Studio: Filter out deprecated warnings from fatal errors (#3018)

* Filter out deprecated warnings from fatal errors

* Ensure our error filtering approach is consistent with CLI

* Apply changes to default exporter

* Fix unit tests

---------

Co-authored-by: Kateryna Kodonenko <kateryna@automattic.com>

* [skip ci] Update translations

* [skip ci] Bump version to 1.7.8-beta1

* CLI: ensure Studio root exists before starting code agent (#3039)

* Ensure startAiAgent() checks whether ~/Studio exists before launching the Claude SDK.

* Define a localeData type to fix lint error: The inferred type of this
node exceeds the maximum length the compiler will serialize. An explicit
type annotation is needed. (ts 7056)

* [skip ci] Bump version to 1.7.8-beta2

* Update illustration colors and add dot grid background (#3004)

* Update Sync and Preview illustrations with dark mode support and dot grid background

Rebuild the Sync tab illustration SVG with proper light/dark mode color switching.
Update the Preview tab browser chrome to use light colors in light mode.
Add an interactive DotGrid canvas component behind both illustrations with a
radial gradient mask for a clean fade effect.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Extract IllustrationGrid wrapper, use CSS tokens in SVGs, add tests

- Extract shared IllustrationGrid component (DotGrid + radial mask)
  used by both Sync and Preview tabs
- Replace hardcoded SVG colors with CSS custom properties
  (--color-frame-surface, --color-frame-bg, etc.) so illustrations
  adapt automatically to theme changes
- Scope SVG class names with short prefixes (sti-, sds-) to avoid
  collisions
- Add basic tests for DotGrid and IllustrationGrid components

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Mock DotGrid in sync tests to fix canvas error in jsdom

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Respect prefers-reduced-motion in DotGrid

When reduced motion is preferred, render a static grid with no intro
animation, hover repulsion, or click ripples. Mouse event listeners
are not attached at all. The grid still responds to resize and color
scheme changes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Keep WP logo white in dark mode on blue browser, dedup resize logic

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Solve for strange sidebars

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: katinthehatsite <katerynakodonenko@gmail.com>
Co-authored-by: Kateryna Kodonenko <kateryna@automattic.com>

* Upgrade archiver to v7 to fix glob and inflight deprecation warnings (#3050)

* CLI: upgrade archiver to v7 to fix glob and inflight deprecation warnings

archiver@6 → archiver@7 pulls in archiver-utils@5 which uses glob@10
instead of glob@8, eliminating the glob and inflight deprecation warnings.

@types/archiver@7 dropped followSymlinks from CoreOptions (it's still
supported at runtime), so cast ArchiverOptions at call sites instead of
patching node_modules. Also fixes the broken ProgressData named import
which doesn't work with the export= module style in @types/archiver@7.

* Studio: upgrade archiver to v7, drop @types/archiver patch

Consistent with the CLI upgrade. Drops the @types+archiver+6.0.4 patch
in favour of the same cast-based approach used in apps/cli.

* Studio: remove obsolete archiver@6 runtime patch

* Studio: Fix sync info icon color in dark mode (#3053)

The info icons next to the push progress bar had no fill color class,
defaulting to black which is invisible on the dark background. Add
fill-frame-text-secondary to match the existing offline icon style.

* Update CLI README with GIF and import/export/push/pull (#3029)

* Update CLI README

* Tweaks

* More tweaks

* Tweak

* Wider

* Enforce minimum node version in the CLI (#3049)

* Enforce minimum node version in the CLI

* Tweaks

* Allow translations to load first

* Fix sidebar top padding on Windows (#3026)

* [skip ci] Update translations

* [skip ci] Bump version to 1.7.8-beta3

---------

Co-authored-by: Riad Benguella <benguella@gmail.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
Co-authored-by: Antonio Sejas <antonio.sejas@automattic.com>
Co-authored-by: Roberto Aranda <roberto.aranda@automattic.com>
Co-authored-by: Bernardo Cotrim <bmmcotrim@gmail.com>
Co-authored-by: katinthehatsite <katerynakodonenko@gmail.com>
Co-authored-by: Kateryna Kodonenko <kateryna@automattic.com>
Co-authored-by: Jorge Costa <jorge.costa@developer.pt>
Co-authored-by: Antonio Sejas <antonio@sejas.es>
Co-authored-by: Shaun Andrews <shaun@automattic.com>
Co-authored-by: Wojtek Naruniec <wojtek.naruniec@automattic.com>
Co-authored-by: Gergely Csécsey <gergely.csecsey@automattic.com>
Co-authored-by: Fredrik Rombach Ekelund <fredrik@f26d.dev>
Co-authored-by: Volodymyr Makukha <nei.css@gmail.com>
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.

4 participants