.sidebar { font-size: 12px; line-height: 10px; position: fixed; top: 20%; left: 10px; width: 250px; max-height: calc(100vh - 40px); overflow-y: auto; z-index: 1000; padding: 10px; border-radius: 4px; } .content { margin-left: 290px; padding: 5px; width: 100%; } .nav-link { color: black; } .sidebar .nav-item { position: relative; padding-left: 3px; margin-bottom: 5px; line-height: 1; } .indicator { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background-color: #ccc; transition: background-color 0.3s ease; } .nav-item.active .indicator { background-color: #007bff; } @media (max-width: 1100px) { .sidebar { display: none; } }