import React from 'react'
// import { Container, Row, Col } from 'react-bootstrap'
import Logo from '../Images/logo.png';

export function SideBar () {
    return(
        <div className="wrapper">
            <nav id="sidebar">
                <div className="sidebar-header">
                    <div className="width_img">
                        <img src={Logo} alt=""/>
                    </div>
                </div>
                <ul className="list-unstyled components">
                    <li className="cabecera_li">MENÚ</li>
                    <li id="home" className="active">
                        <a href="index.php"><i className="fas fa-home"></i>Inicio</a>
                    </li>
                    <li id="plazas">
                        <a href="/"><i className="far fa-list-alt"></i>Puestos</a>
                    </li>
                    <li id="notificaciones">
                        <a href="/"><i className="fas fa-shield-alt"></i>Contraseñas</a>
                    </li>
                    <li id="expedientes">
                        <a href="/"><i className="far fa-user"></i>Expedientes</a>
                    </li>
                    <li id="resultados">
                        <a href="/"><i className="fas fa-chart-line"></i>Resultados</a>
                    </li>
                    <li id="pruebas">
                        <a href="#pageSubmenu2" data-toggle="collapse" aria-expanded="false" className="dropdown-toggle"><i className="fas fa-paperclip"></i>Pruebas</a>
                        <ul className="collapse list-unstyled" id="pageSubmenu2">
                            <li id="crearprueba">
                                <a href="nueva-prueba.php">Crear prueba</a>
                            </li>
                            <li id="listado">
                                <a href="pruebas.php">Listado de pruebas</a>
                            </li>
                            <li id="aplicar">
                                <a href="asignar.php">Aplicar</a>
                            </li>
                            <li id="respuestas">
                                <a href="/">Respuestas</a>
                            </li>
                            <li id="calificaciones">
                                <a href="/">Calificaciones</a>
                            </li>
                        </ul>
                    </li>
                    <li id="configuraciones">
                        <a href="/"><i className="fas fa-cog"></i>Configuraciones</a>
                    </li>
                    <li id="historial">
                        <a href="/"><i className="far fa-clock"></i>Historial</a>
                    </li>
                    <li className="cabecera_li">EXTRAS</li>
                    <li id="elementos">
                        <a href="#pageSubmenu3" data-toggle="collapse" aria-expanded="false" className="dropdown-toggle"><i className="fas fa-star"></i>Elementos</a>
                        <ul className="collapse list-unstyled" id="pageSubmenu3">
                            <li>
                                <a href="lockscreen.php" target="_blank">Pantalla Bloqueada</a>
                            </li>
                            <li>
                                <a href="404.php" target="_blank">Error 404</a>
                            </li>
                            <li>
                                <a href="500.php" target="_blank">Error 500</a>
                            </li>
                            <li>
                                <a href="forgot-password.php" target="_blank">Contraseña Olvidada</a>
                            </li>
                        </ul>
                    </li>
                    <li id="tutoriales">
                        <a href="#pageSubmenu4" data-toggle="collapse" aria-expanded="false" className="dropdown-toggle"><i className="far fa-bookmark"></i>Tutoriales</a>
                        <ul className="collapse list-unstyled" id="pageSubmenu4">
                            <li>
                                <a href="/">Manual de Uso Básico</a>
                            </li>
                            <li>
                                <a href="/">¿Qué evalúa cada test?</a>
                            </li>
                            <li>
                                <a href="/">Ayuda General</a>
                            </li>
                        </ul>
                    </li>
                    <li id="asistencia">
                        <a href="#pageSubmenu5" data-toggle="collapse" aria-expanded="false" className="dropdown-toggle"><i className="fas fa-headphones"></i>Asistencia Técnica</a>
                        <ul className="collapse list-unstyled" id="pageSubmenu5">
                            <li>
                                <a href="/">Soporte En Línea</a>
                            </li>
                            <li>
                                <a href="/">Soporte Por Ticket</a>
                            </li>
                        </ul>
                    </li>
                </ul>

            </nav>

        </div>


    )
}
