pug-php / pug-symfony

Pug (Jade) template engine for Symfony

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Styles with asset()

NotJustPizza opened this issue · comments

I tried

.parallax-quote.parallaxBg(style={'background-position': "50% -402px", 'background-image': 'url("' + asset('assets/img/patterns/5.png') + ')"'})

but

{'background-position': "50% -402px", 'background-image': 'url("'
Missing closing: }

and also tried

.parallax-quote.parallaxBg(style='background-position: "50% -402px", background-image: url("' + asset('assets/img/patterns/5.png') + ')"')

but

Parse error: syntax error, unexpected 'router' (T_STRING)
commented

Hi,

The first error Missing closing: } is caused because you use expressionLanguage option with auto (default value) or php. But + concatenation in {} object is only available with the js mode.

The second syntax is not valid as CSS (the , and quotes arround "50% -402px") and without asset(), it seems right:

.foo(style='background-position: 50% -402px; background-image: url("' + strtolower('/img.PNG') + '");')

This works.
And the first example too if you use the option 'expressionLanguage' => 'js':

.foo(style={'background-position': "50% -402px", 'background-image': 'url("' + strtolower('/img.PNG') + '")'})

I also test with 'expressionLanguage' => 'php' and both string and array styles works:

.foo(style=('background-position: 50% -402px; background-image: url("' . strtolower('/img.PNG') . '");'))
.foo(style=array('background-position' => "50% -402px", 'background-image' => 'url("' . strtolower('/img.PNG') . '")'))

All that stuff works as long as you concat with regular PHP functions.

Your second error seems to be linked to the asset replacement. I inspect that.

commented

OK, I found it, nothing related to assets() in fact, it's url() that is detected as a replacement. Until I found a proper way, you can work around with splitting url: ur' + 'l (or with a . with the PHP syntax).

commented

Hi, brand new stuff for you and every-one need inline background asset:

.foo(style=array('background-image' => css_url('assets/img/patterns/5.png')))

It apply url("") around a path result.

The available syntaxes with expressionLanguage = 'php' :
https://github.com/pug-php/pug-symfony/blob/906c5a8f1193ff601b447c60475d90fc93f5759d/tests/project/app/Resources/views/style-php.pug
The available syntaxes with expressionLanguage = 'js' :
https://github.com/pug-php/pug-symfony/blob/906c5a8f1193ff601b447c60475d90fc93f5759d/tests/project/app/Resources/views/style-js.pug

Please use composer update and tell me if you could use it to solve your need.