Reputation: 93
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
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