|
|
| Linha 1: |
Linha 1: |
| /** o código CSS colocado aqui será aplicado a todos os temas */
| |
|
| |
|
| /* Alterando a cor da fonte principal */
| |
| body {
| |
| color: #333333; /* Cor de texto padrão estava na cor grafite #0645ad */
| |
| }
| |
|
| |
|
| |
| /* Alterando a cor das bordas para todos os elementos */
| |
| * {
| |
| border-color: #85c593; /* Verde suave */
| |
| }
| |
|
| |
| /* Alterando a 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;
| |
|
| |
| }
| |
|
| |
|
| |
|
| |
| /* Alterando a cor das bordas de caixas de navegação ou painéis */
| |
| #mw-panel, #content {
| |
| border-color: #85c593; /* verde clarinho */
| |
| border-width: 2px;
| |
| border-style: solid;
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
| /* Alterando a cor das bordas de imagens */
| |
| img {
| |
| border-color: #A8E0C2; /* Verde claro */
| |
| border-width: 2px;
| |
| border-style: solid;
| |
| }
| |
|
| |
|
| |
|
| |
| /* Alterando a cor das bordas de botões */
| |
| button, .button {
| |
| border-color: #98b861; /* Verde claro para botões */
| |
| border-width: 2px;
| |
| border-style: solid;
| |
| }
| |
|
| |
|
| |
|
| |
| @media (max-width: 768px) {
| |
| /* Bordas mais finas em dispositivos móveis */
| |
| #content, #mw-panel {
| |
| border-width: 1px;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
| /* Ajuste do menu de navegação lateral compacto */
| |
| #mw-panel {
| |
|
| |
| color: white;
| |
| position: fixed; /* Fixa a barra lateral */
| |
| top: 5px; /* Distância do topo da página para que não ocupe todo o espaço */
| |
| left: 0;
| |
| width: 190px; /* Largura menor e compacta */
| |
| padding: 10px; /* Menos espaçamento em cima e embaixo */
| |
| box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1); /* Sombra sutil */
| |
| z-index: 1000; /* Sobrepor outros elementos */
| |
| border-radius: 0 10px 10px 0; /* Arredondamento nas bordas da barra */
| |
| }
| |
|
| |
| /* Estilo para a lista de links */
| |
| #mw-panel ul {
| |
| list-style: none; /* Remove marcadores das listas */
| |
| padding: 0;
| |
| margin: 0;
| |
| }
| |
|
| |
| #mw-panel li {
| |
| margin-bottom: 10px; /* Menor espaçamento entre os itens */
| |
| }
| |
|
| |
| #mw-panel a {
| |
| color: white;
| |
| text-decoration: none;
| |
| font-weight: bold;
| |
| padding: 10px 15px; /* Menor espaçamento dentro dos links */
| |
| border-radius: 5px;
| |
| transition: background-color 0.3s ease;
| |
| }
| |
|
| |
| #mw-panel a:hover {
| |
| background-color: #85c593; /* Cor de destaque ao passar o mouse no menu */
| |
| }
| |
|
| |
| /* Responsividade para dispositivos móveis */
| |
| @media (max-width: 768px) {
| |
| #mw-panel {
| |
| position: relative; /* Torna o menu estático em telas menores */
| |
| width: 100%; /* Menu ocupa toda a largura da tela */
| |
| top: 0;
| |
| border-radius: 0; /* Remove bordas arredondadas em mobile */
| |
| }
| |
| }
| |
|
| |
| /* Ajuste do conteúdo principal para não ser sobreposto */
| |
| #content {
| |
| margin-left: 0px; /* Ajusta o espaço à esquerda para a barra lateral */
| |
| padding: 20px;
| |
| background-color: #ffffff;
| |
| border-radius: 10px;
| |
| box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Sombra leve no conteúdo */
| |
| }
| |
|
| |
| /* Ajuste para dispositivos móveis */
| |
| @media (max-width: 768px) {
| |
| #content {
| |
| margin-left: 0; /* Remove a margem à esquerda em telas menores */
| |
| padding: 10px;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
| /* Alterar a cor e o estilo dos marcadores das listas não ordenadas */
| |
| ul {
| |
| list-style-type: square; /* Muda o tipo de marcador para quadrados */
| |
| color: #198754; /* Cor ciano para os marcadores */
| |
| }
| |
|
| |
| /* Alterar o estilo dos números das listas ordenadas */
| |
| ol {
| |
| list-style-type: upper-roman; /* Números romanos maiúsculos */
| |
| color: #198754; /* Cor magenta para os números */
| |
| }
| |
|
| |
|
| |
|
| |
| /* Aplica estilos apenas para usuários anônimos (não logados) */
| |
| body.mw-anonuser ul {
| |
| color: ##1c8002; /* Cor verde para listas não ordenadas */
| |
| }
| |
|
| |
| body.mw-anonuser ol {
| |
| color: #ff0000; /* Cor vermelha para listas ordenadas */
| |
| }
| |
|
| |
| body.mw-anonuser li {
| |
| color: #85c593; /* Cor verde claro para itens de lista */
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* Tipografia geral */
| |
| 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;
| |
| }
| |
|
| |
|
| |
| h1, h2, h3, h4, h5, h6 {
| |
| color: #006400; /* Verde do IF para títulos */
| |
| font-weight: bold;
| |
| margin-bottom: 20px;
| |
| }
| |
|
| |
| a {
| |
| color: #006400; /* Cor dos links */
| |
| text-decoration: none;
| |
| transition: color 0.3s ease;
| |
| }
| |
|
| |
| a:hover {
| |
| color: #85c593; /* Cor de destaque ao passar o mouse */
| |
| }
| |
|
| |
|
| |
|
| |
| /* Tipografia geral responsiva */
| |
| body {
| |
| font-size: 16px; /* Tamanho de texto padrão para desktop */
| |
| line-height: 1.6; /* Espaçamento entre as linhas */
| |
| color: #333; /* Cor do texto */
| |
| font-family: 'Open Sans', sans-serif; /* Fonte simples e moderna */
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
|
| |
| /* Títulos com tamanho responsivo */
| |
| h1 {
| |
| font-size: 2.5em; /* Tamanho grande para desktop */
| |
| }
| |
|
| |
| h2 {
| |
| font-size: 2em;
| |
| }
| |
|
| |
| h3 {
| |
| font-size: 1.75em;
| |
| }
| |
|
| |
| h4, h5, h6 {
| |
| font-size: 1.5em;
| |
| }
| |
|
| |
| /* Ajuste de texto para tablets */
| |
| @media (max-width: 1024px) {
| |
| body {
| |
| font-size: 15px; /* Reduz ligeiramente o tamanho do texto */
| |
| }
| |
|
| |
| h1 {
| |
| font-size: 2em; /* Títulos menores para tablets */
| |
| }
| |
|
| |
| h2 {
| |
| font-size: 1.75em;
| |
| }
| |
|
| |
| h3 {
| |
| font-size: 1.5em;
| |
| }
| |
| }
| |
|
| |
| /* Ajuste de texto para dispositivos móveis */
| |
| @media (max-width: 768px) {
| |
| body {
| |
| font-size: 14px; /* Tamanho menor para telas pequenas */
| |
| }
| |
|
| |
| h1 {
| |
| font-size: 1.75em; /* Títulos ainda menores */
| |
| }
| |
|
| |
| h2 {
| |
| font-size: 1.5em;
| |
| }
| |
|
| |
| h3 {
| |
| font-size: 1.25em;
| |
| }
| |
| }
| |
|
| |
| /* Ajustes de parágrafos */
| |
| p {
| |
| margin-bottom: 1em; /* Espaçamento entre parágrafos */
| |
| }
| |
|
| |
| /* Ajustes de links */
| |
| a {
| |
| color: #006400; /* Verde do IF para links */
| |
| text-decoration: none;
| |
| transition: color 0.3s ease;
| |
| }
| |
|
| |
| a:hover {
| |
| color: #85c593; /* Cor de destaque ao passar o mouse */
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* Estilo para listas ordenadas (ol) e não ordenadas (ul) */
| |
| ol, ul {
| |
| color: #006400; /* Verde do IF para o texto das listas */
| |
| font-weight: bold; /* Aplica negrito ao texto das listas */
| |
| margin-left: 20px; /* Ajuste de espaçamento para listas */
| |
| padding-left: 20px; /* Ajuste de espaçamento interno */
| |
| }
| |
|
| |
| /* Estilo para itens de lista (li) */
| |
| li {
| |
| color: #006400; /* Verde do IF para os itens de lista */
| |
| font-weight: bold; /* Aplica negrito aos itens de lista */
| |
| margin-bottom: 10px; /* Espaçamento entre os itens de lista */
| |
| font-size: 1em; /* Tamanho da fonte dos itens de lista */
| |
| line-height: 1.5; /* Espaçamento entre as linhas dos itens */
| |
| }
| |
|
| |
| /* Estilo específico para listas dentro do menu de navegação */
| |
| #p-navigation ul, #p-navigation ol {
| |
| color: #006400; /* Verde do IF para listas do menu */
| |
| font-weight: bold; /* Aplica negrito ao texto das listas no menu */
| |
| list-style: none; /* Remove os marcadores das listas no menu */
| |
| padding-left: 0; /* Remove espaçamento à esquerda */
| |
| }
| |
|
| |
| #p-navigation li {
| |
| margin-bottom: 8px; /* Menor espaçamento entre itens do menu */
| |
| }
| |
|
| |
| #p-navigation a {
| |
| color: #006400; /* Verde do IF para os links de menu */
| |
| text-decoration: none;
| |
| padding: 5px 10px;
| |
| border-radius: 5px;
| |
| transition: background-color 0.3s ease;
| |
| }
| |
|
| |
| #p-navigation a:hover {
| |
| background-color: #85c593; /* Cor de destaque ao passar o mouse */
| |
| }
| |
|
| |
| /* Responsividade para listas em dispositivos móveis */
| |
| @media (max-width: 768px) {
| |
| ol, ul {
| |
| padding-left: 15px; /* Reduz o espaçamento em telas menores */
| |
| }
| |
|
| |
| li {
| |
| margin-bottom: 8px; /* Reduz o espaçamento entre itens */
| |
| }
| |
|
| |
| #p-navigation ul, #p-navigation ol {
| |
| padding-left: 10px; /* Ajuste no menu em dispositivos móveis */
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* Botões */
| |
| button, .button {
| |
| background-color: #006400;
| |
| color: white;
| |
| border: none;
| |
| padding: 10px 20px;
| |
| border-radius: 5px;
| |
| font-size: 16px;
| |
| cursor: pointer;
| |
| transition: background-color 0.3s ease;
| |
| }
| |
|
| |
| button:hover, .button:hover {
| |
| background-color: #85c593; /* Sombra mais clara no hover */
| |
| }
| |
|
| |
| button:active, .button:active {
| |
| background-color: #32CD32;
| |
| }
| |
|
| |
|
| |
| /* Rodapé */
| |
| #footer {
| |
| background-color: #f3f3f3;
| |
| color: white;
| |
| padding: 20px;
| |
| text-align: center;
| |
| margin-top: 20px;
| |
| border-radius: 5px;
| |
| }
| |
|
| |
| #footer a {
| |
| color: green;
| |
| text-decoration: underline;
| |
| text-align: center;
| |
| }
| |
|
| |
| @media (max-width: 768px) {
| |
| #footer {
| |
| font-size: 14px;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
| /* Imagens responsivas */
| |
| img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| border-radius: 10px;
| |
| box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
| |
| }
| |
|
| |
|
| |
| /* Ajustes responsivos para tablets e dispositivos móveis */
| |
| @media (max-width: 1024px) {
| |
| #content {
| |
| padding: 15px;
| |
| max-width: 90%;
| |
| }
| |
|
| |
| h1, h2, h3 {
| |
| font-size: 1.5em;
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 768px) {
| |
| h1, h2, h3 {
| |
| font-size: 1.2em;
| |
| }
| |
|
| |
| #p-navigation ul {
| |
| flex-direction: column;
| |
| }
| |
|
| |
| #p-navigation li {
| |
| margin: 10px 0;
| |
|
| |
| @media (max-width: 768px) {
| |
| #mw-panel {
| |
| position: relative;
| |
| width: 100%;
| |
| top: 0;
| |
| border-radius: 0;
| |
| }
| |
|
| |
| #content {
| |
| margin-left: 0;
| |
| padding: 10px;
| |
| }
| |
|
| |
| #footer {
| |
| font-size: 14px;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
| /* Estilo para Política de Privacidade */
| |
| .page-Política_de_Privacidade {
| |
| background-color: #f9f9f9;
| |
| padding: 20px;
| |
| font-family: 'Open Sans', sans-serif;
| |
| border-radius: 10px;
| |
| color: #333;
| |
| line-height: 1.6;
| |
| }
| |
|
| |
|
| |
| /* Estilo para Sobre NTI */
| |
| .page-Sobre_NTI {
| |
| background-color: #ffffff;
| |
| padding: 20px;
| |
| border: 1px solid #006400;
| |
| font-family: 'Open Sans', sans-serif;
| |
| color: #333;
| |
| line-height: 1.6;
| |
| border-radius: 5px;
| |
| }
| |
|
| |
|
| |
| /* Estilo para Termo de Responsabilidade */
| |
| .page-Termo_de_Responsabilidade {
| |
| background-color: #f4f4f4;
| |
| padding: 15px;
| |
| font-family: 'Open Sans', sans-serif;
| |
| color: #333;
| |
| border-radius: 5px;
| |
| font-style: italic;
| |
| }
| |
