Mudanças entre as edições de "MediaWiki:Common.css"
| Linha 1: | Linha 1: | ||
| − | /** | + | /** Estilo CSS para a skin Monobook */ |
| − | |||
| − | |||
body { | body { | ||
| − | color: # | + | font-family: 'Open Sans', sans-serif; |
| + | font-size: 16px; | ||
| + | line-height: 1.6; | ||
| + | background-color: #f4f4f4; /* Fundo claro */ | ||
| + | color: #333; /* Cor padrão do texto */ | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
} | } | ||
| + | /* Personalização de links com animação */ | ||
| + | a { | ||
| + | color: #006400; /* Verde IF */ | ||
| + | text-decoration: none; | ||
| + | transition: color 0.3s ease, transform 0.3s ease; /* Transição suave */ | ||
| + | } | ||
| − | + | a:hover { | |
| − | + | color: #85c593; /* Cor ao passar o mouse */ | |
| − | + | transform: scale(1.05); /* Leve zoom no hover */ | |
} | } | ||
| − | /* | + | /* Estilo da logo */ |
#p-logo a { | #p-logo a { | ||
background-image: url('https://nti.muz.ifsuldeminas.edu.br/images/c/c7/LogoWikiNTI250x250px.png'); | background-image: url('https://nti.muz.ifsuldeminas.edu.br/images/c/c7/LogoWikiNTI250x250px.png'); | ||
| Linha 18: | Linha 28: | ||
width: 135px; | width: 135px; | ||
height: 135px; | height: 135px; | ||
| − | |||
} | } | ||
| − | + | /* Ajuste do conteúdo principal */ | |
| − | + | #content { | |
| − | /* | + | margin-left: 220px; |
| − | + | padding: 20px; | |
| − | + | background-color: #fff; | |
| − | + | border-radius: 10px; | |
| − | + | box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Sombra leve */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | border- | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| − | + | /* Responsividade */ | |
| − | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
| − | + | #content { | |
| − | #content | + | margin-left: 0; |
| − | + | padding: 10px; | |
} | } | ||
} | } | ||
| − | + | /* Menu lateral fixo e ajustado */ | |
| − | |||
| − | /* | ||
#mw-panel { | #mw-panel { | ||
| − | + | background-color: #006400; | |
color: white; | color: white; | ||
| − | position: fixed; | + | position: fixed; |
| − | top: 5px; | + | top: 5px; |
left: 0; | left: 0; | ||
| − | width: 190px; | + | width: 190px; |
| − | padding: 10px; | + | padding: 10px; |
| − | box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1); | + | box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1); |
| − | z-index: 1000; | + | z-index: 1000; |
| − | border-radius: 0 10px 10px 0; | + | border-radius: 0 10px 10px 0; |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
#mw-panel a { | #mw-panel a { | ||
color: white; | color: white; | ||
| − | |||
font-weight: bold; | font-weight: bold; | ||
| − | padding: 10px 15px; | + | padding: 10px 15px; |
border-radius: 5px; | border-radius: 5px; | ||
| − | transition: background-color 0.3s ease; | + | transition: background-color 0.3s ease, transform 0.3s ease; |
} | } | ||
#mw-panel a:hover { | #mw-panel a:hover { | ||
| − | background-color: #85c593 | + | background-color: #85c593; |
| − | + | transform: scale(1.05); /* Zoom leve ao passar o mouse */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| − | + | /* Botões com estilo moderno */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
button, .button { | button, .button { | ||
background-color: #006400; | background-color: #006400; | ||
color: white; | color: white; | ||
| + | padding: 10px 20px; | ||
border: none; | border: none; | ||
| − | |||
border-radius: 5px; | border-radius: 5px; | ||
| − | |||
cursor: pointer; | cursor: pointer; | ||
| − | transition: background-color 0.3s ease; | + | transition: background-color 0.3s ease, box-shadow 0.3s ease; |
} | } | ||
button:hover, .button:hover { | button:hover, .button:hover { | ||
| − | background-color: #85c593; /* Sombra | + | background-color: #85c593; /* Cor clara no hover */ |
| + | box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Sombra no hover */ | ||
} | } | ||
| − | + | /* Ajustes de listas */ | |
| − | + | ol, ul { | |
| + | color: #006400; | ||
| + | font-weight: bold; | ||
| + | padding-left: 20px; | ||
} | } | ||
| − | + | /* Estilo de rodapé */ | |
| − | /* | ||
#footer { | #footer { | ||
background-color: #f3f3f3; | background-color: #f3f3f3; | ||
| − | color: | + | color: #333; |
padding: 20px; | padding: 20px; | ||
text-align: center; | text-align: center; | ||
| Linha 369: | Linha 107: | ||
} | } | ||
| − | + | /* Imagens com estilo moderno */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | /* Imagens | ||
img { | img { | ||
max-width: 100%; | max-width: 100%; | ||
| Linha 392: | Linha 115: | ||
} | } | ||
| + | /* Tipografia responsiva */ | ||
| + | @media (max-width: 1024px) { | ||
| + | body { | ||
| + | font-size: 15px; | ||
| + | } | ||
| − | + | h1 { | |
| − | + | font-size: 2em; | |
| − | |||
| − | |||
| − | |||
} | } | ||
| − | + | h2 { | |
| − | font-size: 1. | + | font-size: 1.75em; |
} | } | ||
} | } | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
| − | + | body { | |
| − | font-size: | + | font-size: 14px; |
} | } | ||
| − | + | h1 { | |
| − | + | font-size: 1.75em; | |
} | } | ||
| − | + | h2 { | |
| − | + | font-size: 1.5em; | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| − | # | + | #p-navigation ul { |
| − | + | flex-direction: column; | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
} | } | ||
| − | + | /* Estilo das páginas personalizadas */ | |
| − | + | .page-Política_de_Privacidade, .page-Sobre_NTI, .page-Termo_de_Responsabilidade { | |
| − | /* Estilo | ||
| − | .page-Política_de_Privacidade { | ||
background-color: #f9f9f9; | background-color: #f9f9f9; | ||
padding: 20px; | padding: 20px; | ||
| − | |||
border-radius: 10px; | border-radius: 10px; | ||
color: #333; | color: #333; | ||
line-height: 1.6; | line-height: 1.6; | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
Edição das 16h14min de 24 de outubro de 2024
/** Estilo CSS para a skin Monobook */
body {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.6;
background-color: #f4f4f4; /* Fundo claro */
color: #333; /* Cor padrão do texto */
margin: 0;
padding: 0;
}
/* Personalização de links com animação */
a {
color: #006400; /* Verde IF */
text-decoration: none;
transition: color 0.3s ease, transform 0.3s ease; /* Transição suave */
}
a:hover {
color: #85c593; /* Cor ao passar o mouse */
transform: scale(1.05); /* Leve zoom no hover */
}
/* Estilo da logo */
#p-logo a {
background-image: url('https://nti.muz.ifsuldeminas.edu.br/images/c/c7/LogoWikiNTI250x250px.png');
background-size: contain;
width: 135px;
height: 135px;
}
/* Ajuste do conteúdo principal */
#content {
margin-left: 220px;
padding: 20px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Sombra leve */
}
/* Responsividade */
@media (max-width: 768px) {
#content {
margin-left: 0;
padding: 10px;
}
}
/* Menu lateral fixo e ajustado */
#mw-panel {
background-color: #006400;
color: white;
position: fixed;
top: 5px;
left: 0;
width: 190px;
padding: 10px;
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
z-index: 1000;
border-radius: 0 10px 10px 0;
}
#mw-panel a {
color: white;
font-weight: bold;
padding: 10px 15px;
border-radius: 5px;
transition: background-color 0.3s ease, transform 0.3s ease;
}
#mw-panel a:hover {
background-color: #85c593;
transform: scale(1.05); /* Zoom leve ao passar o mouse */
}
/* Botões com estilo moderno */
button, .button {
background-color: #006400;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
button:hover, .button:hover {
background-color: #85c593; /* Cor clara no hover */
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Sombra no hover */
}
/* Ajustes de listas */
ol, ul {
color: #006400;
font-weight: bold;
padding-left: 20px;
}
/* Estilo de rodapé */
#footer {
background-color: #f3f3f3;
color: #333;
padding: 20px;
text-align: center;
margin-top: 20px;
border-radius: 5px;
}
/* Imagens com estilo moderno */
img {
max-width: 100%;
height: auto;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
/* Tipografia responsiva */
@media (max-width: 1024px) {
body {
font-size: 15px;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.75em;
}
}
@media (max-width: 768px) {
body {
font-size: 14px;
}
h1 {
font-size: 1.75em;
}
h2 {
font-size: 1.5em;
}
#p-navigation ul {
flex-direction: column;
}
}
/* Estilo das páginas personalizadas */
.page-Política_de_Privacidade, .page-Sobre_NTI, .page-Termo_de_Responsabilidade {
background-color: #f9f9f9;
padding: 20px;
border-radius: 10px;
color: #333;
line-height: 1.6;
}