I have been going through research and tests for whole day and still found answers do not work for my case or I just do not understand how to properly implement them - therefore post here:
I have made a custom theme (not inheriting blank or luma; a standalone theme) in this path:
And there I have css files (I am using grunt LESS) in this directory:
There I have style files structured somewhat like this:
Each style file is
@import'ing next file, so all of them are chained together. For example,
file1.less has line
@import 'dirA/file2.less'; and so on.
I have added absolutely all less files to the
dev/tools/grunt/configs/themes.js file, so that grunt know where and how to operate less files and generate css files.
With this theme everything is working just great.
Then I added another theme (which is child theme) in this path:
app/design/frontend/CompanyName/newDesign. And it's parent theme is
Now I want to extend a css file in the child theme to change only one line, for example.
newDesign theme I would like to extend less file which is located in this path of parent theme:
How should this be properly handled?
As far as I understood, In child theme I have to create directory:
But what then? There should be only
_extend.less file OR there I can make exactly the same folder and file structure as I have in the parent theme? - For example:
or it should be with
_extend.less at the end, like this? -
or I cannot make it like this at all? .., and I have to use only
In any solution that will come up here, I have another question, related to the
source folder under
web/css: which files from that folder I have to add to the
dev/tools/grunt/configs/themes.js file of child theme properties?