MediaWiki:Common.css - Revision history

WikiManagement at 11:03, 27 August 2026

2026-08-27T11:03:23Z

← Older revision		Revision as of 11:03, 27 August 2026
Line 310:		Line 310:



	~~/* Botão PDF */~~

	~~/* 1. Contentor do botão Download PDF - Alinhado à esquerda (ou onde precisares) */~~
	~~.pdf-download-container {~~
	~~display: flex !important;~~
	~~justify-content: left !important;~~
	}

	~~/* 2. Estilo do Botão - Base e Centralização */~~
	~~.button-pdf-secondary a.external {~~
	~~display: inline-flex !important;~~
	~~align-items: center !important;~~
	~~justify-content: center !important;~~
	~~background-color: transparent !important;~~
	~~color: #000 !important;~~
	~~border: 2px solid #000 !important;~~

	~~/* PADDING IGUAL DOS DOIS LADOS (Essencial para centrar) */~~
	~~padding: 7px 25px !important;~~

	~~border-radius: 50px !important;~~
	~~font-weight: bold !important;~~
	~~text-decoration: none !important;~~
	~~font-size: 1.0em !important;~~
	~~font-family: "Rubik", sans-serif !important;~~
	~~box-shadow: none !important;~~
	~~transition: background-color 0.2s ease, transform 0.2s ease !important;~~
	~~/* Remove a seta e o espaço fantasma do MediaWiki */~~
	~~background-image: none !important;~~
	~~margin-right: 0 !important;~~
	~~text-indent: 0 !important;~~
	~~letter-spacing: 0 !important;~~
	}

	~~/* 3. Forçar anulação de regras do sistema (mw-parser-output) */~~
	~~.mw-parser-output .button-pdf-secondary a.external {~~
	~~padding-right: 25px !important;~~
	~~background-image: none !important;~~
	}

	~~/* 4. Efeito ao passar o rato - leve fill */~~
	~~.button-pdf-secondary a.external:hover {~~
	~~background-color: rgba(0, 0, 0, 0.08) !important;~~
	~~transform: scale(1.05) !important;~~
	~~text-decoration: none !important;~~
	}

WikiManagement at 11:01, 27 August 2026

2026-08-27T11:01:22Z

← Older revision		Revision as of 11:01, 27 August 2026
Line 313:		Line 313:
	/* Botão PDF */		/* Botão PDF */

	.~~button~~-pdf-~~secondary~~ {		/* 1. Contentor do botão Download PDF - Alinhado à esquerda (ou onde precisares) */
	display: ~~inline-~~flex;		.pdf-download-container {
	~~align-items: center;~~		display: flex !important;
	~~padding: 10px 24px;~~		justify-content: left !important;
	~~border: 1.5px solid #2c2c2c;~~
	~~border~~-~~radius~~: ~~999px;~~
	~~color: #2c2c2c;~~
	~~background: transparent;~~
	~~font-weight: bold;~~
	~~font-size: 14px;~~
	~~text-decoration: none;~~
	~~transition: background 0.2s ease~~;
	}		}

	.button-pdf-secondary:~~hover {~~		/* 2. Estilo do Botão - Base e Centralização */
	background: ~~rgba~~(0, 0, 0, 0.06);		.button-pdf-secondary a.external {
	~~text~~-~~decoration~~: none;		display: inline-flex !important;
			align-items: center !important;
			justify-content: center !important;
			background-color: transparent !important;
			color: #000 !important;
			border: 2px solid #000 !important;

			/* PADDING IGUAL DOS DOIS LADOS (Essencial para centrar) */
			padding: 7px 25px !important;

			border-radius: 50px !important;
			font-weight: bold !important;
			text-decoration: none !important;
			font-size: 1.0em !important;
			font-family: "Rubik", sans-serif !important;
			box-shadow: none !important;
			transition: background-color 0.2s ease, transform 0.2s ease !important;
			/* Remove a seta e o espaço fantasma do MediaWiki */
			background-image: none !important;
			margin-right: 0 !important;
			text-indent: 0 !important;
			letter-spacing: 0 !important;
			}

			/* 3. Forçar anulação de regras do sistema (mw-parser-output) */
			.mw-parser-output .button-pdf-secondary a.external {
			padding-right: 25px !important;
			background-image: none !important;
	}		}

	.button-pdf-secondary.external {		/* 4. Efeito ao passar o rato - leve fill */
	background-~~image~~: ~~none~~ !important;		.button-pdf-secondary a.external:hover {
	~~padding~~-~~right~~: ~~24px~~ !important;		background-color: rgba(0, 0, 0, 0.08) !important;
			transform: scale(1.05) !important;
			text-decoration: none !important;
	}		}

WikiManagement at 10:59, 27 August 2026

2026-08-27T10:59:53Z

← Older revision		Revision as of 10:59, 27 August 2026
Line 314:		Line 314:

	.button-pdf-secondary {		.button-pdf-secondary {
	display: inline-~~block~~;		display: inline-flex;
	padding: ~~8px 20px~~;		align-items: center;
			padding: 10px 24px;
	border: 1.5px solid #2c2c2c;		border: 1.5px solid #2c2c2c;
	border-radius: ~~20px~~;		border-radius: 999px;
	color: #2c2c2c;		color: #2c2c2c;
	background: transparent;		background: transparent;
	font-weight: bold;		font-weight: bold;
			font-size: 14px;
	text-decoration: none;		text-decoration: none;
	transition: background 0.2s ease;		transition: background 0.2s ease;
Line 328:		Line 330:
	background: rgba(0, 0, 0, 0.06);		background: rgba(0, 0, 0, 0.06);
	text-decoration: none;		text-decoration: none;
			}

			.button-pdf-secondary.external {
			background-image: none !important;
			padding-right: 24px !important;
	}		}

WikiManagement at 10:58, 27 August 2026

2026-08-27T10:58:49Z

← Older revision		Revision as of 10:58, 27 August 2026
Line 309:		Line 309:
	}		}



			/* Botão PDF */

			.button-pdf-secondary {
			display: inline-block;
			padding: 8px 20px;
			border: 1.5px solid #2c2c2c;
			border-radius: 20px;
			color: #2c2c2c;
			background: transparent;
			font-weight: bold;
			text-decoration: none;
			transition: background 0.2s ease;
			}

			.button-pdf-secondary:hover {
			background: rgba(0, 0, 0, 0.06);
			text-decoration: none;
			}

WikiManagement at 09:34, 25 August 2026

2026-08-25T09:34:58Z

← Older revision		Revision as of 09:34, 25 August 2026
Line 6:		Line 6:

	/* Esconde as subpáginas */		/* Esconde as subpáginas */
	.~~atlas~~-submenu {		.wiki-submenu {
	display: none !important;		display: none !important;
	padding-left: 15px !important;		padding-left: 15px !important;
Line 13:		Line 13:
	}		}

	.~~atlas~~-submenu.is-open {		.wiki-submenu.is-open {
	display: block !important;		display: block !important;
	}		}

	/* Desenha a seta */		/* Desenha a seta */
	.~~atlas~~-toggle-btn {		.wiki-toggle-btn {
	cursor: pointer;		cursor: pointer;
	display: inline-block;		display: inline-block;
Line 33:		Line 33:

	/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */		/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */
	.~~atlas~~-toggle-btn.is-active {		.wiki-toggle-btn.is-active {
	transform: rotate(90deg);		transform: rotate(90deg);
	}		}

WikiManagement at 09:32, 25 August 2026

2026-08-25T09:32:36Z

← Older revision		Revision as of 09:32, 25 August 2026
Line 6:		Line 6:

	/* Esconde as subpáginas */		/* Esconde as subpáginas */
	.~~wiki~~-submenu {		.atlas-submenu {
	display: none !important;		display: none !important;
	padding-left: 15px !important;		padding-left: 15px !important;
Line 13:		Line 13:
	}		}

	.~~wiki~~-submenu.is-open {		.atlas-submenu.is-open {
	display: block !important;		display: block !important;
	}		}

	/* ~~O Segredo:~~ Desenha a seta ~~idêntica à do índice da Datasheet~~ */		/* Desenha a seta */
	.~~wiki~~-toggle-btn {		.atlas-toggle-btn {
	cursor: pointer;		cursor: pointer;
	display: inline-block;		display: inline-block;
Line 33:		Line 33:

	/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */		/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */
	.~~wiki~~-toggle-btn.is-active {		.atlas-toggle-btn.is-active {
	transform: rotate(90deg);		transform: rotate(90deg);
	}		}



	~~/* Contentor do bloco de código */~~
	~~.mw-highlight, .syntaxhighlight {~~
	~~position: relative; /* Necessário para o posicionamento do botão */~~
	}

	~~/* Estilo do Botão Copy */~~
	~~.copy-code-button {~~
	~~position: absolute;~~
	~~top: 5px;~~
	~~right: 5px;~~
	~~z-index: 100;~~
	~~padding: 4px 8px;~~
	~~background-color: #f8f9fa;~~
	~~border: 1px solid #a2a9b1;~~
	~~border-radius: 4px;~~
	~~color: #202122;~~
	~~font-size: 11px;~~
	~~font-family: sans-serif;~~
	~~cursor: pointer;~~
	~~opacity: 0.8;~~
	}

	~~.copy-code-button:hover {~~
	~~opacity: 1;~~
	~~background-color: #ffffff;~~
	~~border-color: #447ff5;~~
	~~color: #447ff5;~~
	~~box-shadow: 0 1px 2px rgba(0,0,0,0.1);~~
	}



Line 143:		Line 110:
	opacity: 0 !important;		opacity: 0 !important;
	}		}

WikiManagement at 09:30, 25 August 2026

2026-08-25T09:30:14Z

← Older revision		Revision as of 09:30, 25 August 2026
Line 36:		Line 36:
	transform: rotate(90deg);		transform: rotate(90deg);
	}		}



			/* Contentor do bloco de código */
			.mw-highlight, .syntaxhighlight {
			position: relative; /* Necessário para o posicionamento do botão */
			}

			/* Estilo do Botão Copy */
			.copy-code-button {
			position: absolute;
			top: 5px;
			right: 5px;
			z-index: 100;
			padding: 4px 8px;
			background-color: #f8f9fa;
			border: 1px solid #a2a9b1;
			border-radius: 4px;
			color: #202122;
			font-size: 11px;
			font-family: sans-serif;
			cursor: pointer;
			opacity: 0.8;
			}

			.copy-code-button:hover {
			opacity: 1;
			background-color: #ffffff;
			border-color: #447ff5;
			color: #447ff5;
			box-shadow: 0 1px 2px rgba(0,0,0,0.1);
			}

WikiManagement at 09:27, 25 August 2026

2026-08-25T09:27:33Z

← Older revision		Revision as of 09:27, 25 August 2026
Line 6:		Line 6:

	/* Esconde as subpáginas */		/* Esconde as subpáginas */
	.~~atlas~~-submenu {		.wiki-submenu {
	display: none !important;		display: none !important;
	padding-left: 15px !important;		padding-left: 15px !important;
Line 13:		Line 13:
	}		}

	.~~atlas~~-submenu.is-open {		.wiki-submenu.is-open {
	display: block !important;		display: block !important;
	}		}

	/* O Segredo: Desenha a seta idêntica à do índice da Datasheet */		/* O Segredo: Desenha a seta idêntica à do índice da Datasheet */
	.~~atlas~~-toggle-btn {		.wiki-toggle-btn {
	cursor: pointer;		cursor: pointer;
	display: inline-block;		display: inline-block;
Line 33:		Line 33:

	/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */		/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */
	.~~atlas~~-toggle-btn.is-active {		.wiki-toggle-btn.is-active {
	transform: rotate(90deg);		transform: rotate(90deg);
	}		}

WikiManagement at 09:18, 25 August 2026

2026-08-25T09:18:08Z

← Older revision	Revision as of 09:18, 25 August 2026
Line 5:	Line 5:


		/* Esconde as subpáginas */
		.atlas-submenu {
		display: none !important;
		padding-left: 15px !important;
		font-size: 0.95em !important;
		opacity: 0.85;
		}

		.atlas-submenu.is-open {
		display: block !important;
		}

		/* O Segredo: Desenha a seta idêntica à do índice da Datasheet */
		.atlas-toggle-btn {
		cursor: pointer;
		display: inline-block;
		width: 12px;
		height: 12px;
		margin-left: 8px;
		/* Usa o SVG oficial do MediaWiki para garantir o mesmo design */
		background-image: url(data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><path d="M3.22 2.22a.75.75 0 011.06 0l3.5 3.5a.75.75 0 010 1.06l-3.5 3.5a.75.75 0 11-1.06-1.06L6.19 6 3.22 3.03a.75.75 0 010-1.06z" fill="%2354595d"/></svg>);
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		transition: transform 0.2s ease-in-out;
		}

		/* Quando clicado (Aberto), roda para baixo igual à imagem image_5452b6.png */
		.atlas-toggle-btn.is-active {
		transform: rotate(90deg);
		}


		/* ==========================================================================
		ÍNDICE LATERAL (TOC) - DESIGN FINAL REFINADO COM HOVER E ANIMAÇÃO RÁPIDA
		========================================================================== */

		/* 1. Oculta as sublistas por padrão */
		.vector-toc-contents .vector-toc-list .vector-toc-list {
		display: none !important;
		}

		/* 2. Mostra a sublista quando expandido */
		.vector-toc-list-item.toc-expanded > .vector-toc-list {
		display: block !important;
		}

		/* 3. Posicionamento relativo das linhas do menu */
		.vector-toc-contents .vector-toc-list .vector-toc-list-item {
		position: relative !important;
		}

		/* 4. Container do botão da seta (Área clicável com efeito Hover) */
		.toc-toggle-arrow {
		position: absolute !important;
		left: -18px !important; /* Ajuste para centralizar o quadrado do hover à esquerda */
		top: 3px !important; /* Alinha perfeitamente ao centro da linha de texto */
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		cursor: pointer !important;
		width: 18px !important; /* Tamanho do quadrado do hover */
		height: 18px !important;
		border-radius: 2px; /* Cantos levemente suavizados para o quadrado */
		z-index: 50 !important;
		transition: background-color 0.1s ease;
		}

		/* Efeito Hover: Quadrado cinza clarinho ao passar o rato */
		.toc-toggle-arrow:hover {
		background-color: #e2e4e8 !important;
		}

		/* 5. O Desenho da Seta (Estilo Chevron - Cor Preta Forte) */
		.toc-toggle-arrow .arrow-icon {
		display: inline-block;
		width: 5px;
		height: 5px;
		border-right: 1.5px solid #202122; /* Preto forte igual aos cabeçalhos da wiki */
		border-bottom: 1.5px solid #202122;
		transform: rotate(-45deg); /* Aponta para a direita */
		transition: transform 0.1s ease-in-out; /* Animação ultra rápida */
		margin-left: -2px;
		}

		/* 6. Rotação rápida quando o menu abre (roda para baixo) */
		.vector-toc-list-item.toc-expanded > .toc-toggle-arrow .arrow-icon {
		transform: rotate(45deg) !important;
		margin-top: -2px;
		margin-left: 0px;
		}

		/* 7. Indentação interna limpa para os subcapítulos */
		.vector-toc-contents .vector-toc-list .vector-toc-list {
		padding-left: 12px !important;
		margin-top: 4px !important;
		}

		/* 8. Proteção absoluta para o cabeçalho principal "Datasheet" */
		.vector-toc-header .toc-toggle-arrow,
		.vector-toc-title .toc-toggle-arrow,
		#vector-toc-collapsed-button .toc-toggle-arrow {
		display: none !important;
		opacity: 0 !important;
		}

WikiManagement at 09:16, 25 August 2026

2026-08-25T09:16:22Z

← Older revision		Revision as of 09:16, 25 August 2026
Line 5:		Line 5:


	~~/* Any JavaScript here will be loaded for all users on every page load. */~~

	~~// Força o menu lateral a expandir (Vector 2022) se estiver colapsado~~
	~~mw.hook('wikipage.content').add(function () {~~
	~~if (document.documentElement.classList.contains('vector-feature-main-menu-pinned-disabled')) {~~
	~~var pinButton = document.getElementById('vector-main-menu-dropdown-checkbox');~~
	~~if (pinButton) {~~
	~~// Remove a classe de desativado e força o estado expandido~~
	~~document.documentElement.classList.remove('vector-feature-main-menu-pinned-disabled');~~
	~~document.documentElement.classList.add('vector-feature-main-menu-pinned-enabled');~~
	}
	}
	~~});~~