更新后 `Admin Badges` 页面布局损坏

[Richie (Richie Rich)]

大家好。

刚刚更新到 Discourse 3.4.0.beta2-dev (cde4db1c6a)，却发现徽章管理页面的布局有点损坏。

通常，徽章列表在屏幕左侧，允许您在屏幕右侧管理/添加/编辑徽章。

但现在看起来是这样的，左中间有一大片空白且无法使用的区域：

[Lilly (Lillian Louis)]

您可以尝试安全模式吗？我无法重现此问题。

[Richie (Richie Rich)]

嗯，它在 Safari 和 Chrome 中都会出现这种情况，两者都经过测试，并且在安全模式下也能重现。

好的，谢谢 @Lilly - 可能是其他地方我改动了什么，你可以忽略这个问题

[Lilly (Lillian Louis)]

我刚刚将我的测试托管站点进行了全新部署，徽章管理员运行正常。在安全模式下出现这种情况确实很奇怪。

我还检查了使用下拉菜单而不是侧边栏，以及使用旧的管理导航菜单，它仍然运行正常。

[Richie (Richie Rich)]

重现步骤：

1. 将 默认语言 设置更改为 English (UK)：

2. 在新标签页中重新加载 Discourse，然后浏览到 https://example.com/admin/badges，此时布局已损坏：

3. 将 默认语言 设置更改或重置为其默认值 English (US)：

4. 在新标签页中重新加载 Discourse，然后浏览到 https://example.com/admin/badges，此时布局已恢复正常：

我完全不知道这是怎么回事，也不知道为什么会这样

但要特别感谢 @JammyDodger 指出了根本原因

这个 bug 能修复吗？

[david (David Taylor)]

谢谢 @Richie！

这里似乎有几个问题。

1. 英语（英国）翻译缺少页面顶部的新的、更长的描述。这是因为“badges.description”键被重复使用了，而且我们从那以后没有从 Crowdin 进行过更新。

   当翻译自动更新时，这会立即自行解决。

2. 布局似乎取决于描述的长度。在美国英语中，我可以通过进入开发者工具并缩短描述来重现这个问题。

   

   即使英国英语字符串更新后，这仍然值得修复，因为使用较少字符的其他语言很可能遇到相同的问题。

看起来这个更改与 UX: Apply admin UI to Badges (#28724) · discourse/discourse@be5c37a · GitHub 相关（抄送 @ella @martin）。

[Richie (Richie Rich)]

谢谢你的见解@david

[Lilly (Lillian Louis)]

我在加拿大，这次我怪英国。

谢谢 Richie。我甚至没考虑到地区设置

[Jagster (Jakke Lehtonen)]

这完全离题了，但这里没有英语（加拿大）的选项，对吗？那么你会使用英国还是美国的地区设置？当然，这可能取决于具体情况，但总的来说呢？

[Lilly (Lillian Louis)]

我们的东西通常默认为美国。我们这里不太说“loo”或“trousers”。哈哈。

[Richie (Richie Rich)]

@Lilly

我把这事怪在英国身上

没问题，我们很乐意代表全世界承担责任

[ella]

感谢您发现这个问题！

我添加了一个 div 包装器以使布局更稳定，并修复了使用不同区域设置时出现的不一致问题。

此 PR 应能解决此问题：

FIX: Prevent layout shift caused by locale description length

[Richie (Richie Rich)]

@Lilly

我要为此事责怪英国

我的国家感谢你提供的快速修复 @ella