如果我没记错的话,额外的包装器可以更轻松地将标题与主题内容对齐,因为我可以将组合的 .header-contents__toggle-and-logo 宽度设置为 var(--d-sidebar-width),它与侧边栏的宽度相同,与内容无关。
没有额外的包装器,布局是可以实现的……但有了两个网格列,我就无法依赖单一的宽度了。
我需要假设侧边栏切换按钮始终是某种固定宽度,然后根据该宽度计算最大徽标宽度。这可行,但我记得它更脆弱……我有一段时间没看这个了,但也许值得再试一次 ![]()
回到这个……我可以看到为什么它使用了覆盖。没有它,您必须装饰标题或 header-icons 小部件,因此您最终会在 .title 或 .panel 中添加内容,这使得搜索栏的居中对齐更加困难……并且需要一些 CSS 来使布局更脆弱,并使与其他标题组件的兼容性更难。理想情况下,搜索栏内容应位于这些 div 之外,但没有可以挂钩的地方。
我们现在可以将插件出口添加到小部件中,这可能会有所帮助……
这将允许在 .panel div 之前添加内容,而不是在其中使用 decorateWidget。在这种情况下,可以从 header-search 组件中删除模板覆盖,并添加一个新的连接器到:
javascripts/discourse/connectors/before-header-panel
其中可以包含
<MountWidget @widget="search-banner" />
将插件出口添加到小部件以便我们可以将小部件添加到插件出口似乎有点迂回……@david/@cvx 您知道这是否会对性能产生负面影响或引起任何其他问题吗?

