New core navigation's top bar in dark mode on small screens has white background with light grey text
>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3488177. --> Reported by: [ambient.impact](https://www.drupal.org/user/1131532) Related to !530 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>Currently looks like this:</p> <p><img src="https://www.drupal.org/files/issues/2024-11-18/gin-3488177-core-navigation-dark-mode-top-bar-incorrect-colour.png" width="1080" height="1920" alt="Screenshot of Gin in dark mode with a white top bar and barely readable text on it."></p> <p>How I would expect it to look:</p> <p><img src="https://www.drupal.org/files/issues/2024-11-18/gin-3488177-core-navigation-dark-mode-top-bar-correct-colour.png" width="1080" height="1920" alt="Screenshot of Gin in dark mode with a dark top bar and well contrasting text on it."></p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <p>Use Gin, install core Navigation module, and size the viewport narrow enough for the sidebar to be hidden and the top bar to be displayed.</p> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <p>Looks like this is partly due to core using different selectors and also that they hard code <code>background-color: white</code> rather than one of the custom properties.</p> <h3 id="summary-remaining-tasks">Remaining tasks</h3> <p>Fix styles.</p> <h3 id="summary-ui-changes">User interface changes</h3> <p>No longer looks busted.</p> <h3 id="summary-api-changes">API changes</h3> <p>None.</p> <h3 id="summary-data-model-changes">Data model changes</h3> <p>None.</p>
issue