diff --git a/catatan_rilis.md b/catatan_rilis.md
index 5b1286f2..1205d622 100644
--- a/catatan_rilis.md
+++ b/catatan_rilis.md
@@ -8,6 +8,7 @@ Di rilis ini, versi 2601.0.0 berisi penambahan dan perbaikan yang diminta penggu
 
 #### Perbaikan BUG
 
+1. [#893](https://github.com/OpenSID/OpenKab/issues/893) Perbaiki UI Layout dashboard dan sidebar.
 
 #### Perubahan Teknis
 
diff --git a/config/adminlte.php b/config/adminlte.php
index 9e4c94c3..11645028 100644
--- a/config/adminlte.php
+++ b/config/adminlte.php
@@ -313,7 +313,7 @@
         ],
         [
             'icon' => 'fas fa-info-circle fa-lg nav-link',
-            'id'  => 'catatan-rilis',
+            'id' => 'catatan-rilis',
             'text' => '',
             'url' => '#',
             'topnav_right' => true,
@@ -347,12 +347,12 @@
         ],
         [
             'text' => 'Dasbor',
-            'icon' => 'fas fa-home',
+            'icon' => 'nav-icon fas fa-home',
             'url' => '/dasbor',
         ],
         [
             'text' => 'Dasbor Demografi',
-            'icon' => 'fas fa-home',
+            'icon' => 'nav-icon fas fa-home',
             'url' => '/dasbor-demografi',
         ],
 
diff --git a/public/assets/costume/css/admin.css b/public/assets/costume/css/admin.css
index 6d33c133..5cb6ce3b 100644
--- a/public/assets/costume/css/admin.css
+++ b/public/assets/costume/css/admin.css
@@ -4,8 +4,8 @@ a:hover {
     color: inherit;
 }
 
-.unlink  a,
-.unlink  a:hover {
+.unlink a,
+.unlink a:hover {
     text-decoration: none;
     color: inherit;
 }
@@ -36,33 +36,33 @@ tr.shown td.details-control {
     transition: .5s;
 }
 
-.img-cover{
+.img-cover {
     height: 100px;
     object-fit: cover;
 }
 
 .w-40 {
-    width: 40%!important;
+    width: 40% !important;
 }
 
 .w-42 {
-    width: 42%!important;
+    width: 42% !important;
 }
 
 .w-80 {
-    width: 80%!important;
+    width: 80% !important;
 }
 
 .w-56px {
-    width: 56px!important;
+    width: 56px !important;
 }
 
 .w-70px {
-    width: 70px!important;
+    width: 70px !important;
 }
 
 .w-100px {
-    width: 100px!important;
+    width: 100px !important;
 }
 
 .select2-container .select2-selection--single {
@@ -557,10 +557,51 @@ tr.shown td.details-control {
 .nav-treeview .nav-treeview {
     padding-left: 5px !important;
 }
+
 .nav-treeview .nav-item {
     padding-left: 5px !important;
 }
 
 .has-treeview .has-treeview {
     padding-left: 5px !important;
+}
+
+/* When sidebar is collapsed - only apply margin on larger screens */
+@media (min-width: 992px) {
+
+    .sidebar-collapse .content-wrapper,
+    .sidebar-collapse .main-footer,
+    .sidebar-collapse .main-header {
+        margin-left: 4.6rem !important;
+    }
+}
+
+/* Reset margin for mobile when sidebar is collapsed */
+@media (max-width: 991.98px) {
+
+    .sidebar-collapse .content-wrapper,
+    .sidebar-collapse .main-footer,
+    .sidebar-collapse .main-header {
+        margin-left: 0 !important;
+    }
+}
+
+/* Adjust arrow icon position */
+.nav-sidebar .nav-link>.right,
+.nav-sidebar .nav-link>p>.right {
+    position: absolute;
+    right: 5px;
+    top: 50%;
+    transform: translateY(-50%);
+    transition: transform 0.3s ease;
+}
+
+/* When menu is open, rotate the arrow */
+.nav-sidebar .menu-open>.nav-link>.right,
+.nav-sidebar .menu-open>.nav-link>p>.right {
+    transform: translateY(-50%) rotate(-90deg);
+}
+
+a .nav-link {
+    margin-left: -5px;
 }
\ No newline at end of file
diff --git a/resources/views/dasbor/index.blade.php b/resources/views/dasbor/index.blade.php
index 626d263d..02281866 100644
--- a/resources/views/dasbor/index.blade.php
+++ b/resources/views/dasbor/index.blade.php
@@ -13,10 +13,18 @@
                 @include('dasbor.filter')
                 @include('dasbor.summary')
             </div>
-        </div>        
+        </div>
         {{-- @include('dasbor.statistik_penduduk') --}}
-        @include('dasbor.peta')
-        @include('dasbor.tabel_penduduk')
+        <div class="card rounded-0 border-0 shadow-none col-12">
+            <div class="card-body">
+                @include('dasbor.peta')
+            </div>
+        </div>
+        <div class="card rounded-0 border-0 shadow-none col-12">
+            <div class="card-body">
+                @include('dasbor.tabel_penduduk')
+            </div>
+        </div>
     </div>
 
 @endsection