In my Laravel project I want to that some of my partial views (like the header and footer partial views) to have their own CSS file but I just can't seem to figue out how to achieve that.
I've read in the documentation that the best to achieve that is to use the stack and push directives, however it turned that that they don't work inside an include directive.
I've created an app.blade.php inside resouces/views/layouts:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Tutorial</title>
<link rel="stylesheet" type="text/css" href="{{ url('assets/css/global.css') }}" />
@yield('styles')
</head>
<body>
@include('layouts.header')
<main>
hi
</main>
@include('layouts.footer')
</body>
</html>
I also have header.blade.php:
@section('styles')
<link href="{{ asset('assets/css/common.css') }}" rel="stylesheet">
@endsection
<header class="header">
<nav class="header-nav">
<ul class="pages">
<li>
<a href="/">Tutorial</a>
</li>
</ul>
<ul class="auth">
<li>
<a href="/login">Login</a>
</li>
<li>
<a href="/register">Register</a>
</li>
</ul>
</nav>
</header>
and a footer.blade.php:
@section('styles')
<link href="{{ asset('/assets/css/common.css') }}" rel="stylesheet">
@endsection
<footer class="footer">
<nav class="footer-nav">
<ul class="pages">
<li>
<a href="/">Tutorial</a>
</li>
</ul>
</nav>
</footer>
But the styles just don't get imported and I can't understand what I did wrong!