shell bypass 403
<!DOCTYPE html>
<html>
<head>
<title> Dashboard </title>
<meta charset="UTF-8">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/sites/little-groovin-guitar/images/favicon.png" type="image/x-icon">
<%- include('includes/css-links') %>
</head>
<body>
<style>
.form-controls {
display: flex;
align-items: center;
max-width: 600px;
min-height: 100%;
margin: 0 auto;
padding: var(--spacing-lg);
}
.form-controls form {
display: flex;
flex-direction: row;
justify-content: center;
width: 100%;
gap: 124px;
}
@media screen and (max-width: 600px) {
.form-controls form {
flex-direction: column;
}
}
fieldset {
border: none;
padding: 0;
margin: 0;
}
fieldset legend {
padding: 0;
margin-bottom: var(--spacing-md);
font-weight: bolder;
padding-bottom: 12px;
border-bottom: 1px solid #282828;
}
/* Shared Input Styles */
.radio .radio-input,
.checkbox .checkbox-input {
position: absolute;
opacity: 0;
width: 0;
height: 0;
}
.radio .radio-control,
.checkbox .checkbox-control {
position: relative;
width: var(--control-size);
height: var(--control-size);
min-width: 30px;
min-height: 30px;
border: 1px solid #000;
transition: all var(--transition-duration) var(--transition-timing);
}
/* Checkbox Styles */
.checkbox-group {
display: flex;
flex-direction: column;
gap: var(--spacing-md);
}
.checkbox {
position: relative;
display: flex;
align-items: center;
gap: var(--spacing-sm);
cursor: pointer;
display: flex;
flex-direction: column;
}
.checkbox .checkbox-control {
border-radius: 29px;
background: #000;
color: #fff;
}
.checkbox .checkbox-control::before,
.checkbox .checkbox-control::after {
content: "";
position: absolute;
transition: transform var(--transition-duration) var(--transition-timing), opacity var(--transition-duration) var(--transition-timing);
will-change: transform, opacity;
}
.checkbox .checkbox-control::before {
top: 50%;
left: 50%;
width: var(--ripple-size);
height: var(--ripple-size);
background-color: var(--ripple-color);
border-radius: 50%;
opacity: 0;
transform: translate(-50%, -50%) scale(0);
}
.checkbox .checkbox-control::after {
left: 50%;
top: 45%;
width: var(--checkmark-width);
height: var(--checkmark-height);
border: solid white;
border-width: 0 2px 2px 0;
transform: translate(-50%, -50%) rotate(45deg) scale(0);
opacity: 0;
}
.checkbox .checkbox-input:checked~.checkbox-control {
background-color: #6FD943;
border-color: #fff;
width: 30px;
height: 30px;
}
.checkbox .checkbox-input:checked~.checkbox-control::before {
animation: ripple 240ms linear;
}
.checkbox .checkbox-input:checked~.checkbox-control::after {
transform: translate(-50%, -50%) rotate(45deg) scale(1);
opacity: 1;
}
.checkbox .checkbox-input:focus-visible~.checkbox-control {
box-shadow: 0 0 0 var(--focus-ring-size) rgba(100, 108, 255, 0.3);
}
.checkbox .checkbox-label {
font-size: 1rem;
user-select: none;
color: #000;
transition: color var(--transition-duration) var(--transition-timing);
}
.checkbox .checkbox-input:checked~.checkbox-label {
color: #000;
animation: label-check 0.3s var(--transition-timing);
}
/* Radio Styles */
.radio-group {
display: flex;
flex-direction: column;
gap: var(--spacing-md);
}
.radio {
position: relative;
display: flex;
align-items: center;
gap: var(--spacing-sm);
cursor: pointer;
}
.radio .radio-control {
border-radius: 50%;
}
.radio .radio-control::before,
.radio .radio-control::after {
content: "";
position: absolute;
transition: transform var(--transition-duration) var(--transition-timing), opacity var(--transition-duration) var(--transition-timing);
will-change: transform, opacity;
}
.radio .radio-control::before {
top: 50%;
left: 50%;
width: var(--ripple-size);
height: var(--ripple-size);
background-color: var(--ripple-color);
border-radius: 50%;
opacity: 0;
transform: translate(-50%, -50%) scale(0);
}
.radio .radio-control::after {
top: 50%;
left: 50%;
width: var(--radio-dot-size);
height: var(--radio-dot-size);
border-radius: 50%;
background-color: white;
transform: translate(-50%, -50%) scale(0);
opacity: 0;
}
.radio .radio-input:checked~.radio-control {
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.radio .radio-input:checked~.radio-control::before {
animation: ripple 240ms linear;
}
.radio .radio-input:checked~.radio-control::after {
transform: translate(-50%, -50%) scale(1);
opacity: 1;
}
.radio .radio-input:focus-visible~.radio-control {
box-shadow: 0 0 0 var(--focus-ring-size) rgba(100, 108, 255, 0.3);
}
.radio .radio-label {
font-size: 1rem;
user-select: none;
color: var(--text-color-rest);
transition: color var(--transition-duration) var(--transition-timing);
}
.radio .radio-input:checked~.radio-label {
color: var(--text-color-active);
animation: label-check 0.3s var(--transition-timing);
}
/* Animations */
@keyframes ripple {
0% {
transform: translate(-50%, -50%) scale(0.35);
opacity: 0.8;
}
100% {
transform: translate(-50%, -50%) scale(2);
opacity: 0;
}
}
@keyframes label-check {
0% {
transform: translateX(0);
opacity: 0.7;
}
40% {
transform: translateX(2px);
opacity: 1;
}
100% {
transform: translateX(0);
opacity: 1;
}
}
table {
width: 100%;
border-collapse: collapse;
}
th,
td {
border-bottom : 1px solid #ddd;
padding: 8px;
text-align: left;
}
th {
background-color: #f4f4f4;
}
img {
width: 50px;
height: auto;
}
input[type="checkbox"] {
transform: scale(1.2);
}
</style>
<main>
<div class="dashboard-wrapper">
<%- include('includes/sidebar') %>
<div class="dashboard-content">
<div class="main-header-dashboard">
<h2>dashboard</h2>
</div>
<div class="row align-items-center">
<div class="col-12 col-md-6">
<div class="main-header-h2">
<h2>practice log Schedule</h2>
</div>
<div class="mian-practice-0">
<div class="partice-1">
<div class="main-looper">
<img src="images/icon-78.png" class="img-fluid" alt="img">
</div>
<div class="main-host">
<ul>
<li>01 dec 2024</li>
<li>8:00 AM - 10:00AM</li>
</ul>
<h2>practice log c cord</h2>
</div>
</div>
<div class="rooper-main">
<ul>
<li>
<h4>Assignment</h4>
</li>
<li>
<form>
<!-- Checkboxes -->
<div class="form-group">
<fieldset>
<div class="checkbox-group">
<label class="checkbox">
<input class="checkbox-input" type="checkbox" name="notifications">
<span class="checkbox-control"></span>
<span class="checkbox-label" style="display: block;">incomplete</span>
</label>
</div>
</fieldset>
</div>
<!-- Radio buttons -->
</form>
</li>
</ul>
</div>
</div>
<div class="mian-practice-0">
<div class="partice-1">
<div class="main-looper">
<img src="images/icon-78.png" class="img-fluid" alt="img">
</div>
<div class="main-host">
<ul>
<li>01 dec 2024</li>
<li>8:00 AM - 10:00AM</li>
</ul>
<h2>practice log basic training</h2>
</div>
</div>
<div class="rooper-main">
<ul>
<li>
<h4>Assignment</h4>
</li>
<li>
<form>
<!-- Checkboxes -->
<div class="form-group">
<fieldset>
<div class="checkbox-group">
<label class="checkbox">
<input class="checkbox-input" type="checkbox" name="notifications">
<span class="checkbox-control"></span>
<span class="checkbox-label" style="display: block;">incomplete</span>
</label>
</div>
</fieldset>
</div>
<!-- Radio buttons -->
</form>
</li>
</ul>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="main-troter">
<table>
<thead>
<tr>
<th>
<div class="main-box">
<span>
<input type="checkbox" id="select-all">
</span>
</div>
</th>
<th>Name</th>
<th>Student ID</th>
<th>Contact</th>
</tr>
</thead>
<tbody>
<tr>
<td class="check-box-main">
<input type="checkbox" class="row-checkbox">
</td>
<td>
<div class="main-picture-profile">
<ul>
<li>
<img src="images/icon-images-1.png" class="img-fluid" alt="Profile Picture">
</li>
<li>
<h4>Olivia Johnson</h4>
<p>beginner</p>
</li>
</ul>
</div>
</td>
<td>
<span class="id-table">63584</span>
</td>
<td>
<span class="roterer">liamanderson@info.com</span>
<p><a href="tel:( 605 ) 9587 564">( 605 ) 9587 564</a></p>
</td>
</tr>
<tr>
<td class="check-box-main">
<input type="checkbox" class="row-checkbox">
</td>
<td>
<div class="main-picture-profile">
<ul>
<li>
<img src="images/icon-image-2.png" class="img-fluid" alt="Profile Picture">
</li>
<li>
<h4>Liam Anderson</h4>
<p>beginner</p>
</li>
</ul>
</div>
</td>
<td>
<span class="id-table">63581</span>
</td>
<td>
<span class="roterer">liamanderson@info.com</span>
<p><a href="tel:( 605 ) 9587 564">( 605 ) 9587 564</a></p>
</td>
</tr>
<tr>
<td class="check-box-main">
<input type="checkbox" class="row-checkbox">
</td>
<td>
<div class="main-picture-profile">
<ul>
<li>
<img src="images/icon-image-3.png" class="img-fluid" alt="Profile Picture">
</li>
<li>
<h4>Sophia Kim</h4>
<p>beginner</p>
</li>
</ul>
</div>
</td>
<td>
<span class="id-table">63588</span>
</td>
<td>
<span class="roterer">oliviajhonson@info.com</span>
<p> <a href="tel:( 605 ) 9587 564">( 605 ) 9587 564</a></p>
</td>
</tr>
<tr>
<td class="check-box-main">
<input type="checkbox" class="row-checkbox">
</td>
<td>
<div class="main-picture-profile">
<ul>
<li>
<img src="images/icon-image-4.png" class="img-fluid" alt="Profile Picture">
</li>
<li>
<h4>Caleb Thompson</h4>
<p>beginner</p>
</li>
</ul>
</div>
</td>
<td>
<span class="id-table">63582</span>
</td>
<td>
<span class="roterer">oliviajhonson@info.com</span>
<p> <a href="tel:( 605 ) 9587 564">( 605 ) 9587 564</a></p>
</td>
</tr>
</tbody>
</table>
<button>View More</button>
</div>
</div>
</div>
<div class="main-clender">
<div class="container">
<div class="row g-5">
<div class="col-12 col-md-6"></div>
<div class="col-12 col-md-6">
<!-- <div class="main-clender-01">
<ul>
<li>
<h3>practice log Schedule</h3>
</li>
<li>
<select name="month-select" id="month-select">
</select>
</li>
</ul>
<div class="calendar">
<header>
<h2>September</h2>
<a class="btn-prev " href="#"><i class="fa-solid fa-chevron-left"></i></a>
<a class="btn-next " href="#"><i class="fa-solid fa-chevron-right"></i></a>
</header>
<table>
<thead>
<tr>
<td>Mo</td>
<td>Tu</td>
<td>We</td>
<td>Th</td>
<td>Fr</td>
<td>Sa</td>
<td>Su</td>
</tr>
</thead>
<tbody>
<tr>
<td class="prev-month">26</td>
<td class="prev-month">27</td>
<td class="prev-month">28</td>
<td class="prev-month">29</td>
<td class="prev-month">30</td>
<td class="prev-month">31</td>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
</tr>
<tr>
<td>9</td>
<td class="event">10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
</tr>
<tr>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td class="event">21</td>
<td>22</td>
</tr>
<tr>
<td class="current-day event">23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
</tr>
<tr>
<td>30</td>
<td class="next-month">1</td>
<td class="next-month">2</td>
<td class="next-month">3</td>
<td class="next-month">4</td>
<td class="next-month">5</td>
<td class="next-month">6</td>
</tr>
</tbody>
</table>
</div> <!-- end calendar -->
</div> -->
</div>
</div>
</div>
</div>
</div>
</div>
</div> -->
</div>
</div>
</main>
<%- include('includes/footer')%>
<%- include('includes/script-links')%>
</body>
</html>