Widget:Teste - Histórico de revisão

Gurren1 em 16h05min de 10 de abril de 2026

2026-04-10T16:05:02Z

← Edição anterior		Edição das 16h05min de 10 de abril de 2026
Linha 361:		Linha 361:
	}		}

	mark {		@keyframes fq-mark-in {
	background: #fde68a;		from {
	color: #92400e;		opacity: 0.35;
			background-color: rgba(253, 230, 138, 0.45);
			color: #92400e;
			box-shadow: inset 0 0 0 1px rgba(217, 119, 6, 0.25);
			}

			to {
			opacity: 1;
			background-color: #fde68a;
			color: #92400e;
			box-shadow: none;
			}
			}

			#fq-widget mark.fq-hit {
	border-radius: 2px;		border-radius: 2px;
	padding: 0 2px;		padding: 0 2px;
			animation: fq-mark-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
			animation-delay: min(calc(var(--fq-m, 0) * 42ms), 380ms);
			}

			@media (prefers-reduced-motion: reduce) {
			#fq-widget mark.fq-hit {
			animation: none;
			background-color: #fde68a;
			color: #92400e;
			}
	}		}

Linha 1 471:		Linha 1 495:
	else { merged.push([r[0], r[1]]); }		else { merged.push([r[0], r[1]]); }
	}		}
	var out = '', cur = 0, seg;		var out = '', cur = 0, seg, mi = 0;
	for (i = 0; i < merged.length; i++) {		for (i = 0; i < merged.length; i++) {
	seg = merged[i];		seg = merged[i];
	out += esc(texto.slice(cur, seg[0]));		out += esc(texto.slice(cur, seg[0]));
	out += '<mark>' + esc(texto.slice(seg[0], seg[1])) + '</mark>';		out += '<mark class="fq-hit" style="--fq-m:' + (mi++) + '">' + esc(texto.slice(seg[0], seg[1])) + '</mark>';
	cur = seg[1];		cur = seg[1];
	}		}

Gurren1 em 15h57min de 10 de abril de 2026

2026-04-10T15:57:24Z

Mostrar alterações

Gurren1 em 15h53min de 10 de abril de 2026

2026-04-10T15:53:30Z

Mostrar alterações

Gurren1: Limpou toda a página

2026-04-07T19:11:09Z

Limpou toda a página

Mostrar alterações

Gurren1 em 22h03min de 4 de abril de 2026

2026-04-04T22:03:15Z

Mostrar alterações

Gurren1 em 21h36min de 4 de abril de 2026

2026-04-04T21:36:57Z

Mostrar alterações

Gurren1 em 20h48min de 4 de abril de 2026

2026-04-04T20:48:48Z

Mostrar alterações

Gurren1 em 01h53min de 4 de abril de 2026

2026-04-04T01:53:08Z

Mostrar alterações

Gurren1 em 00h24min de 1 de abril de 2026

2026-04-01T00:24:08Z

← Edição anterior		Edição das 00h24min de 1 de abril de 2026
Linha 1:		Linha 1:
			<!-- Widget:Teste — CSS + JS do exemplo didático (colar na página Widget:Teste) -->
	<style>		<style>
	.teste-caixa {		.teste-caixa {
	border: 1px solid #444;		border: 1px solid #444;
	border-radius: 6px;		border-radius: 6px;
	padding: 10px;		padding: 10px;
	max-width: 36em;		max-width: 36em;
	font-family: system-ui, sans-serif;		font-family: system-ui, sans-serif;
	}		}
	.teste-caixa h3 {
	margin: 0 0 8px;		.teste-caixa h3 {
	font-size: 1.1em;		margin: 0 0 8px;
	}		font-size: 1.1em;
	.teste-caixa .teste-corpo {		}
	margin: 0;
	}		.teste-caixa .teste-corpo {
	.teste-caixa .teste-corpo.teste-colapsado {		margin: 0;
	max-height: 3.2em;		}
	overflow: hidden;
	}		.teste-caixa .teste-corpo.teste-colapsado {
	.teste-caixa ~~button~~.teste-toggle {		max-height: 3.2em;
	margin-top: 8px;		overflow: hidden;
	cursor: pointer;		}
	}
			.teste-caixa .teste-toggle {
			display: inline-block;
			margin-top: 8px;
			padding: 4px 10px;
			cursor: pointer;
			border: 1px solid #666;
			border-radius: 4px;
			background: #f0f0f0;
			font: inherit;
			user-select: none;
			}

			.teste-caixa .teste-toggle:hover {
			background: #e4e4e4;
			}
	</style>		</style>
	<script>		<script>
	(function () {		(function () {
	function init() {		function init() {
	document.querySelectorAll('.teste-caixa').forEach(function (box) {		document.querySelectorAll('.teste-caixa').forEach(function (box) {
	if (box.dataset.testeInit) return;		if (box.dataset.testeInit) return;
	box.dataset.testeInit = '1';		box.dataset.testeInit = '1';
	var body = box.querySelector('.teste-corpo');		var body = box.querySelector('.teste-corpo');
	var btn = box.querySelector('.teste-toggle');		var btn = box.querySelector('.teste-toggle');
	if (!body \|\| !btn) return;		if (!body \|\| !btn) return;
	var aberto = false;		var aberto = false;
	~~btn.addEventListener('click',~~ function () {		function toggle() {
	aberto = !aberto;		aberto = !aberto;
	body.classList.toggle('teste-colapsado', !aberto);		body.classList.toggle('teste-colapsado', !aberto);
	btn.textContent = aberto ? 'Recolher' : 'Expandir';		btn.textContent = aberto ? 'Recolher' : 'Expandir';
			}
			btn.addEventListener('click', toggle);
			btn.addEventListener('keydown', function (e) {
			if (e.key === 'Enter' \|\| e.key === ' ') {
			e.preventDefault();
			toggle();
			}
			});
	});		});
	});		}
	}		if (document.readyState === 'loading') {
	if (document.readyState === 'loading') {		document.addEventListener('DOMContentLoaded', init);
	document.addEventListener('DOMContentLoaded', init);		} else {
	} else {		init();
	init();		}
	}		})();
	})();
	</script>		</script>

Gurren1 em 00h22min de 1 de abril de 2026

2026-04-01T00:22:21Z

← Edição anterior		Edição das 00h22min de 1 de abril de 2026
Linha 1:		Linha 1:
	<~~div id="fc-carousel"~~ style~~="position:relative; max~~-~~width~~:~~700px; margin:16px auto~~; border-radius:~~8px; overflow:hidden~~; ~~background:#1a1a2e;">~~		<style>
	~~<div id="fc-label" style="text-align:center;~~ padding:~~8px 40px; color:#fff; font-weight:bold; font-size:14px~~;~~"></div>~~		.teste-caixa {
	~~<div id="fc~~-~~track" style="display~~:~~flex~~; ~~transition:transform 0.4s ease;">~~		border: 1px solid #444;
	<!--~~slides are injected by JS~~-->		border-radius: 6px;
	~~</div>~~		padding: 10px;
	~~<div id="fc~~-~~prev" style="position:absolute; top:50%; left:8px; transform:translateY(-50%); width:32px; height:32px; background~~:~~rgba(0,~~0,0~~,0.6); border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2; user-select:none~~;~~" role="button" tabindex="0">~~		max-width: 36em;
	~~<span style="color:#fff;~~ font-size~~:18px; line-height~~:1;~~">❮</span>~~		font-family: system-ui, sans-serif;
	~~</div>~~		}
	~~<div id="fc~~-~~next" style="position~~:~~absolute~~; ~~top:50%; right:8px; transform:translateY(~~-~~50%); width:32px; height:32px; background:rgba(0,0,0,0~~.~~6); border~~-~~radius:50%; cursor:pointer; display:flex; align~~-~~items:center; justify~~-~~content~~:~~center~~; ~~z-index~~:2; ~~user~~-~~select:none;" role="~~button~~" tabindex="0">~~		.teste-caixa h3 {
	~~<span style="color:#fff; font~~-~~size~~:~~18px~~; ~~line-height~~:~~1;">&#10095~~;~~</span>~~		margin: 0 0 8px;
	~~</div>~~		font-size: 1.1em;
	</~~div~~>		}
			.teste-caixa .teste-corpo {
			margin: 0;
			}
			.teste-caixa .teste-corpo.teste-colapsado {
			max-height: 3.2em;
			overflow: hidden;
			}
			.teste-caixa button.teste-toggle {
			margin-top: 8px;
			cursor: pointer;
			}
			</style>
	<script>		<script>
	(function() {		(function () {
	var ~~slides~~ = [];		function init() {
	var ~~raw~~ = [		document.querySelectorAll('.teste-caixa').forEach(function (box) {
	~~{ img: "{{{img1~~\|~~}}}", label: "{{{label1~~\|~~}}}" },~~		if (box.dataset.testeInit) return;
	~~{ img: "{{{img2\|}}}"~~, ~~label: "~~{~~{{label2\|}}}" },~~		box.dataset.testeInit = '1';
	~~{ img: "{{{img3\|}}}", label: "{{{label3\|}}}" }~~,		var body = box.querySelector('.teste-corpo');
	~~{ img~~: ~~"{{{img4\|}}}", label: "{{{label4\|}}}" },~~		var btn = box.querySelector('.teste-toggle');
	~~{ img: "{{{img5\|~~}~~}}", label: "{{{label5\|}}}" },~~		if (!body \|\| !btn) return;
	~~{ img: "{{{img6\|~~}~~}}", label: "{{{label6\|}}}" },~~		var aberto = false;
	~~{ img: "{{{img7\|}}}", label: "{{{label7\|}}}"~~ },		btn.addEventListener('click', function () {
	~~{ img: "{{{img8\|}}}", label: "{{{label8\|}}}" }~~		aberto = !aberto;
	];		body.classList.toggle('teste-colapsado', !aberto);
			btn.textContent = aberto ? 'Recolher' : 'Expandir';
	~~for~~ (~~var i~~ = ~~0; i < raw.length; i++~~) {		});
	if (~~raw[i].img && raw[i].img.length > 0~~) {		});
	~~slides.push~~(~~raw[i]~~);		}
			if (document.readyState === 'loading') {
			document.addEventListener('DOMContentLoaded', init);
			} else {
			init();
	}		}
	}

	~~if (slides.length === 0) return;~~

	~~var current = 0;~~
	~~var interval = 3000;~~
	~~var timer = null;~~
	~~var paused = false;~~

	~~var carousel = document.getElementById('fc-carousel');~~
	~~var track = document.getElementById('fc-track');~~
	~~var label = document.getElementById('fc-label');~~
	~~var prevBtn = document.getElementById('fc-prev');~~
	~~var nextBtn = document.getElementById('fc-next');~~

	~~function getFileUrl(filename) {~~
	~~var base = mw && mw.config ? mw.config.get('wgScript') : '/index.php';~~
	~~return base + '?title=Especial:FilePath/' + encodeURIComponent(filename);~~
	}

	~~for (var i = 0; i < slides.length; i++) {~~
	~~var div = document.createElement('div');~~
	~~div.style.cssText = 'flex:0 0 100%; text-align:center; padding:4px; box-sizing:border-box;';~~
	~~var img = document.createElement('img');~~
	~~img.src = getFileUrl(slides[i].img);~~
	~~img.style.cssText = 'max-width:100%; height:auto; display:block; margin:0 auto; border-radius:4px;';~~
	~~img.alt = slides[i].label \|\| '';~~
	~~div.appendChild(img);~~
	~~track.appendChild(div);~~
	}

	~~function goTo(index) {~~
	~~if (index < 0) index = slides.length - 1;~~
	~~if (index >= slides.length) index = 0;~~
	~~current = index;~~
	~~track.style.transform = 'translateX(-' + (current * 100) + '%)';~~
	~~label.textContent = slides[current].label \|\| '';~~
	}

	~~function startTimer() {~~
	~~stopTimer();~~
	~~timer = setInterval(function() {~~
	~~if (!paused) goTo(current + 1);~~
	~~}, interval);~~
	}

	~~function stopTimer() {~~
	~~if (timer) { clearInterval(timer); timer = null; }~~
	}

	~~prevBtn.addEventListener('click', function() { goTo(current - 1); startTimer(); });~~
	~~nextBtn.addEventListener('click', function() { goTo(current + 1); startTimer(); });~~

	~~carousel.addEventListener('mouseenter', function() { paused = true; });~~
	~~carousel.addEventListener('mouseleave', function() { paused = false; });~~

	~~goTo(0);~~
	~~startTimer();~~
	})();		})();
	</script>		</script>