Bootstrap4 :: Report UI updates

resources/views/themes/default1/agent/kb/article/index.blade.php

@@ -2,12 +2,32 @@
 
 @extends('themes.default1.agent.layout.sidebar')    
 
-@section('article')
-active
+@section('Tools')
+class="nav-link active"
+@stop
+
+@section('tool')
+class="active"
+@stop
+
+@section('kb')
+class="nav-link active"
 @stop
 
 @section('all-article')
-class="active"
+class="nav-link active"
+@stop
+
+@section('article')
+class="nav-link active"
+@stop
+
+@section('article-menu-open')
+class="nav nav-treeview menu-open"
+@stop
+
+@section('article-menu-parent')
+class="nav-item menu-open"
 @stop
 
 @section('PageHeader')
@@ -15,28 +35,28 @@ class="active"
 @stop
 
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.allarticle')}}</h3>
+<!-- check whether success or not -->
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <i class="fa  fa-check-circle"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('success')}}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>{!! Lang::get('lang.alert') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('fails')}}
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.allarticle')}}</h3>
     </div>
-    <div class="box-body">
-        <!-- check whether success or not -->
-        @if(Session::has('success'))
-        <div class="alert alert-success alert-dismissable">
-            <i class="fa  fa-check-circle"></i>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('success')}}
-        </div>
-        @endif
-        <!-- failure message -->
-        @if(Session::has('fails'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.alert') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('fails')}}
-        </div>
-        @endif
+    <div class="card-body">
         {!! Datatable::table()
         ->addColumn(Lang::get('lang.name'),
         Lang::get('lang.publish_time'),