기억이 맞다면, 추가 래퍼를 사용하면 .header-contents__toggle-and-logo의 너비를 var(--d-sidebar-width)로 설정할 수 있어 제목을 주제 내용과 정렬하기가 더 쉬워집니다. 이는 콘텐츠와 관계없이 사이드바와 동일한 너비를 유지하기 때문입니다.
추가 래퍼가 없으면 레이아웃은 작동합니다… 하지만 두 개의 그리드 컬럼을 사용할 경우 둘 다에 대해 단일 너비에 의존할 수 없습니다.
사이드바 토글이 항상 정적(static)인 너비를 가질 것이라고 가정해야 하며, 그에 따라 로고의 최대 너비를 계산해야 합니다. 이 방법은 작동하지만, 더 취약(fragile)하다는 인상을 받았습니다… 이 부분에 대해 한동안 살펴보지 않았지만, 다시 시도해 볼 가치가 있을지도 모릅니다 
다시 이 주제로 돌아가서… 왜 오버라이드로 처리되었는지 이해할 수 있습니다. 오버라이드가 없으면 제목이나 header-icons 위젯을 데코레이트(decorate)해야 하므로, 결국 .title 또는 .panel 내부에 콘텐츠를 추가하게 됩니다. 이는 검색 막대의 중앙 정렬을 더 어렵게 만들며… 레이아웃을 더 취약하게 만들고 다른 헤더 컴포넌트와의 호환성을 더 어렵게 만드는 CSS가 필요합니다. 이상적으로는 검색 막대 콘텐츠가 이러한 div 외부에 있어야 하지만, 이를 위해 연결할 수 있는 훅(hook)이 없습니다.
이제 위젯에 플러그인 아울렛(plugin outlet)을 추가할 수 있으므로, 이것이 도움이 될 수 있습니다…
이를 통해 decorateWidget을 사용하여 .panel div 내부에 추가하는 대신 .panel div 앞에 콘텐츠를 추가할 수 있습니다. 이 경우 헤더 검색 컴포넌트에서 템플릿 오버라이드를 제거하고, 새로운 커넥터를 다음 위치에 추가할 수 있습니다:
javascripts/discourse/connectors/before-header-panel
여기에는 다음을 포함할 수 있습니다.
<MountWidget @widget="search-banner" />
위젯에 플러그인 아울렛을 추가하여 플러그인 아울렛에 위젯을 추가하는 것은 다소 복잡해 보이지만… @david/@cvx 이 방식이 성능에 악영향을 주거나 다른 문제를 일으키는지 아시나요?