A
A
Alexander Wolf2019-02-06 16:11:07
css
Alexander Wolf, 2019-02-06 16:11:07

How to tell one css file about another when using css modules?

Tell me, who worked with stylus and css modules, how to import styles from one file to another without styles?)
Let me explain the case: we have this markup: <a><b>Foo</b><c>Bar</c></a>. Styles for a and b are set in file 1.styl, and for c in file 2.styl.
Next, we need to make sure that when you hover over a , the frame for a and c lights up . You can, of course, do something like a > *:fisrt-child{}, but this is a hat in the 1.styl file.
I would like to somehow tell the 1.styl file that there is another 2.styl file and get something like this:

// 1.styl
import other from './2.styl';

a:hover
  border-color red
  other(b)
    border-color red

PS: of course we don't have a and b tags, we have divs with classes. In the question, I wrote it like this for simplicity. The idea, I hope, is clear. And, yes, I understand that this is not a stylus question. It is just a preprocessor and css modules does not work at its abstraction level yet. So this is more of a question about webpack and the css modules themselves. That is, according to the module where :global is implemented, for example.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
F
FeST1Val, 2019-02-06
@FeST1Val

If I understood you correctly, then read this: stylus-lang.com/docs/import.html
PS I just don't use Stylus, but scss does the same)

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question