Usuários individuais têm permissão para criar modificações personalizadas na aparência da Memória Alfa em todas as skins do MediaWiki (por exemplo, no que diz respeito a fontes, cores, posições de links, etc.). Cascading Style Sheets (CSS) e JavaScript (JS) são usados com referência a seletores [1] de elementos HTML, classes, e linhas de ID especificadas no código HTML. Portanto, um usuário é capaz de examinar o código fonte em HTML da Memória Alfa e personalizar a aparência do site.
Cascading style sheets (CSS)[]
As folhas de estilo padrão são encontradas nos seguintes locais:
- Monobook: http://www.memory-alpha.org/pt/skins/monobook/main.css e MediaWiki:Monobook.css
- Padrão: http://www.memory-alpha.org/pt/skins/common/wikistandard.css e MediaWiki:Standard.css
- Azul colonial: http://www.memory-alpha.org/pt/skins/common/cologneblue.css e MediaWiki:Cologneblue.css
- Nostalgia: http://www.memory-alpha.org/pt/skins/common/nostalgia.css e MediaWiki:Nostalgia.css
Apenas administradores têm permissão para editar as páginas acima. Usuários podem especificar suas próprias folhas de estilo personalizadas ao editar as seguintes páginas:
- Monobook: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/monobook.css
- Padrão: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/standard.css
- Azul colonial: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/cologneblue.css
- Nostalgia: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/nostalgia.css
Exemplos[]
Você pode modificar a cor do fundo da seção de conteúdo principal para torná-lo mais escuro (e assim contrastar mais com o texto branco):
/* tornar a cor de fundo mais escura para a seção de conteúdo principal */ body { background-image: url(/graphics/background_monobook.gif); background-repeat: repeat; background-color: #fff; } #content, #footer { background-color: #000000; color: #FFFFFF; } .pBody { background-color: #000000; color: #FFFFFF; }
Você pode remover o estilo sublinhado do texto e fazê-lo aparecer apenas quando você colocar o cursor do mouse sobre o link:
/* fazer com que os sublinhados em links apareçam apenas usando o cursor do mouse */ a { text-decoration: none; } a:hover { text-decoration: underline; }
Você pode mudar a cor de vários subtipos de links, tais como links para artigos que ainda não existem, links para sites externos e links de e-mail:
/* mudar a cor padrão dos links */ a.new { color:#ff6633; } a.stub { color: #772233; } a.external, a.extiw { color:#999999; } a.mailto { color: #FFCC00; } #p-personal { color: #CCFFCC!important; }
Você pode omitir o ícone do "boneco" próximo ao seu nome de usuário:
/* omitir o ícone do boneco perto do seu nome de usuário */ li#pt-userpage { background: none }
Você pode ocultar o logotipo da Memória Alfa no layout:
/* não usar qualquer logotipo, mover as caixas para essa área */ #p-logo { display: none } #column-one { padding-top: 0; }
Se você estiver usando um navegador Gecko como Mozilla, Firefox ou Camino, você pode criar um estilo de "cantos arredondados " para o layout:
/* tornar alguns cantos arredondados, no momento suportado apenas por moz/firefox/outros navegadores gecko */ #p-cactions ul li, #p-cactions ul li a { -moz-border-radius-topleft: 1em; -moz-border-radius-topright: 1em; } #content { -moz-border-radius-topleft: 1em; -moz-border-radius-bottomleft: 1em; } div.pBody { -moz-border-radius-topright: 1em; -moz-border-radius-bottomright: 1em; } /* o mesmo seguindo as especificações de rascunho de css3, algum navegador suporta isso? */ #p-cactions ul li, #p-cactions ul li a { border-radius-topleft: 1em; border-radius-topright: 1em; } #content { border-radius-topleft: 1em; border-radius-bottomleft: 1em; } div.pBody { border-radius-topright: 1em; border-radius-bottomright: 1em; }
Você pode adicionar modificações específicas à interface que se aplicam apenas às páginas impressas:
/* ** Colocar todas as regras específicas para impressão em um bloco de impressão @media. */ /* poupar tinta e papel com fontes muito pequenas */ @media print { #footer, #content, body { font-size: 8pt !important; } h1 { font-size: 17pt } h2 { font-size: 14pt } h3 { font-size: 11pt } h4 { font-size: 9pt } h5 { font-size: 18pt } h6 { font-size: 8pt; font-weight: normal; } } /* Coisas avançadas: usando :before e :after é possível adicionar formatações essa regra adiciona a href completa de um link depois dele (não necessário na versão atual): */ @media print { #content a:link:after, #content a:visited:after { content: " <" attr(href) "> "; } }
JavaScript[]
Usuários também podem importar JavaScript personalizado ao adicionar o script nas seguintes páginas:
- Monobook: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/monobook.js
- Padrão: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/standard.js
- Azul colonial: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/cologneblue.js
- Nostalgia: http://www.memory-alpha.org/pt/index.php/Usuário:NOMEDEUSUÁRIO/nostalgia.js
Exemplos[]
- Você pode adicionar um conjunto de códigos espelhados na parte de baixo da seção #content do layout; veja Meta-Wiki: Estilos de usuário – códigos inferiores.
- Você pode mudar as chaves de acesso para modificar alguns elementos no agrupamento "ta" (veja [2]). Por exemplo:
ta['ca-nstab-main'] = new Array('c','Ver a página de conteúdos');
Veja também[]
- Ajuda:Preferências
- Meta-Wiki: Ajuda para estilos de usuários – Mais exemplos aqui (em inglês)
- Meta-Wiki: Galeria de estilos de usuários – Ainda mais exemplos! (em inglês)