Search code examples
csspostcss

Is there any PostCSS plugins for sum variables?

I just using precss plugin now, but i want to calculate variables in PostCSS like this

$sidebar-width: 50px;
$container-padding-left: 20px;

#sidebar {
  position: absolute;
  top: 0;
  left: 0;
  width: $sidebar-width;
  z-index: 100;
}
#container {
  margin-left: -$sidebar-width;
  padding-left: $sidebar-width + $container-padding-left;
}

Is there any plugins for calculate + in postCSS?

I also tried calc($sidebar-width + $container-padding-left); but it doesn't work.

I looked up for https://github.com/postcss/postcss/blob/master/docs/plugins.md but I couldn't find that I wanted.

Solution

  • I found postcss-calc https://github.com/postcss/postcss-calc

    This was what I wanted. plugged calc module after precss makes it.