gitea/Abiyasa_Putra_Prasetya
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: add responsive layout for role student

Browse Source
This commit is contained in:
abiyasa05 2025-05-29 15:50:18 +07:00
parent 013fd925ef
commit 047307ff17
5 changed files with 367 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
Penilaian Literasi/iClOP-V2/app/Http/Controllers/Literacy/LiteracyMaterialStudentController.php
View File

@ -41,13 +41,12 @@ function show_materials()
public function view_materials($id) public function view_materials($id)
{ {
$material_student = LiteracyMaterial::findOrFail($id); $material_student = LiteracyMaterial::findOrFail($id);
$path = storage_path('app/public/' . $material_student->file_path);
// Pastikan file tersedia if (!file_exists($path)) {
if (!$material_student->file_path || !file_exists(public_path($material_student->file_path))) {
abort(404, 'File tidak ditemukan'); abort(404, 'File tidak ditemukan');
} }
// Arahkan ke file langsung agar bisa ditampilkan di browser return response()->file($path);
return response()->file(public_path($material_student->file_path));
} }
} }

192
Penilaian Literasi/iClOP-V2/resources/views/literacy/student/assessments/assessment.blade.php
View File

@ -18,6 +18,58 @@
padding: 20px; padding: 20px;
} }
@media (max-width: 768px) {
#sidebarMenu {
position: fixed;
top: 0;
left: 0;
width: 245px;
height: 100vh;
background-color: #fff;
z-index: 1040;
transform: translateX(-100%);
transition: transform 0.3s ease-in-out;
display: block !important;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 60px;
}
#sidebarMenu.active {
transform: translateX(0);
}
#toggleSidebar {
position: relative;
z-index: 1051;
}
}
@media (max-width: 768px) {
#rightSidebar {
position: fixed;
top: 0;
right: 0;
width: 245px;
height: 100vh;
background-color: #fff;
z-index: 1040;
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
box-shadow: -2px 0 5px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 60px;
}
#rightSidebar.active {
transform: translateX(0);
}
#toggleRightSidebar {
position: relative;
z-index: 1051;
}
}
/* NAV LINK */ /* NAV LINK */
.nav-link { .nav-link {
@ -188,39 +240,55 @@
<body> <body>
<!-- NAVBAR --> <!-- NAVBAR -->
<nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;"> <nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;">
<div class="container-fluid"> <div class="container-fluid px-3 px-md-4">
<!-- <a class="navbar-brand" href="#">Navbar</a> --> <!-- Wrapper mobile: Logo di tengah, toggle di kanan -->
<img src={{asset("./images/logo.png")}} alt="logo" width="104" height="65"> <div class="d-flex w-100 align-items-center justify-content-between d-lg-none">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" <!-- Logo di tengah secara absolut -->
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" <div class="position-absolute start-50 translate-middle-x">
aria-label="Toggle navigation"> <img src="{{ asset('./images/logo.png') }}" alt="logo" width="104" height="65" id="logoResponsive">
<span class="navbar-toggler-icon"></span> </div>
<!-- Toggle Sidebar Kiri -->
<button id="toggleSidebar" class="btn btn-primary">
<i class="fas fa-bars"></i>
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="mx-auto"> <!-- Toggle Sidebar Kanan -->
<ul class="navbar-nav mb-2 mb-lg-0 justify-content-center"> <button id="toggleRightSidebar" class="btn btn-primary ms-2">
<i class="fas fa-bars"></i>
</button>
</div>
<!-- Desktop Layout -->
<div class="d-none d-lg-flex w-100 align-items-center justify-content-between">
<!-- Logo Kiri -->
<div>
<a href="/dashboard-student">
<img src="{{ asset('./images/logo.png') }}" alt="logo" width="104" height="65">
</a>
</div>
<!-- Menu Tengah -->
<ul class="navbar-nav mb-2 mb-lg-0">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard <a class="nav-link active" href="/dashboard-student">Dashboard Student</a>
Student</a>
</li> </li>
</ul> </ul>
</div>
<!-- User Kanan -->
<div class="dropdown"> <div class="dropdown">
<p style="margin-top: 10px; margin-right: 10px;">{{auth()->user()->name}} <p class="m-0 d-flex align-items-center">
<img src="{{ asset('./images/Group.png') }}" alt="Group" {{ auth()->user()->name }}
style="height: 50px; margin-right: 10px;"> <img src="{{ asset('./images/Group.png') }}" alt="Group" style="height: 50px; margin-left: 10px; margin-right: 10px;">
<i class="fas fa-chevron-down" style="color: #0079FF;"></i> <i class="fas fa-chevron-down" style="color: #0079FF;"></i>
<div class="dropdown-content" id="dropdownContent"> <div class="dropdown-content" id="dropdownContent">
<form id="logout-form" action="{{ route('logout') }}" method="POST"> <form id="logout-form" action="{{ route('logout') }}" method="POST">
@csrf @csrf
<a href="#" <a href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
</form> </form>
</div> </div>
</p> </p>
</div> </div>
<!-- <button class="btn btn-primary custom-button-sign-up" onclick="window.location.href='register.html'">Sign Up</button> -->
</div> </div>
</div> </div>
</nav> </nav>
@ -229,7 +297,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<!-- SIDEBAR --> <!-- SIDEBAR -->
<nav class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow" style="position: sticky; top: 20px;"> <nav id="sidebarMenu" class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow">
<div class="sidebar-sticky" style="margin-top: 20px;"> <div class="sidebar-sticky" style="margin-top: 20px;">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li class="nav-item" style="margin-bottom: 40px;"> <li class="nav-item" style="margin-bottom: 40px;">
@ -416,8 +484,71 @@ class="w-100 h-24 p-3 border rounded-lg focus:ring focus:ring-blue-200"
</div> </div>
</main> </main>
<!-- NAVIGASI NOMOR SOAL --> <!-- NAVIGASI NOMOR SOAL DESKTOP -->
<aside class="col-md-2 d-flex flex-column align-items-end" style="position: sticky; top: 20px; height: fit-content;"> <aside class="col-md-2 d-none d-md-flex flex-column align-items-end" style="position: sticky; top: 20px; height: fit-content;">
<div class="card p-3">
<h5 class="font-bold mb-3">Navigasi Soal</h5>
<!-- Navigasi Pilihan Ganda -->
<div class="mb-3">
<h6 class="font-bold text-secondary">Pilihan Ganda</h6>
<div class="d-flex flex-wrap gap-2">
@php $multipleChoiceNumber = 0; @endphp
@foreach ($questions as $question)
@if ($question->options->isNotEmpty())
@php
$multipleChoiceNumber++;
$savedAnswer = $question->answers->where('assessment_id', $assessment->id)->first();
$btnClass = $savedAnswer && $savedAnswer->option_id ? 'btn-primary border-white' : 'btn-outline-secondary';
@endphp
<button
id="nav-mc-{{ $multipleChoiceNumber }}"
class="btn {{ $btnClass }} d-flex justify-content-center align-items-center"
style="width: 35px; height: 35px;"
onclick="navigateToQuestion('mc', {{ $multipleChoiceNumber }})"
data-question-id="{{ $question->id }}">
{{ $multipleChoiceNumber }}
</button>
@endif
@endforeach
</div>
</div>
<hr>
<!-- Navigasi Isian -->
<div class="mb-3">
<h6 class="font-bold text-secondary">Isian</h6>
<div class="d-flex flex-wrap gap-2">
@php $essayNumber = 0; @endphp
@foreach ($questions as $question)
@if ($question->options->isEmpty())
@php
$essayNumber++;
$savedAnswer = $question->answers->where('assessment_id', $assessment->id)->first();
$btnClass = $savedAnswer && $savedAnswer->answer_text ? 'btn-primary border-white' : 'btn-outline-secondary';
@endphp
<button
id="nav-essay-{{ $essayNumber }}"
class="btn {{ $btnClass }} d-flex justify-content-center align-items-center"
style="width: 35px; height: 35px;"
onclick="navigateToQuestion('essay', {{ $essayNumber }})"
data-question-id="{{ $question->id }}">
{{ $essayNumber }}
</button>
@endif
@endforeach
</div>
</div>
<div class="text-center">
<button type="button" class="btn btn-primary w-100 py-2 fw-semibold" onclick="checkUnansweredQuestions()">
Selesai
</button>
</div>
</div>
</aside>
<!-- NAVIGASI NOMOR SOAL MOBILE -->
<aside id="rightSidebar" class="d-md-none">
<div class="card p-3"> <div class="card p-3">
<h5 class="font-bold mb-3">Navigasi Soal</h5> <h5 class="font-bold mb-3">Navigasi Soal</h5>
@ -504,6 +635,21 @@ class="btn {{ $btnClass }} d-flex justify-content-center align-items-center"
</div> </div>
</div> </div>
{{-- Sidebar Kiri --}}
<script>
document.getElementById('toggleSidebar').addEventListener('click', function () {
var sidebar = document.getElementById('sidebarMenu');
sidebar.classList.toggle('active');
});
</script>
{{-- Sidebar Kanan --}}
<script>
document.getElementById('toggleRightSidebar').addEventListener('click', function () {
var rightSidebar = document.getElementById('rightSidebar');
rightSidebar.classList.toggle('active');
});
</script>
<script> <script>
function checkUnansweredQuestions() { function checkUnansweredQuestions() {
let unansweredCount = 0; let unansweredCount = 0;

75
Penilaian Literasi/iClOP-V2/resources/views/literacy/student/assessments/index.blade.php
View File

@ -18,6 +18,32 @@
padding: 20px; padding: 20px;
} }
@media (max-width: 768px) {
#sidebarMenu {
position: fixed;
top: 0;
left: 0;
width: 245px;
height: 100vh;
background-color: #fff;
z-index: 1040;
transform: translateX(-100%);
transition: transform 0.3s ease-in-out;
display: block !important;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 60px;
}
#sidebarMenu.active {
transform: translateX(0);
}
#toggleSidebar {
position: relative;
z-index: 1051;
}
}
/* NAV LINK */ /* NAV LINK */
.nav-link { .nav-link {
@ -187,39 +213,45 @@
<body> <body>
<!-- NAVBAR --> <!-- NAVBAR -->
<nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;"> <nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;">
<div class="container-fluid"> <div class="container-fluid d-flex justify-content-between align-items-center px-3 px-md-4 position-relative">
<!-- <a class="navbar-brand" href="#">Navbar</a> --> <!-- Toggle Sidebar Kiri (mobile only) -->
<img src={{asset("./images/logo.png")}} alt="logo" width="104" height="65"> <button id="toggleSidebar" class="btn btn-primary d-md-none">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" <i class="fas fa-bars"></i>
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- Dashboard Student - Tampil di tengah pada mobile -->
<div class="d-md-none position-absolute start-50 translate-middle-x text-center">
<a href="/dashboard-student" class="nav-link active text-dark fw-bold d-flex flex-column">
<span>Dashboard</span>
<span>Student</span>
</a>
</div>
<!-- Logo (di kanan pada mobile, tengah di desktop) -->
<img src="{{ asset('./images/logo.png') }}" alt="logo" width="104" height="65" class="order-md-1 order-2 ms-auto" id="logoResponsive">
<!-- Menu Desktop -->
<div class="collapse navbar-collapse order-md-2 order-3 d-none d-md-flex" id="navbarSupportedContent">
<div class="mx-auto"> <div class="mx-auto">
<ul class="navbar-nav mb-2 mb-lg-0 justify-content-center"> <ul class="navbar-nav mb-2 mb-lg-0 justify-content-center">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard <a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard Student</a>
Student</a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="dropdown"> <div class="dropdown">
<p style="margin-top: 10px; margin-right: 10px;">{{auth()->user()->name}} <p style="margin-top: 10px; margin-right: 10px;">
<img src="{{ asset('./images/Group.png') }}" alt="Group" {{ auth()->user()->name }}
style="height: 50px; margin-right: 10px;"> <img src="{{ asset('./images/Group.png') }}" alt="Group" style="height: 50px; margin-right: 10px;">
<i class="fas fa-chevron-down" style="color: #0079FF;"></i> <i class="fas fa-chevron-down" style="color: #0079FF;"></i>
<div class="dropdown-content" id="dropdownContent"> <div class="dropdown-content" id="dropdownContent">
<form id="logout-form" action="{{ route('logout') }}" method="POST"> <form id="logout-form" action="{{ route('logout') }}" method="POST">
@csrf @csrf
<a href="#" <a href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
</form> </form>
</div> </div>
</p> </p>
</div> </div>
<!-- <button class="btn btn-primary custom-button-sign-up" onclick="window.location.href='register.html'">Sign Up</button> -->
</div> </div>
</div> </div>
</nav> </nav>
@ -228,7 +260,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<!-- SIDEBAR --> <!-- SIDEBAR -->
<nav class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow"> <nav id="sidebarMenu" class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow">
<div class="sidebar-sticky" style="margin-top: 20px;"> <div class="sidebar-sticky" style="margin-top: 20px;">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li class="nav-item" style="margin-bottom: 40px;"> <li class="nav-item" style="margin-bottom: 40px;">
@ -382,6 +414,13 @@ class="btn btn-sm btn-warning text-white" target="_blank">
</div> </div>
</div> </div>
<script>
document.getElementById('toggleSidebar').addEventListener('click', function () {
var sidebar = document.getElementById('sidebarMenu');
sidebar.classList.toggle('active');
});
</script>
<script> <script>
function openAssessmentResult(url) { function openAssessmentResult(url) {
window.open(url, '_blank', 'noopener,noreferrer'); window.open(url, '_blank', 'noopener,noreferrer');

76
Penilaian Literasi/iClOP-V2/resources/views/literacy/student/assessments/result.blade.php
View File

@ -18,6 +18,33 @@
padding: 20px; padding: 20px;
} }
@media (max-width: 768px) {
#sidebarMenu {
position: fixed;
top: 0;
left: 0;
width: 245px;
height: 100vh;
background-color: #fff;
z-index: 1040;
transform: translateX(-100%);
transition: transform 0.3s ease-in-out;
display: block !important;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 60px;
}
#sidebarMenu.active {
transform: translateX(0);
}
#toggleSidebar {
position: relative;
z-index: 1051;
}
}
/* NAV LINK */ /* NAV LINK */
.nav-link { .nav-link {
@ -187,39 +214,45 @@
<body style="padding-bottom: 45px"> <body style="padding-bottom: 45px">
<!-- NAVBAR --> <!-- NAVBAR -->
<nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;"> <nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;">
<div class="container-fluid"> <div class="container-fluid d-flex justify-content-between align-items-center px-3 px-md-4 position-relative">
<!-- <a class="navbar-brand" href="#">Navbar</a> --> <!-- Toggle Sidebar Kiri (mobile only) -->
<img src={{asset("./images/logo.png")}} alt="logo" width="104" height="65"> <button id="toggleSidebar" class="btn btn-primary d-md-none">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" <i class="fas fa-bars"></i>
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- Dashboard Student - Tampil di tengah pada mobile -->
<div class="d-md-none position-absolute start-50 translate-middle-x text-center">
<a href="/dashboard-student" class="nav-link active text-dark fw-bold d-flex flex-column">
<span>Dashboard</span>
<span>Student</span>
</a>
</div>
<!-- Logo (di kanan pada mobile, tengah di desktop) -->
<img src="{{ asset('./images/logo.png') }}" alt="logo" width="104" height="65" class="order-md-1 order-2 ms-auto" id="logoResponsive">
<!-- Menu Desktop -->
<div class="collapse navbar-collapse order-md-2 order-3 d-none d-md-flex" id="navbarSupportedContent">
<div class="mx-auto"> <div class="mx-auto">
<ul class="navbar-nav mb-2 mb-lg-0 justify-content-center"> <ul class="navbar-nav mb-2 mb-lg-0 justify-content-center">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard <a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard Student</a>
Student</a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="dropdown"> <div class="dropdown">
<p style="margin-top: 10px; margin-right: 10px;">{{auth()->user()->name}} <p style="margin-top: 10px; margin-right: 10px;">
<img src="{{ asset('./images/Group.png') }}" alt="Group" {{ auth()->user()->name }}
style="height: 50px; margin-right: 10px;"> <img src="{{ asset('./images/Group.png') }}" alt="Group" style="height: 50px; margin-right: 10px;">
<i class="fas fa-chevron-down" style="color: #0079FF;"></i> <i class="fas fa-chevron-down" style="color: #0079FF;"></i>
<div class="dropdown-content" id="dropdownContent"> <div class="dropdown-content" id="dropdownContent">
<form id="logout-form" action="{{ route('logout') }}" method="POST"> <form id="logout-form" action="{{ route('logout') }}" method="POST">
@csrf @csrf
<a href="#" <a href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
</form> </form>
</div> </div>
</p> </p>
</div> </div>
<!-- <button class="btn btn-primary custom-button-sign-up" onclick="window.location.href='register.html'">Sign Up</button> -->
</div> </div>
</div> </div>
</nav> </nav>
@ -228,7 +261,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<!-- SIDEBAR --> <!-- SIDEBAR -->
<nav class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow"> <nav id="sidebarMenu" class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow">
<div class="sidebar-sticky" style="margin-top: 20px;"> <div class="sidebar-sticky" style="margin-top: 20px;">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li class="nav-item" style="margin-bottom: 40px;"> <li class="nav-item" style="margin-bottom: 40px;">
@ -504,6 +537,13 @@
</div> </div>
</div> </div>
</div> </div>
<script>
document.getElementById('toggleSidebar').addEventListener('click', function () {
var sidebar = document.getElementById('sidebarMenu');
sidebar.classList.toggle('active');
});
</script>
<!-- JavaScript untuk mengubah konten tab --> <!-- JavaScript untuk mengubah konten tab -->
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script> <script>

74
Penilaian Literasi/iClOP-V2/resources/views/literacy/student/materials/index.blade.php
View File

@ -18,6 +18,32 @@
padding: 20px; padding: 20px;
} }
@media (max-width: 768px) {
#sidebarMenu {
position: fixed;
top: 0;
left: 0;
width: 245px;
height: 100vh;
background-color: #fff;
z-index: 1040;
transform: translateX(-100%);
transition: transform 0.3s ease-in-out;
display: block !important;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 60px;
}
#sidebarMenu.active {
transform: translateX(0);
}
#toggleSidebar {
position: relative;
z-index: 1051;
}
}
/* NAV LINK */ /* NAV LINK */
.nav-link { .nav-link {
@ -187,39 +213,45 @@
<body> <body>
<!-- NAVBAR --> <!-- NAVBAR -->
<nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;"> <nav class="navbar navbar-expand-lg" style="background-color: #FEFEFE;">
<div class="container-fluid"> <div class="container-fluid d-flex justify-content-between align-items-center px-3 px-md-4 position-relative">
<!-- <a class="navbar-brand" href="#">Navbar</a> --> <!-- Toggle Sidebar Kiri (mobile only) -->
<img src={{asset("./images/logo.png")}} alt="logo" width="104" height="65"> <button id="toggleSidebar" class="btn btn-primary d-md-none">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" <i class="fas fa-bars"></i>
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- Dashboard Student - Tampil di tengah pada mobile -->
<div class="d-md-none position-absolute start-50 translate-middle-x text-center">
<a href="/dashboard-student" class="nav-link active text-dark fw-bold d-flex flex-column">
<span>Dashboard</span>
<span>Student</span>
</a>
</div>
<!-- Logo (di kanan pada mobile, tengah di desktop) -->
<img src="{{ asset('./images/logo.png') }}" alt="logo" width="104" height="65" class="order-md-1 order-2 ms-auto" id="logoResponsive">
<!-- Menu Desktop -->
<div class="collapse navbar-collapse order-md-2 order-3 d-none d-md-flex" id="navbarSupportedContent">
<div class="mx-auto"> <div class="mx-auto">
<ul class="navbar-nav mb-2 mb-lg-0 justify-content-center"> <ul class="navbar-nav mb-2 mb-lg-0 justify-content-center">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard <a class="nav-link active" aria-current="page" href="/dashboard-student">Dashboard Student</a>
Student</a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="dropdown"> <div class="dropdown">
<p style="margin-top: 10px; margin-right: 10px;">{{auth()->user()->name}} <p style="margin-top: 10px; margin-right: 10px;">
<img src="{{ asset('./images/Group.png') }}" alt="Group" {{ auth()->user()->name }}
style="height: 50px; margin-right: 10px;"> <img src="{{ asset('./images/Group.png') }}" alt="Group" style="height: 50px; margin-right: 10px;">
<i class="fas fa-chevron-down" style="color: #0079FF;"></i> <i class="fas fa-chevron-down" style="color: #0079FF;"></i>
<div class="dropdown-content" id="dropdownContent"> <div class="dropdown-content" id="dropdownContent">
<form id="logout-form" action="{{ route('logout') }}" method="POST"> <form id="logout-form" action="{{ route('logout') }}" method="POST">
@csrf @csrf
<a href="#" <a href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Logout</a>
</form> </form>
</div> </div>
</p> </p>
</div> </div>
<!-- <button class="btn btn-primary custom-button-sign-up" onclick="window.location.href='register.html'">Sign Up</button> -->
</div> </div>
</div> </div>
</nav> </nav>
@ -228,7 +260,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<!-- SIDEBAR --> <!-- SIDEBAR -->
<nav class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow"> <nav id="sidebarMenu" class="col-md-2 d-none d-md-block sidebar sidebar-right-shadow">
<div class="sidebar-sticky" style="margin-top: 20px;"> <div class="sidebar-sticky" style="margin-top: 20px;">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li class="nav-item" style="margin-bottom: 40px;"> <li class="nav-item" style="margin-bottom: 40px;">
@ -363,6 +395,12 @@ class="btn btn-sm btn-primary" target="_blank">
</div> </div>
</div> </div>
</div> </div>
<script>
document.getElementById('toggleSidebar').addEventListener('click', function () {
var sidebar = document.getElementById('sidebarMenu');
sidebar.classList.toggle('active');
});
</script>
<!-- JavaScript untuk mengubah konten tab --> <!-- JavaScript untuk mengubah konten tab -->
<script> <script>
function materialModal(id, title, controller) { function materialModal(id, title, controller) {