Change the carton category colors

[Eduardo_Braga (Eduardo)]

Need help to change colors CSS

[tshenry (Taylor)]

Here’s something that you can play around with:

.list-controls {
  .category-drop, .tag-drop {
    .select-kit-header {
      background: beige;
      color: black;
      svg {
        color: black;
      }
    }
    .select-kit-filter {
      background: beige;
      .filter-input {
        color: black;
      }
    }
    .select-kit-collection {
      background: beige;
      color: black;
      scrollbar-color: darkgray beige;
      webkit-scrollbar-color: darkgray beige;
  
      .select-kit-row {
        background: beige;
        color: darkgrey;
        .badge-wrapper.bullet span.badge-category {
          color: black;
          svg {
            color: black;
          }
        }
        &.is-highlighted {
          background: brown;
          color: lightgrey;
          .badge-wrapper.bullet span.badge-category {
            color: white;
          }
        }
      }
    }
  }
}

[Eduardo_Braga (Eduardo)]

Mobile? CSS

[tshenry (Taylor)]

Here’s the Mobile CSS for that dropdown:

.list-controls {
  .nav-pills {
    .navigation-toggle {
      background: beige;
      a {
        color: black;
        &:hover {
          background-color: beige;
        }
      }
    }
    .drop {
      background: beige;
      a {
        color: brown;
      }
    }
  }
}

If you need to figure out any other components, I recommend learning how to use your browser’s web inspector to track down the correct CSS selectors. There are a bunch of free resources online to learn how to do this: find css selector using web inspector - Google Search

[Eduardo_Braga (Eduardo)]

Okay, I did not find it to change the color icon

[tshenry (Taylor)]

The SVG icons have been added to my original reply for completeness.