saga
saga

Reputation: 93

Is there some way to use Blade inside a .css file in Laravel to generate a "CSS" view?

I am just guessing if this would be possible. Sass and Less are very useful when it comes to pre-process css and provide reusability and modularity. Blade does the same with HTML/PHP views. This would hugely reduce the time required to construct CSS, and to completely avoid (if the developer wants to) Sass/Less.

I have tried to search in the official documentation but I didn't find anything related to this topic. So I'm guessing if there's some way to do it by extending Blade in order to do something like:

mystyle.blade.css

@if (dimension('xs') === 1)
 .myclass { color: {$primary-color} }
@else
 .myclass { ... }
@endif

and serve this to the browser in the CSS output.

I expect this to work in some way, or at least be able to implement it by extending Blade/Laravel components.

Thank you in advance.

Upvotes: 0

Views: 268

Answers (1)

jureispro
jureispro

Reputation: 1402

You can try to detect user agent based on that you can include styles you want.

There is a package which is used to detect the agents easily

Install using composer:

composer require jenssegers/agent

If needed, add the service provider in config/app.php:

Jenssegers\Agent\AgentServiceProvider::class

And add the Agent facade alias to config/app.php:

'Agent' => Jenssegers\Agent\Facades\Agent::class,

After installation, pass the user-agent variable from your controller to the desired view.

$agent = new Agent();
return view('some.view', compact('agent'));

Finally, inside your view, you can check user-agent and load styles according to it:

@if($agent->isMobile())
 .myclass { color: {$primary-color} }
@else
 .myclass { ... }
@endif

Upvotes: 1

Related Questions