Chosen dropdown in Claro subtheme

Question

I created a subtheme for Claro theme in drupal 10. Before adding any custom code, I expected it to not be different from the parent theme, but the chosen dropdowns are off. (first pic - claro, second - claro subtheme)

This is what I have in my my_theme.info.yml

name: 'My Theme'
type: theme
core: 9.x
core_version_requirement: ^9 || ^10
base theme: claro
screenshot: screenshot.png
libraries:
 - my_theme/my-theme-style
 - claro/global-styling
regions:
  header: Header
  pre_content: Pre-content
  breadcrumb: Breadcrumb
  highlighted: Highlighted
  help: Help
  content: Content
  page_top: Page top
  page_bottom: Page bottom
  sidebar_first: First sidebar
regions_hidden:
 - sidebar_first

I tried to add all that is under libraries, libraries-override and libraries-extend in the claro.info.yml, but nothing changes. How can I inherit also the style for chosen?

Answer 1

You have to specify all the components you want to use from the base theme in your subtheme .info file.

Maybe you didn't rebuild cache the time you added all the libraries and their overrides.

I see a specific component related to your case:

  core/drupal.dropbutton:
    CSS:
      component:
        misc/dropbutton/dropbutton.css: css/components/dropbutton.css

You at least need to add that (under the appropriate config), although I expect you'll want more, if not all of the settings copied from Claro info file.