loyalty-cms/cms-laravel/resources/views/dashboard/header.blade.php

67 lines
1.9 KiB
PHP

<!DOCTYPE html>
<html>
<head>
<title>Dashboard Header</title>
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<style>
.header {
background: #fff;
padding: 0;
height: 66px;
line-height: 69px;
border-bottom: 1px solid rgb(230, 236, 245);
}
.header-link {
padding: 0 10px;
display: inline-block;
vertical-align: top;
cursor: pointer;
transition: all 0.3s, padding 0s;
}
.header-link:hover {
background-color: #1890ff;
color: #fff;
}
.right-header { float: right; }
.icon-trigger {
font-size: 20px;
line-height: 69px;
cursor: pointer;
transition: all 0.3s, padding 0s;
padding: 0 24px;
}
.icon-trigger:hover { color: #1890ff; }
</style>
</head>
<body>
@if (session('success'))
<div style="color: green;">{{ session('success') }}</div>
@endif
<div class="header">
<span class="icon-trigger {{ $collapsed ? 'menu-unfold' : 'menu-fold' }}" onclick="toggleSidebar()">
&#9776; <!-- Hamburger icon -->
</span>
<div class="right-header">
@include('dashboard.header-dropdown')
</div>
</div>
<script>
function toggleSidebar() {
fetch('/dashboard/toggle', {
method: 'POST',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}',
'Content-Type': 'application/json',
},
body: JSON.stringify({ collapsed: !{{ $collapsed }} })
})
.then(response => response.json())
.then(data => {
location.reload(); // Reload to reflect collapsed state
});
}
</script>
</body>
</html>