# Scale UI elements in the editor based on the \`buffer_font_size\` \(\#11817\) · gitcafe/zed

[View on GitCafe](https://git.cafe/gitcafe/zed/commit/5b8bb6237f24d1a69bc8897add716e1df1323e2e)

Repository: [gitcafe/zed](https://git.cafe/gitcafe/zed)

Visibility: public

Requested revision: 5b8bb6237f24d1a69bc8897add716e1df1323e2e

Requested commit: 5b8bb6237f24d1a69bc8897add716e1df1323e2e

Commit: 5b8bb6237f24d1a69bc8897add716e1df1323e2e

Tree: e07d9345f5feaa4912a16e01accea3ce0f220031

Author: Marshall Bowers

Committer: GitHub

## Message

```
Scale UI elements in the editor based on the `buffer_font_size` (#11817)

This PR adjusts how UI elements are rendered inside of full-size editors
to scale with the configured `buffer_font_size`.

This fixes some issues where UI elements (such as the `IconButton`s used
for code action and task run indicators) would not scale as the
`buffer_font_size` was changed.

We achieve this by changing the rem size when rendering the
`EditorElement`, with a rem size that is derived from the
`buffer_font_size`.

`WindowContext` now has a new `with_rem_size` method that can be used to
render an element with a given rem size. Note that this can only be
called during `request_layout`, `prepaint`, or `paint`, similar to
`with_text_style` or `with_content_mask`.

### Before

<img width="1264" alt="Screenshot 2024-05-14 at 2 15 39 PM"
src="https://github.com/zed-industries/zed/assets/1486634/05ad7f8d-c62f-4baa-bffd-38cace7f3710">

<img width="1264" alt="Screenshot 2024-05-14 at 2 15 49 PM"
src="https://github.com/zed-industries/zed/assets/1486634/254cd11c-3723-488f-ab3d-ed653169056c">

### After

<img width="1264" alt="Screenshot 2024-05-14 at 2 13 02 PM"
src="https://github.com/zed-industries/zed/assets/1486634/c8dad309-62a4-444f-bfeb-a0009dc08c03">

<img width="1264" alt="Screenshot 2024-05-14 at 2 13 06 PM"
src="https://github.com/zed-industries/zed/assets/1486634/4d9a3a52-9656-4768-b210-840b4884e381">

Note: This diff is best viewed with whitespace changes hidden:

<img width="245" alt="Screenshot 2024-05-14 at 2 22 45 PM"
src="https://github.com/zed-industries/zed/assets/1486634/7cb9829f-9c1b-4224-95be-82182017ed90">

Release Notes:

- Changed UI elements within the editor to scale based on
`buffer_font_size` (e.g., code action indicators, task run indicators,
etc.).
```

## Parents

- [c8ddde27e173d73c72b1f0a306d6cbb2d9641fb6](https://git.cafe/gitcafe/zed/commit/c8ddde27e173d73c72b1f0a306d6cbb2d9641fb6?format=markdown)

[Source at this commit](https://git.cafe/gitcafe/zed/tree/5b8bb6237f24d1a69bc8897add716e1df1323e2e?format=markdown)
