Файл .jsx
Код: Выделить всё
//Esse arquivo contém a página dashboard que é acessada ao usuário fazer login
import {useContext} from "react";
import {UserContext} from "../../context/userContext"
import '../dashboard.css'
import 'boxicons/css/boxicons.min.css';
import 'https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css';
import '../menu.js'
export default function Dashboard() {
useContext(UserContext)
return (
APPROVE
[list]
[*]
[url=#]
[i][/i]
ESTUDAR
[/url]
[*]
[url=#]
[i]
RANKING
[/url]
[*]
[url=#]
[/i]
LOJA
[/url]
[*]
[url=#]
[i][/i]
PERFIL
[/url]
[*]
[url=#]
[i][/i]
AJUSTES
[/url]
[/list]
)
}
Код: Выделить всё
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
height: 900vh;
}
h1 {
color: white;
font-family: 'rakkas', sans-serif;
font-size: 35px;
text-align: center;
width: 100%;
}
.icon-img {
font-size: 30px;
margin-left: 10px;
}
nav.menu-lateral {
width: 300px; /* Defina a largura fixa do menu */
height: 100%;
background-color: #02AFED;
padding: 40px 0px 40px 1%;
box-shadow: 3px 0 0 #4169E1;
position: fixed;
top: 0;
left: 0;
overflow: hidden;
transition: .5s;
}
ul {
height: 100%;
list-style-type: none;
}
ul li.item-menu {
transition: .2s;
}
ul li.ativo {
background-color: #4169E1;
}
ul li.item-menu:hover {
background: #4169E1;
}
ul li.item-menu a {
color: white;
text-decoration: none;
font-size: 20px;
padding: 20px 4%;
display: flex;
margin-bottom: 20px;
line-height: 40px;
}
ul li.item-menu a .txt-link {
margin-left: 40px;
opacity: 1;
}
ul li.item-menu a .icon > i {
font-size: 30px;
margin-left: 10px;
}
Я не знаю причину, я действительно только что изменил цвет «ul li.ativo», а потом внезапно перестал больше не работаю
Подробнее здесь: https://stackoverflow.com/questions/786 ... anging-css
Мобильная версия