Use when developing OroCommerce v6.1 frontend — creating custom themes, overriding templates, writing SCSS styles, configuring layout updates, creating JavaScript page components, working with jsmodules.yml or assets.yml, or customizing storefront/back-office appearance. Relevant when the user mentions 'theme', 'SCSS', 'Twig layout', 'template override', 'page component', 'layout update', 'assets.yml', 'jsmodules.yml', 'storefront styling', 'back-office UI', or any OroCommerce frontend development task.
Every OroCommerce theme lives in a bundle's Resources/views/layouts/ directory:
YourBundle/Resources/
├── views/layouts/
│ └── [theme-name]/
│ ├── theme.yml # REQUIRED — defines theme metadata
│ └── config/
│ ├── assets.yml # CSS/JS registration
│ └── jsmodules.yml # JavaScript module paths
└── public/[theme-name]/
├── scss/
│ ├── settings/ # Mixins, functions (compiled FIRST)
│ ├── variables/ # Config variables (compiled SECOND)
│ └── components/ # Component styles (compiled THIRD)
└── js/