Mudanças entre as edições de "MediaWiki:Common.css"
| Linha 4: | Linha 4: | ||
* { font-size: 16px } | * { font-size: 16px } | ||
| + | |||
| + | * { | ||
| + | :root{ | ||
| + | --main-color:#fff; | ||
| + | } | ||
| + | |||
| + | *{ | ||
| + | padding: 0; | ||
| + | margin: 0; | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | |||
| + | body{ | ||
| + | font-family:'Roboto' , 'sans-serif'; | ||
| + | overflow:hidden; | ||
| + | } | ||
| + | |||
| + | .main-header{ | ||
| + | background: #4FB391; | ||
| + | width: 100%; | ||
| + | height:50px; | ||
| + | } | ||
| + | |||
| + | nav{ | ||
| + | position: absolute; | ||
| + | left:0; | ||
| + | top:0; | ||
| + | width: 200px; | ||
| + | top:50px; | ||
| + | height:calc(100vh - 50px); | ||
| + | background:#2D6653; | ||
| + | transform:translateX(-100%); | ||
| + | transition:.4s ease; | ||
| + | } | ||
| + | |||
| + | .navigation li{ | ||
| + | list-style:none; | ||
| + | width: 100%; | ||
| + | border-bottom: 1px solid rgba(255,255,255,.5); | ||
| + | } | ||
| + | |||
| + | .navigation a{ | ||
| + | color:var(--main-color); | ||
| + | display: block; | ||
| + | line-height:3.5; | ||
| + | padding: 0 10px; | ||
| + | text-decoration:none; | ||
| + | transition:.4s ease; | ||
| + | } | ||
| + | |||
| + | .navigation a:hover{ | ||
| + | transform:translateX(10%); | ||
| + | } | ||
| + | |||
| + | #btn-nav{ | ||
| + | display: none; | ||
| + | } | ||
| + | |||
| + | #btn-nav:checked ~ nav{ | ||
| + | transform:translateX(0); | ||
| + | } | ||
| + | |||
| + | .btn-nav{ | ||
| + | color:var(--main-color); | ||
| + | font-size:30px; | ||
| + | position: absolute; | ||
| + | left:0; | ||
| + | top:0; | ||
| + | cursor:pointer; | ||
| + | padding:6.5px 15px; | ||
| + | transition:.2s ease; | ||
| + | background:rgba(0,0,0,.1); | ||
| + | } | ||
| + | |||
| + | .btn-nav:hover{ | ||
| + | background:rgba(0,0,0,.3); | ||
| + | } | ||
| + | |||
| + | } | ||
Edição das 18h18min de 18 de setembro de 2024
/** o código CSS colocado aqui será aplicado a todos os temas */
* { font-family: arial}
* { font-size: 16px }
* {
:root{
--main-color:#fff;
}
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
font-family:'Roboto' , 'sans-serif';
overflow:hidden;
}
.main-header{
background: #4FB391;
width: 100%;
height:50px;
}
nav{
position: absolute;
left:0;
top:0;
width: 200px;
top:50px;
height:calc(100vh - 50px);
background:#2D6653;
transform:translateX(-100%);
transition:.4s ease;
}
.navigation li{
list-style:none;
width: 100%;
border-bottom: 1px solid rgba(255,255,255,.5);
}
.navigation a{
color:var(--main-color);
display: block;
line-height:3.5;
padding: 0 10px;
text-decoration:none;
transition:.4s ease;
}
.navigation a:hover{
transform:translateX(10%);
}
#btn-nav{
display: none;
}
#btn-nav:checked ~ nav{
transform:translateX(0);
}
.btn-nav{
color:var(--main-color);
font-size:30px;
position: absolute;
left:0;
top:0;
cursor:pointer;
padding:6.5px 15px;
transition:.2s ease;
background:rgba(0,0,0,.1);
}
.btn-nav:hover{
background:rgba(0,0,0,.3);
}
}