Feature request: Support for context

[hagenburger]

Thanks a lot for your project and the work you put into it. This is very useful!

Do you plan to support context for variables in a way similar how media queries and hover effects work?

Existing functionality:

/* Works well: */

:root {
  --color: blue;
}

a {
  color: var(--color);
}
/* =>
  a {
    color: blue;
  }
*/

a:hover {
  --color: green;
}
/* =>
  a:hover {
    color: green;
  }
*/

New functionality:

/* Not supported: */

:root {
  --color: blue;
}

a {
  color: var(--color);
}
/* =>
  a {
    color: blue;
  }
*/

.my-theme {
  --color: red;
}
/* =>
  .my-theme a {
    color: red;
  }
*/

[MadLittleMods]

No plans to expand on non-explicit relationships.

But I would expect this sort of thing to work and it currently doesn't 😢 I created https://github.com/MadLittleMods/postcss-css-variables/issues/55 to track it.

:root {
  --color: blue;
}

.my-theme {
  --color: red;
}

:root,
.my-theme {
  a {
     color: var(--color);
  }
}