The site icons in all the dropdowns in the top bar on the chat page seem to have... disappeared?

Question

This is how it looks like on any page¹ except the chat page:

The site icons are visible here, but on the chat page², these icons seem to have disappeared (the alignment is messed up as well):

This also happens in the reputation and inbox dropdowns.

I'm using Chrome (version 102.0.5005.115) on Windows 11.

---

^{1 The dropdown is accessible by clicking on the icon in the rightmost corner of the top nav.
2 This can be accessed by clicking on the Stack Exchange button in the leftmost corner of the top nav on the chat page.}

Answer 1

For anyone who can't wait for 6 to 8 weeks it will take for this to get fixed, here is a userscript to repair the broken window. It is as simple as adding the class s-topbar to the topbar-wrapper once the site-switcher is loaded.

Code on Github | Direct install

Code for the curious

// ==UserScript==
// @name         Fix chat icons
// @namespace    https://meta.stackexchange.com/users/158100/rene
// @version      0.1
// @description  Fix chat icons in site switcher
// @author       rene
// @match        https://chat.meta.stackexchange.com/
// @match        https://chat.stackexchange.com/
// @match        https://chat.stackoverflow.com/
// @icon         https://www.google.com/s2/favicons?sz=64&domain=stackexchange.com
// @icon         https://www.google.com/s2/favicons?sz=64&domain=stackoverflow.com
// @grant        none
// ==/UserScript==

(function() {
    (new MutationObserver(function(mutations) {
        document.querySelector('.topbar-wrapper').classList.add('s-topbar');
    })).observe(document.querySelector('.js-topbar-dialog-corral'), {
        childList: true,
        subtree: true
    });
})();

Visit Stack Apps for more awesome fixes or share your own!