Candidate Dashboard - Copy this React, Tailwind Component to your project
làm-bằng-html-và-thymleaf:-làm-giúp-tôi-phần-nội-dung-candidate-của-sidebar-trong-dashboard-của-company-dùng-để-hiển-thị-danh-sách-các-candidate-đã-apply-cho-1-job-nào-đó-của-công-ty.-Bạn-hãy-thiết-kế-bằng-html-và-thymeleaf-sau-cho-tôi-có-thể-phát-triển-các-chức-năng-cơ-bản-và-chức-năng:-Giúp-các-công-ty-tìm-các-ứng-viên-có-skill-phù-hợp-rồi-gửi-mail-mời,-bạn-có-thể-tạo-thêm-sao-cho-phù-hợp-nhất.-đây-là-code-của-sidebar-đây:-<nav-id="sidebar"-class="col-md-3-col-lg-2-d-md-block-sidebar-collapse">-<div-class="position-sticky-pt-3">-<div-class="sidebar-header">-<img-th:src="${company.logo}"-alt="Logo"-class="logo">-<h3>Job-Portal</h3>-</div>-<ul-class="list-unstyled-components-nav-flex-column"-id="sidebarMenu">-<li-class="nav-item">-<a-class="nav-link-active"-href="#dashboard"-data-bs-toggle="tab"-th:class="${activeTab-==-'dashboard'-||-activeTab-==-null}-?-'nav-link-active'-:-'nav-link'">-<i-class="bi-bi-speedometer2-me-2"></i>Dashboard-</a>-</li>-<li-class="nav-item">-<a-class="nav-link"-href="#jobs"-data-bs-toggle="tab"-th:class="${activeTab-==-'jobs'}-?-'nav-link-active'-:-'nav-link'">-<i-class="bi-bi-briefcase-me-2"></i>Jobs-Management-</a>-</li>-<li-class="nav-item">-<a-class="nav-link"-href="#candidates"-data-bs-toggle="tab"-th:class="${activeTab-==-'candidates'}-?-'nav-link-active'-:-'nav-link'">-<i-class="bi-bi-people-me-2"></i>Candidates-</a>-</li>-<li-class="nav-item">-<a-class="nav-link"-href="#reports"-data-bs-toggle="tab"-th:class="${activeTab-==-'reports'}-?-'nav-link-active'-:-'nav-link'">-<i-class="bi-bi-graph-up-me-2"></i>Reports-</a>-</li>-<li-class="nav-item">-<a-class="nav-link"-href="#settings"-data-bs-toggle="tab"-th:class="${activeTab-==-'settings'}-?-'nav-link-active'-:-'nav-link'">-<i-class="bi-bi-gear-me-2"></i>Settings-</a>-</li>-<li-class="nav-item">-<a-href="#"-class="nav-link"><i-class="bi-bi-box-arrow-right"></i>-Logout</a>-</li>-</ul>-</div>-</nav><main-class="col-md-9-ms-sm-auto-col-lg-10-px-md-4"><div-class="tab-pane-fade"-id="candidates"-th:class="${activeTab-==-'candidates'}-?-'tab-pane-fade-show-active'-:-'tab-pane-fade'">-<div-class="d-flex-justify-content-between-flex-wrap-flex-md-nowrap-align-items-center-pt-3-pb-2-mb-3-border-bottom">-<h2>Candidates-Management</h2>-<div-class="input-group-w-25">-<input-type="text"-class="form-control"-placeholder="Search-candidates..."-aria-label="Search-candidates">-<button-class="btn-btn-outline-secondary"-type="button">-<i-class="bi-bi-search"></i>-</button>-</div>-</div>
