Theme
Primary Color
أكاديمية الزيرو

إضافة ملف CSS مخصص للصفحات ذات ال Layout المشترك

لدينا Layout بهذا الشكل تستخدمه جميع الصفحات ويحتوي على ملفات CSS عامة لكل الموقع ونريد أن نضع ملف CSS مخصص لكل صفحة فيهم

views/layout/main.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Title</title>
  <link rel="stylesheet" href="{{ asset('css/normalize.css') }}">
  <link rel="stylesheet" href="{{ asset('css/admin.css') }}">
</head>

الصفحات تستخدمه بهذا الشكل

views/pages/dashboard.blade.php
@extends('layouts.main')

@section('content')
Dashboard Page
@endsection
views/pages/profile.blade.php
@extends('layouts.main')

@section('content')
Profile Page
@endsection

الآن نريد وضع ملف CSS مخصص لصفحة Dashboard مثلا نقوم بوضع هذا السطر في ملف ال Layout الذي تستخدمه الصفحات

@stack('styles')

بهذا الشكل

views/layout/main.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Title</title>
  <link rel="stylesheet" href="{{ asset('css/normalize.css') }}">
  <link rel="stylesheet" href="{{ asset('css/admin.css') }}">
  @stack('styles')
</head>

ثم نقوم بوضع ملف ال CSS داخل ال View بهذا الشكل

views/pages/dashboard.blade.php
@extends('layouts.main')

@push('styles')
  <link rel="stylesheet" href="{{ asset('css/dashboard.css') }}">
@endpush

@section('content')
Dashboard Page
@endsection
1 إعجاب
أضف للمفضلة