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
 
(10 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 {
/** Mild mode: light gray palette **/


    --primary-color: #2d2d2d;
/**/ :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 */


    --secondary-color: #f9f9f9;


    --accent-color: #b76e79;


}
/* Handpicked light gray palette for background */
 
--bg-overlay-0: #9998;
 
--bg-shadow-0: #0004;
/* Configuração de fundo e texto */
--popup-bg: #cccd;
 
--popup-anim-bg: var(--bg-shade-6);
body {
--popup-anim-bg: #999c; /* darken(var(--popup-bg), 2) */
 
--popup-anim-bg: #333c;
    background-color: var(--primary-color);
--popup-anim-bg: #0006;  /* invert dark */
 
--bg-shadow-1: var(--bg-shade-0);
    color: var(--secondary-color);
--bg-shade-0: #999;
 
--bg-shade-1: #aaa;
    font-family: 'Fonte Desejada', sans-serif; /* Substitua pela fonte desejada */
--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 */
/* Configuração de links */
--bg-shade-4: #e8e8e8; /* +6: +7 */ /* table row 1 */
 
--border-shade-4: var(--bg-shade-2);
a {
--bg-shade-48: #e8e8e8;  /* +4 :+3 */
 
--bg-shade-4a: #eaeaea;  /* +2 */
    color: var(--accent-color);
--bg-shade-50: #eeeeee;  /* +6: +4 */
 
--bg-shade-5: #f2f2f2;  /* +5: +4 */ /* table row 2 */
    text-decoration: none;
--bg-shade-6: #fff; /* +17: +13 */
 
}
 
 
a:hover {
 
    text-decoration: underline;
 
}
 
 
/* Cabeçalho */
 
#mw-head {
 
    background-color: var(--primary-color);
 
    /* ... outras personalizações */
 
}
 
 
/* Rodapé */
 
#footer {
 
    background-color: var(--primary-color);
 
    /* ... outras personalizações */
 
}
 
 
/* Barra de Navegação */
 
#mw-navigation {
 
    background-color: var(--primary-color);
 
    /* ... outras personalizações */
 
}
 
 
/* Personalizações Temáticas */
 
 
/* Exemplo: Adicionar um fundo temático */
 
body {
 
    background-image: url('caminho/para/sua/imagem.jpg');
 
    background-repeat: no-repeat;
 
    background-size: cover;
 
}


/* 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 */


/* Exemplo: Estilizando cabeçalhos */
/* --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 */


h1, h2, h3, h4, h5, h6 {
/* --diff-del-bg: #f004; */  /* bit bright */
 
--diff-del-bg: #f003;  /* add some red to --bg-shade-3 -> #e6b5b5 */
    color: var(--accent-color);
--diff-del-bg: #eaa;  /* #e8e8e8 + #f003 -> #e6b5b5 rounded */
 
--diff-del-bg-1: #f005; /* add more red -> #f57978 */
    font-family: 'Xena', Open Sans; /* Substitua pela fonte desejada */
--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: '';
}
}
/* ... e outras personalizações temáticas */

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: '';
}