>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3562407. --> Reported by: [simeoni](https://www.drupal.org/user/3852574) Related to !729 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>When using CKEditor in the GIN theme, the "Styles" dropdown panel and its style buttons have multiple styling issues:<br> Dark Mode:<br> The dropdown panel background is white instead of dark.</p> <p>The style button labels (for Text Styles and Block Styles) have incorrect background and border colors<br> Both Light and Dark Mode.</p> <p>The style button preview and label elements are missing rounded corners (border-radius), inconsistent with GIN's design language.</p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <p>Dark Mode Issues:</p> <p>Enable GIN theme<br> Enable dark mode in GIN<br> Configure CKEditor with Text Styles and Block Styles in the Styles dropdown<br> Open CKEditor<br> Click on the "Styles" dropdown<br> Observe:</p> <p>White dropdown panel background instead of dark<br> Incorrectly styled label buttons for Text Styles and Block Styles</p> <p>Border-radius Issue (both modes):</p> <p>Enable GIN theme (in either light or dark mode)<br> Configure CKEditor with Text Styles and Block Styles in the Styles dropdown<br> Open CKEditor<br> Click on the "Styles" dropdown<br> Observe:</p> <p>Style button preview and label elements have sharp corners instead of rounded corners<br> This is inconsistent with GIN's design language</p> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <h3 id="summary-remaining-tasks">Remaining tasks</h3> <p>See attached merge request / patch</p> > Related issue: [Issue #3517732](https://www.drupal.org/node/3517732)