Qual é então a melhor maneira de estender menos conteúdo de arquivos <module>/web/css/source/module/
, como por exemplo Magento_Checkout/web/css/source/module/_minicart.less
?
Supondo que
A) ANULAR
- menos relacionado ao tema, você deve criar (ou copiar) um menos com o mesmo nome do tema pai e colocá-lo no seu tema assim
theme-frontend-blank/web/css/source/_buttons.less
-><your-theme>/web/css/source/_buttons.less
- menos específico do módulo, você deve criar (ou copiar) um menos com o mesmo nome do tema pai e colocá-lo no seu tema assim
theme-frontend-blank/Magento_Theme/web/css/source/_module.less
-><your-theme>Magento_Theme/web/css/source/_module.less
- UI lib menos, você deve criar (ou copiar) um menos com o mesmo conteúdo na pasta da biblioteca e colocá-lo no seu tema assim
magento2-base/lib/web/css/source/lib/_buttons.less
-><your-theme>Magento_Theme/web/css/source/lib/_buttons.less
e para
B) ESTENDER
- menos relacionado ao tema, você deve criar um arquivo _extend.less no seu tema, adicionando _extend no nome como este
<your-theme>/web/css/source/_navigation_extend.less
para estendertheme-frontend-blank/web/css/source/_navigation.less
E registrar esse arquivo com a diretiva @import no _extend.less do conteúdo do tema em web / css / source ->@import "_navigation_extend.less"
- menos específico do módulo, você deve criar um arquivo _extend.less no caminho do módulo do tema como este,
<your-theme>Magento_CatalogSearch/web/css/source/_extend.less
que estende o _module.less original do Magento_CatalogSearch - Na interface do usuário lib menos, você deve criar um conteúdo less com o mesmo nome na pasta da biblioteca, adicionando _extend no nome dessa forma
<your-theme>Magento_Theme/web/css/source/lib/_buttons_extend.less
para estendermagento2-base/lib/web/css/source/lib/_buttons.less
E registrar esse arquivo com a diretiva @import no _extend.less do conteúdo do tema em web / css / source - >@import "lib/_buttons_extend.less"
A teoria deve sugerir que você crie um _minicart_extend.less, mas não funciona automaticamente. Talvez você deva importar esse arquivo no _extend.less desse módulo, como explicado em B1 ou B3?
E por que esses componentes que estendem menos não são incluídos automaticamente na análise do css, se esta é a maneira correta de estendê-los, mas deve ser importada no _extend.less?
(Aqui também vem outra pergunta: quais são as diferenças entre web/css/source/lib/_buttons.less
e web/css/source/_buttons.less
? 😕)
Estou um pouco confuso. Espero que alguém possa me ajudar.
Desculpe por este texto longo.
Fontes: