Changing the colour of 'Outlet' on mobile navigation - prestige theme with custom code

Store Design
, ,

Topic summary

A user is attempting to customize menu item colors in the Prestige theme’s mobile navigation. They successfully changed the ‘NEW’ menu item color using CSS targeting nth-last-child(8), but struggled to change the ‘OUTLET’ item to red.

The Issue:

  • The user suspected the dropdown functionality on ‘OUTLET’ was preventing the color change
  • Their existing CSS approach worked for simple menu items but not for items with dropdowns

The Solution:
A developer provided working CSS code that targets the ‘OUTLET’ button element specifically:

nav.SidebarMenu__Nav.SidebarMenu__Nav--primary .Collapsible:last-child button {
    color: red;
}

Implementation:

  • Add the code to the bottom of the theme.css file via Themes → Edit Code
  • The key difference is targeting the button element within the last Collapsible item, rather than using nth-last-child positioning

The solution appears to have been successfully applied to the live site (emreco.com).

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

Hi,

Desktop site I have managed to change but the mobile site I can’t figure out. I have changed the colour of ‘NEW’ on my mobile navigation using the below code to theme.css

@media screen and (max-width: 1139px) {
nav.SidebarMenu__Nav .Collapsible:nth-last-child(8) a {
color: lightyellow;
}

MOBILE-MENU.jpg
MOBILE-MENU.jpg1179×1980 70.2 KB

However, I can’t change the OUTLET colour to red. I am assuming it’s because unlike NEW the OUTLET has dropdown function. Is this correct? Can anyone help.

Thank you!

https://emreco.com/

2

Hey @ChristinaLavery

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

3

Hello @ChristinaLavery ,

Can you please share the Url of your store

4

Hi,

https://emreco.com/

5

Hi Moeed,

https://emreco.com/

6

Hi please can you help me with code to customise my prestige mobile menu like his? mine is white without social icons. I want it black and + drop-down

IMG_8660.jpg
IMG_8660.jpg1290×2463 84.5 KB

IMG_8661.jpg
IMG_8661.jpg1290×2453 66.6 KB

menus like his.

7

Hello, here is the solution for changing the color of a specific menu item.

Right now, the Outlet menu item is red on your live site, so I have also made it red in the mobile menu. Here is the CSS for that:

nav.SidebarMenu__Nav.SidebarMenu__Nav--primary .Collapsible:last-child button {
    color: red;
}

Go to Themes → Edit Code, then search for the file theme.css. Scroll to the bottom of the file and paste this CSS there.