chore: Update CakeLte dependencies and add Bootstrap 5 support

arodu · Jun 1, 2024 · b3f410c · b3f410c
1 parent 221aeac
commit b3f410c
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 43 deletions.
diff --git a/README.md b/README.md
@@ -1,11 +1,14 @@
 # CakeLTE: AdminLTE plugin for CakePHP 5.x
 
+> [!CAUTION]
+> This version is not yet ready to be implemented, still in development
+
 ## Getting Started
 
 ### Dependencies
 
-- [FriendsOfCake/bootstrap-ui](https://github.com/FriendsOfCake/bootstrap-ui), transparently use Bootstrap 4 with CakePHP 4.
-- [AdminLTE 3.2](https://adminlte.io/), bootstrap 4 admin theme.
+- [FriendsOfCake/bootstrap-ui](https://github.com/FriendsOfCake/bootstrap-ui), transparently use Bootstrap 5 with CakePHP 5.x.
+- [AdminLTE 4.x](https://adminlte.io/), bootstrap 5 admin theme.
 
 ### Installing
 
@@ -134,9 +137,7 @@ echo $this->Html->link(__('CakeLTE debug page'), '/cake_lte/debug' );
 // {your-url}/cake_lte/debug
 ```
 
-![Page Debug with default layout](docs/page-debug_default.png)
-
-![Page Debug with top-nav layour](docs/page-debug_top-nav.png)
+![Page Debug with default layout](docs/page-debug_default_darkmode.png)
 
 ## License
 

diff --git a/docs/page-debug_default_darkmode.png b/docs/page-debug_default_darkmode.png
diff --git a/templates/Pages/debug.php b/templates/Pages/debug.php
@@ -69,7 +69,7 @@
         </h1>
         <p>
             <?= $this->Html->link(
-                '<i class="fab fa-github fa-fw"></i> CakeLTE ' . $this->CakeLte->version(),
+                '<i class="bi bi-github"></i> CakeLTE ' . $this->CakeLte->version(),
                 'https://github.com/arodu/cakelte',
                 ['escape' => false, 'target' => '_blank']
             ) ?>
@@ -250,7 +250,7 @@
     }
 
     .bullet::before {
-        font-family: "Font Awesome 5 Free";
+        font-family: "bootstrap-icons";
         font-weight: 900;
         font-size: 18px;
         display: inline-block;
@@ -263,11 +263,11 @@
 
     .bullet.success::before {
         color: #88c671;
-        content: "\f058";
+        content: "\F26A";
     }
 
     .bullet.problem::before {
         color: #d33d44;
-        content: "\f057";
+        content: "\F622";
     }
 </style>
diff --git a/templates/element/content/header.php b/templates/element/content/header.php
@@ -0,0 +1,8 @@
+<div class="row mb-2">
+  <div class="col-sm-6">
+    <h1 class="m-0"><?= $this->fetch('title') ?></h1>
+  </div><!-- /.col -->
+  <div class="col-sm-6">
+    <?= $this->Breadcrumbs->render(['class' => 'float-sm-right']) ?>
+  </div><!-- /.col -->
+</div><!-- /.row -->
diff --git a/templates/element__bk/content/header.php b/templates/element__bk/content/header.php
@@ -1,8 +1,8 @@
 <div class="row mb-2">
-  <div class="col-sm-6">
-    <h1 class="m-0"><?= $this->fetch('title') ?></h1>
-  </div><!-- /.col -->
-  <div class="col-sm-6">
-    <?= $this->Breadcrumbs->render(['class' => 'float-sm-right']) ?>
-  </div><!-- /.col -->
-</div><!-- /.row -->
+    <div class="col-sm-6">
+        <h1 class="m-0"><?= $this->fetch('title') ?></h1>
+    </div><!-- /.col -->
+    <div class="col-sm-6">
+        <?= $this->Breadcrumbs->render(['class' => 'float-sm-right']) ?>
+    </div><!-- /.col -->
+</div><!-- /.row -->
diff --git a/templates/layout/default.php b/templates/layout/default.php
@@ -390,37 +390,13 @@
         <main class="app-main"> <!--begin::App Content Header-->
             <div class="app-content-header"> <!--begin::Container-->
                 <div class="container-fluid"> <!--begin::Row-->
-                    <div class="row">
-                        <div class="col-sm-6">
-                            <h3 class="mb-0">Unfixed Layout</h3>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-end">
-                                <li class="breadcrumb-item"><a href="#">Home</a></li>
-                                <li class="breadcrumb-item active" aria-current="page">
-                                    Unfixed Layout
-                                </li>
-                            </ol>
-                        </div>
-                    </div> <!--end::Row-->
+                    <?= $this->element('CakeLte.content/header') ?>
                 </div> <!--end::Container-->
             </div> <!--end::App Content Header--> <!--begin::App Content-->
             <div class="app-content"> <!--begin::Container-->
                 <div class="container-fluid"> <!--begin::Row-->
-                    <div class="row">
-                        <div class="col-12"> <!-- Default box -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">Title</h3>
-                                    <div class="card-tools"> <button type="button" class="btn btn-tool" data-lte-toggle="card-collapse" title="Collapse"> <i data-lte-icon="expand" class="bi bi-plus-lg"></i> <i data-lte-icon="collapse" class="bi bi-dash-lg"></i> </button> <button type="button" class="btn btn-tool" data-lte-toggle="card-remove" title="Remove"> <i class="bi bi-x-lg"></i> </button> </div>
-                                </div>
-                                <div class="card-body">
-                                    Start creating your amazing application!
-                                </div> <!-- /.card-body -->
-                                <div class="card-footer">Footer</div> <!-- /.card-footer-->
-                            </div> <!-- /.card -->
-                        </div>
-                    </div> <!--end::Row-->
+                    <?= $this->Flash->render() ?>
+                    <?= $this->fetch('content') ?>
                 </div>
             </div> <!--end::App Content-->
         </main> <!--end::App Main--> <!--begin::Footer-->