Job Management Dashboard - Copy this Html, Bootstrap Component to your project

update cho tôi cái này sao cho jobskill và skilllevel người khác nhìn vào hiểu hơn 1 tí: <div class="tab-pane fade container-fluid py-4" id="jobs"> <div class="row mb-4"> <div class="col-12"> <div class="d-flex justify-content-between align-items-center"> <h2 class="mb-0">Job Listings</h2> <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addJobModal"> <i class="bi bi-plus-lg me-2"></i>Add New Job </button> </div> </div> </div> <div class="row mb-4"> <div class="col-12 col-md-8"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search jobs..." aria-label="Search jobs"> <button class="btn btn-outline-secondary" type="button"><i class="bi bi-search"></i></button> </div> </div> <div class="col-12 col-md-4"> <select class="form-select" aria-label="Filter by status"> <option selected>Filter by Status</option> <option value="hiring">Hiring</option> <option value="closed">Closed</option> </select> </div> </div> <div class="row"> <div class="col-12"> <div class="table-responsive"> <table class="table table-hover"> <thead class="table-light"> <tr> <th scope="col">Job Title</th> <th scope="col">Salary</th> <th scope="col">Skills</th> <th scope="col">Skill Level</th> <th scope="col">Status</th> <th scope="col">Actions</th> </tr> </thead> <tbody> <tr> <td><a href="#" class="text-decoration-none">Senior Frontend Developer</a></td> <td>$90,000 - $120,000</td> <td> <span class="badge bg-primary me-1">React</span> <span class="badge bg-primary me-1">TypeScript</span> </td> <td> <span class="badge bg-info">Advanced (2)</span> </td> <td><span class="badge bg-success">Hiring</span></td> <td> <button class="btn btn-sm btn-outline-primary me-1"><i class="bi bi-pencil"></i></button> <button class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button> </td> </tr> <tr> <td><a href="#" class="text-decoration-none">UX Designer</a></td> <td>$70,000 - $90,000</td> <td> <span class="badge bg-primary me-1">Figma</span> <span class="badge bg-primary me-1">Adobe XD</span> </td> <td> <span class="badge bg-warning">Intermediate (1)</span> </td> <td><span class="badge bg-danger">Closed</span></td> <td> <button class="btn btn-sm btn-outline-primary me-1"><i class="bi bi-pencil"></i></button> <button class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button> </td> </tr> </tbody> </table> </div> </div> </div> </div>