D
D
Daniil Sugonyaev2017-01-31 18:42:06
css
Daniil Sugonyaev, 2017-01-31 18:42:06

How to make stylus friends with postcss-inline-media?

I'm trying to set up compilation of styles through Gulp. I'm using a plugin to write media queries right in the main styles. It looks like this:


header {
margin: 25 50 @(max-width: 80px) 20 30;
}

The plugin works fine with css, but stylus gives an error when compiling. Please let me know what are the possible solutions.
Tried the following:

@css {
header {
margin: 25 50 @(max-width: 80px) 20 30;
}
}

Works, but does not fit, tk. kills the idea.
Tried escaping:

header {
margin: 25 50 \@\(max-width\: 80px\) 20 30;
}
But it indents after the character.

header {
margin: 25 50 @ ( max-width : 80px ) 20 30;
}
The plugin does not pick up =(
Please help.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
O
Oleg, 2017-01-31
@coolswood

margin: 25 50 unquote( '@(max-width:80px) 20 30' )
You can also write mixins, something like:

max( width, data )
  unquote( '@(max-width:' + width + ') ' + data )

header
  margin 25 50 max( '180px', '20 30' )

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question