How to style modules using recommended practice

Hi,

Can you please let me know what is the correct way of styling a module look and feel on the front end?

i.e. I have a module from amasty.
From my understaning I need to modify ccs entries in _module.less file which sits on my server under:

vendor/amasty/module_name/view/frontend/web/css/sourse/_module.less

When I change the file, clear cache, remove pub/static/* and var/view_prepocessed/* my changes are nicely shown on the front end but I’m guessing when I update the module all my changes will be overwritten. That is why I should never customize anything in the vendor directory.

I tried to move the _module.less file and modify it there but there are no changes on the front end.

app/design/frontend/my_store/theme/web/css/source

Could you please give me a tip on how to do it correctly?
Thank you.

Yes, your current solution would be classed as editing “core code”.

Format Example

Now, if memory serves, you’re close with your solution. I think you actually need to put your _module.less file under:

app/design/frontend/my_store/theme/amasty_module/web/css/sourse/_module.less

Real Example

In the following example, it assumes you’re using:

  • Smartwave Porto Theme ("Smartwave")
  • Porto Child Theme ("porto_child")
  • Amasty Module called “Example” ("Amasty_Example")

*All care-sensitive

app/design/frontend/Smartwave/porto_child/Amasty_Example/web/css/sourse/_module.less

Side Note

I believe another way of doing it is to create a module in app/code/ and do something similar. But I don’t think I’ve done it that way before - So, I can’t talk you though it.

Neither of these two worked for me.

I tried 2 ways under /frontend
1.1
frontend/my_store/theme/Amasty_module-name/web/css/sourse/_module.less
1.2
frontend/my_store/theme/Amasty/module-name/web/css/sourse/_module.less
…and one creating a module
2.
app/code/my_store/Amasty_module-name/web/css/sourse/_module.less

Annoying. I believe I will have to live with it and every time I upgrade the module I will have to update the file.

I’ll edit my answer over the weekend once I try it myself. I don’t think I’m far off the answer.

Thank you for your time.