MediaWiki:Common.css: mudanças entre as edições

De Xenite Wiki
Ir para navegação Ir para pesquisar
Sem resumo de edição
Sem resumo de edição
 
(7 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 1: Linha 1:
/* Cores principais */
@import url(//meta.wikimedia.org/wiki/User:Aron_Manning/skin-theming.css?action=raw&ctype=text/css);
:root {
    --primary-color: #2d2d2d;
    --secondary-color: #f9f9f9;
    --accent-color: #b76e79;
}


/* Configuração de fundo e texto */
/** Mild mode: light gray palette **/
body {
    background-color: var(--primary-color);
    color: var(--secondary-color);
    font-family: 'Fonte Desejada', sans-serif; /* Substitua pela fonte desejada */
}


/* Configuração de links */
/**/ :root,  /* Make it the default palette */
a {
:root.mild {
    color: var(--accent-color) !important;
/* Dark mode colors inverted for text */
    text-decoration: none;
--text-shade-1: #000;
}
--text-shade-2: #222;
--text-shade-3: #444;
--text-shade-4: #666;
/* Handpicked dark red palette for links */
--link-shade-1: #8b0000;
--link-shade-2: #7a0000;
--link-shade-3: #690000;
--link-shade-4: #580000;
--link-focus-bg: #8b000040;  /* dark red + alpha 25% */
--link-focus-bg: #8b0000d3;  /* dark red + alpha 20%, rounded */


a:hover {
    text-decoration: underline;
}


/* Cabeçalho */
#mw-head {
    background-color: var(--primary-color);
    /* ... outras personalizações */
}


/* Rodapé */
/* Handpicked light gray palette for background */
#footer {
--bg-overlay-0: #9998;
    background-color: var(--primary-color);
--bg-shadow-0: #0004;
    /* ... outras personalizações */
--popup-bg: #cccd;
}
--popup-anim-bg: var(--bg-shade-6);
--popup-anim-bg: #999c;  /* darken(var(--popup-bg), 2) */
--popup-anim-bg: #333c;
--popup-anim-bg: #0006;  /* invert dark */
--bg-shadow-1: var(--bg-shade-0);
--bg-shade-0: #999;
--bg-shade-1: #aaa;
--bg-shade-2: #bbb;
--bg-shade-3: #ddd;
--border-shade-3: var(--bg-shade-2);
--bg-shade-3a: #e1e1e1;  /* +7: +4 */
/* --bg-shade-4: #e5e5e5; */  /* +6: +4 */
--bg-shade-4: #e8e8e8;  /* +6: +7 */  /* table row 1 */
--border-shade-4: var(--bg-shade-2);
--bg-shade-48: #e8e8e8;  /* +4 :+3 */
--bg-shade-4a: #eaeaea;  /* +2 */
--bg-shade-50: #eeeeee;  /* +6: +4 */
--bg-shade-5: #f2f2f2;  /* +5: +4 */  /* table row 2 */
--bg-shade-6: #fff;  /* +17: +13 */


/* Barra de Navegação */
/* Difference view: gray, red and green with highlights */
#mw-navigation {
--diff-bg: #fff2;  /* brighten -- add some white with transparency -> #e1e1e1 */
    background-color: var(--primary-color);
--diff-bg: #fff4;  /* brighten -- add some white with transparency -> #e6e6e6 */
    /* ... outras personalizações */
--diff-bg: #fff5;  /* brighten -- add some white with transparency -> #e8e8e8 */
}
--diff-bg: #fff7;  /* brighten -- add some white with transparency -> #ededed */
--diff-bg: #fff8;  /* brighten -- add some white with transparency -> #efefef */
--diff-bg: var(--bg-shade-4); /* #e8e8e8 */
--diff-text: #222;
--diff-text: var(--text-shade-2);  /* #222 */


/* Personalizações Temáticas */
/* --diff-add-bg: #0f04; */  /* bit bright */
--diff-add-bg: #0f03;  /* add some green to --bg-shade-3 -> #b1e2b6 */
--diff-add-bg: #aea;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
--diff-add-bg: #beb;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
--diff-add-bg: #bdb;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
--diff-add-bg: #ada;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
--diff-add-bg-1: #0f05;  /* add more green -> #3fef47 */
--diff-add-bg-1: #4e4;  /* #ada + #0f05 -> #3fef47 rounded */
--diff-add-bg-1: #6d6;  /* #ada + #0f05 -> #3fef47, darker */
--diff-add-bg-1: #5d5;  /* #ada + #0f05 -> #3fef47, darker */


/* Exemplo: Adicionar um fundo temático */
/* --diff-del-bg: #f004; */  /* bit bright */
body {
--diff-del-bg: #f003;  /* add some red to --bg-shade-3 -> #e6b5b5 */
    background-image: url('caminho/para/sua/imagem.jpg');
--diff-del-bg: #eaa;  /* #e8e8e8 + #f003 -> #e6b5b5 rounded */
    background-repeat: no-repeat;
--diff-del-bg-1: #f005;  /* add more red -> #f57978 */
    background-size: cover;
--diff-del-bg-1: #e77; /* #533 + #f005 -> #f57978 rounded */
}
--diff-del-bg-1: #e66;  /* #533 + #f005 -> #f57978 rounded, bit darker */
--diff-del-bg-1: #e55; /* #533 + #f005 -> #f57978, darker */


/* Exemplo: Estilizando cabeçalhos */
--image-invert: '';
h1, h2, h3, h4, h5, h6 {
    color: var(--accent-color);
    font-family: 'Xena', Open Sans; /* Substitua pela fonte desejada */
}
 
/* ... e outras personalizações temáticas */
/* Configuração de links dentro de span */
span a {
color: var(--accent-color) !important;
text-decoration: none !important;  /* Remove a sublinha padrão dos links */
}
.mw-page-container-inner {
    background-color: #000000 !important;
}
 
span a:hover {
text-decoration: underline !important;  /* Adiciona a sublinha de volta quando o link é passado */
}
/* Altera a cor de fundo do menu principal para preto */
#vector-main-menu .vector-main-menu .vector-pinnable-element {
    background-color: #000000 !important;
}
 
/* Altera a cor de fundo da página para preto */
.mw-page-container {
    background-color: #000000 !important;
}
 
/* Altera a cor de fundo da textarea para preto e a cor do texto para branco */
#wpTextbox1.mw-editfont-monospace {
    background-color: #000000 !important;
    color: #ffffff !important;
}
}

Edição atual tal como às 20h31min de 26 de outubro de 2023

@import url(//meta.wikimedia.org/wiki/User:Aron_Manning/skin-theming.css?action=raw&ctype=text/css);

/** Mild mode: light gray palette **/

/**/ :root,  /* Make it the default palette */
:root.mild {
	/* Dark mode colors inverted for text */
	--text-shade-1: #000;
	--text-shade-2: #222;
	--text-shade-3: #444;
	--text-shade-4: #666;
	
/* Handpicked dark red palette for links */
	--link-shade-1: #8b0000;
	--link-shade-2: #7a0000;
	--link-shade-3: #690000;
	--link-shade-4: #580000;
	--link-focus-bg: #8b000040;  /* dark red + alpha 25% */
	--link-focus-bg: #8b0000d3;  /* dark red + alpha 20%, rounded */



	/* Handpicked light gray palette for background */
	--bg-overlay-0: #9998;
	--bg-shadow-0: #0004;
	--popup-bg: #cccd;
	--popup-anim-bg: var(--bg-shade-6);
	--popup-anim-bg: #999c;  /* darken(var(--popup-bg), 2) */
	--popup-anim-bg: #333c;
	--popup-anim-bg: #0006;  /* invert dark */
	--bg-shadow-1: var(--bg-shade-0);
	--bg-shade-0: #999;
	--bg-shade-1: #aaa;
	--bg-shade-2: #bbb;
	--bg-shade-3: #ddd;
	--border-shade-3: var(--bg-shade-2);
	--bg-shade-3a: #e1e1e1;  /* +7: +4 */
	/* --bg-shade-4: #e5e5e5; */  /* +6: +4 */
	--bg-shade-4: #e8e8e8;  /* +6: +7 */  /* table row 1 */
	--border-shade-4: var(--bg-shade-2);
	--bg-shade-48: #e8e8e8;  /* +4 :+3 */
	--bg-shade-4a: #eaeaea;  /* +2 */
	--bg-shade-50: #eeeeee;  /* +6: +4 */
	--bg-shade-5: #f2f2f2;  /* +5: +4 */  /* table row 2 */
	--bg-shade-6: #fff;  /* +17: +13 */

	/* Difference view: gray, red and green with highlights */
	--diff-bg: #fff2;  /* brighten -- add some white with transparency -> #e1e1e1 */
	--diff-bg: #fff4;  /* brighten -- add some white with transparency -> #e6e6e6 */
	--diff-bg: #fff5;  /* brighten -- add some white with transparency -> #e8e8e8 */
	--diff-bg: #fff7;  /* brighten -- add some white with transparency -> #ededed */
	--diff-bg: #fff8;  /* brighten -- add some white with transparency -> #efefef */
	--diff-bg: var(--bg-shade-4);  /* #e8e8e8 */
	--diff-text: #222;
	--diff-text: var(--text-shade-2);  /* #222 */

	/* --diff-add-bg: #0f04; */  /* bit bright */
	--diff-add-bg: #0f03;  /* add some green to --bg-shade-3 -> #b1e2b6 */
	--diff-add-bg: #aea;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
	--diff-add-bg: #beb;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
	--diff-add-bg: #bdb;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
	--diff-add-bg: #ada;  /* #e8e8e8 + #0f03 -> #b1e2b6 rounded */
	--diff-add-bg-1: #0f05;  /* add more green -> #3fef47 */
	--diff-add-bg-1: #4e4;  /* #ada + #0f05 -> #3fef47 rounded */
	--diff-add-bg-1: #6d6;  /* #ada + #0f05 -> #3fef47, darker */
	--diff-add-bg-1: #5d5;  /* #ada + #0f05 -> #3fef47, darker */

	/* --diff-del-bg: #f004; */  /* bit bright */
	--diff-del-bg: #f003;  /* add some red to --bg-shade-3 -> #e6b5b5 */
	--diff-del-bg: #eaa;  /* #e8e8e8 + #f003 -> #e6b5b5 rounded */
	--diff-del-bg-1: #f005;  /* add more red -> #f57978 */
	--diff-del-bg-1: #e77;  /* #533 + #f005 -> #f57978 rounded */
	--diff-del-bg-1: #e66;  /* #533 + #f005 -> #f57978 rounded, bit darker */
	--diff-del-bg-1: #e55;  /* #533 + #f005 -> #f57978, darker */

	--image-invert: '';
}