Widget:Conquistas - Histórico de revisão

Larifk em 21h58min de 29 de abril de 2026

2026-04-29T21:58:42Z

← Edição anterior		Edição das 21h58min de 29 de abril de 2026
Linha 72:		Linha 72:
	}		}

			/* PAINEL */
	.gla-conquistas-panel {		.gla-conquistas-panel {
	max-width: 1100px;		max-width: 1100px;
	margin: 20px auto 0;		margin: 20px auto 0;
			display: none;
	}		}

			.gla-conquistas-panel.is-active {
			display: block;
			}

			/* LISTA */
	.gla-list {		.gla-list {
	display: flex;		display: flex;
Linha 83:		Linha 90:
	}		}

			/* ITEM */
	.gla-item {		.gla-item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 16px;
	padding: 12px 14px;		padding: 12px 14px;
	border-radius: ~~10px~~;		border-radius: 12px;
	border: 1px solid #e5e7eb;		border: 1px solid #e5e7eb;
	background: #f8fafc;		background: #f8fafc;
	}		}

			/* LADO ESQUERDO */
			.gla-item-left {
			display: flex;
			align-items: center;
			gap: 12px;
			}

			/* ICONE */
			.gla-item-icon img {
			width: 56px;
			height: 56px;
			object-fit: cover;

			/* REMOVE BORDA DO MEDIAWIKI */
			border: none !important;
			padding: 0 !important;
			background: none !important;
			box-shadow: none !important;
			}

			/* fallback extra */
			.thumbimage {
			border: none !important;
			padding: 0 !important;
			background: none !important;
			}

			/* TEXTO */
	.gla-item-title {		.gla-item-title {
	font-weight: 700;		font-weight: 700;
Linha 102:		Linha 142:
	}		}

			/* RECOMPENSA */
			.gla-item-reward {
			font-size: 13px;
			color: #2563eb;
			font-weight: 600;
			}
	</style>		</style>

Linha 109:		Linha 155:
	var panels = document.querySelectorAll(".gla-conquistas-panel");		var panels = document.querySelectorAll(".gla-conquistas-panel");

	function abrirAba(~~nomeAba~~) {		function abrirAba(nome) {
	tabs.forEach(function(~~tab~~) {		tabs.forEach(function(t) {
	~~tab~~.classList.remove("is-active");		t.classList.remove("is-active");
	});		});

	panels.forEach(function(~~panel~~) {		panels.forEach(function(p) {
	~~panel~~.~~style~~.~~display =~~ "~~none~~";		p.classList.remove("is-active");
	});		});

	var ~~abaAtiva~~ = document.querySelector('.gla-conquistas-tab[data-tab="' + ~~nomeAba~~ + '"]');		var tab = document.querySelector('.gla-conquistas-tab[data-tab="' + nome + '"]');
	var ~~painelAtivo~~ = document.querySelector('.gla-conquistas-panel[data-tab-content="' + ~~nomeAba~~ + '"]');		var panel = document.querySelector('.gla-conquistas-panel[data-tab-content="' + nome + '"]');

	~~if (abaAtiva) {~~
	~~abaAtiva.classList.add("is-active");~~
	}

	if (~~painelAtivo~~) {		if (tab) tab.classList.add("is-active");
	~~painelAtivo~~.~~style~~.~~display =~~ "~~block~~";		if (panel) panel.classList.add("is-active");
	}
	}		}

Larifk em 21h52min de 29 de abril de 2026

2026-04-29T21:52:52Z

← Edição anterior		Edição das 21h52min de 29 de abril de 2026
Linha 101:		Linha 101:
	margin-top: 2px;		margin-top: 2px;
	}		}
	~~.novaborda {~~
	~~border: none !important;~~
	~~padding: 0 !important;~~
	~~margin: 0 !important;~~
	~~background: none !important;~~
	}
	</style>		</style>

Larifk em 21h43min de 29 de abril de 2026

2026-04-29T21:43:35Z

← Edição anterior		Edição das 21h43min de 29 de abril de 2026
Linha 100:		Linha 100:
	color: #64748b;		color: #64748b;
	margin-top: 2px;		margin-top: 2px;
			}
			.novaborda {
			border: none !important;
			padding: 0 !important;
			margin: 0 !important;
			background: none !important;
	}		}
	</style>		</style>

Larifk em 13h39min de 29 de abril de 2026

2026-04-29T13:39:50Z

← Edição anterior		Edição das 13h39min de 29 de abril de 2026
Linha 1:		Linha 1:
			<div class="gla-conquistas-headerbox">
			<div class="gla-conquistas-header">
			<h2>Conquistas</h2>
			<p>Acompanhe as conquistas disponíveis no Grand Line Adventures.</p>
			</div>

			<div class="gla-conquistas-tabs">
			<span class="gla-conquistas-tab is-active" data-tab="geral">Geral</span>
			<span class="gla-conquistas-tab" data-tab="personagens">Personagens</span>
			<span class="gla-conquistas-tab" data-tab="missao">Missão</span>
			<span class="gla-conquistas-tab" data-tab="bau">Baú</span>
			<span class="gla-conquistas-tab" data-tab="navegacao">Navegação</span>
			<span class="gla-conquistas-tab" data-tab="pvp">PvP</span>
			<span class="gla-conquistas-tab" data-tab="pve">PvE</span>
			<span class="gla-conquistas-tab" data-tab="coliseu">Coliseu</span>
			<span class="gla-conquistas-tab" data-tab="poneglyph">Poneglyph</span>
			<span class="gla-conquistas-tab" data-tab="indicacao">Indicação</span>
			<span class="gla-conquistas-tab" data-tab="celular">Celular</span>
			<span class="gla-conquistas-tab" data-tab="bossrush">Boss Rush</span>
			</div>
			</div>

	<style>		<style>
	.gla-conquistas {		.gla-conquistas-headerbox {
	max-width: 1100px;		max-width: 1100px;
	margin: 0 auto 20px;		margin: 0 auto 20px;
Linha 26:		Linha 48:
	flex-wrap: wrap;		flex-wrap: wrap;
	gap: 8px;		gap: 8px;
	~~margin-bottom: 20px;~~
	}		}

	.gla-conquistas-tab {		.gla-conquistas-tab {
			display: inline-block;
	padding: 8px 14px;		padding: 8px 14px;
	border-radius: 999px;		border-radius: 999px;
Linha 51:		Linha 73:

	.gla-conquistas-panel {		.gla-conquistas-panel {
	~~display~~: ~~none~~;		max-width: 1100px;
	}		margin: 20px auto 0;

	~~.gla-conquistas-panel.is-active {~~
	~~display~~: ~~block~~;
	}		}

Linha 86:		Linha 105:
	<script>		<script>
	document.addEventListener("DOMContentLoaded", function () {		document.addEventListener("DOMContentLoaded", function () {
	var ~~widgets~~ = document~~.querySelectorAll(".gla-conquistas");~~		var tabs = document.querySelectorAll(".gla-conquistas-tab");
			var panels = document.querySelectorAll(".gla-conquistas-panel");
	~~widgets.forEach(function(widget) {~~
	~~var tabs = widget~~.querySelectorAll(".gla-conquistas-tab");
	var panels = ~~widget~~.querySelectorAll(".gla-conquistas-panel");

			function abrirAba(nomeAba) {
	tabs.forEach(function(tab) {		tabs.forEach(function(tab) {
	tab.~~addEventListener~~("~~click~~"~~, function(~~) {		tab.classList.remove("is-active");
	~~var selected = tab.getAttribute("data-tab"~~);		});

	~~tabs~~.forEach(function(~~item~~) {		panels.forEach(function(panel) {
	~~item~~.~~classList~~.~~remove(~~"~~is-active~~");		panel.style.display = "none";
	});		});

	~~panels~~.~~forEach~~(~~function(panel~~) {		var abaAtiva = document.querySelector('.gla-conquistas-tab[data-tab="' + nomeAba + '"]');
	~~panel~~.~~classList~~.~~remove(~~"~~is-active~~");		var painelAtivo = document.querySelector('.gla-conquistas-panel[data-tab-content="' + nomeAba + '"]');
	});

	~~tab~~.classList.add("is-active");		if (abaAtiva) {
			abaAtiva.classList.add("is-active");
			}

	~~var activePanel = widget~~.~~querySelector('~~.~~gla-conquistas-panel[data-tab-content~~="~~' + selected + '~~"~~]')~~;		if (painelAtivo) {
			painelAtivo.style.display = "block";
			}
			}

	if (~~activePanel~~) {		tabs.forEach(function(tab) {
	~~activePanel~~.~~classList~~.~~add~~("is-~~active~~");		tab.addEventListener("click", function() {
	}		abrirAba(tab.getAttribute("data-tab"));
	});
	});		});
	});		});

			abrirAba("geral");
	});		});
	</script>		</script>

Larifk em 13h37min de 29 de abril de 2026

2026-04-29T13:37:28Z

← Edição anterior		Edição das 13h37min de 29 de abril de 2026
Linha 1:		Linha 1:
	~~<div class="gla-achievements-widget">~~

	~~<div class="gla-header">~~
	~~<h2>Conquistas</h2>~~
	~~<p>Acompanhe as conquistas disponíveis no Grand Line Adventures.</p>~~
	~~</div>~~

	~~<div class="gla-tabs">~~
	~~<button type="button" class="gla-tab active" data-tab="geral">Geral</button>~~
	~~<button type="button" class="gla-tab" data-tab="personagens">Personagens</button>~~
	~~<button type="button" class="gla-tab" data-tab="missao">Missão</button>~~
	~~<button type="button" class="gla-tab" data-tab="bau">Baú</button>~~
	~~<button type="button" class="gla-tab" data-tab="navegacao">Navegação</button>~~
	~~<button type="button" class="gla-tab" data-tab="pvp">PvP</button>~~
	~~<button type="button" class="gla-tab" data-tab="pve">PvE</button>~~
	~~<button type="button" class="gla-tab" data-tab="coliseu">Coliseu</button>~~
	~~<button type="button" class="gla-tab" data-tab="poneglyph">Poneglyph</button>~~
	~~<button type="button" class="gla-tab" data-tab="indicacao">Indicação</button>~~
	~~<button type="button" class="gla-tab" data-tab="celular">Celular</button>~~
	~~<button type="button" class="gla-tab" data-tab="bossrush">Boss Rush</button>~~
	~~</div>~~

	~~</div>~~

	<style>		<style>
	.gla-~~achievements-widget~~ {		.gla-conquistas {
	max-width: 1100px;		max-width: 1100px;
	margin: 0 auto 20px;		margin: 0 auto 20px;
Linha 33:		Linha 9:
	}		}

	.gla-header h2 {		.gla-conquistas-header h2 {
	margin: 0;		margin: 0;
	font-size: 26px;		font-size: 26px;
Linha 40:		Linha 16:
	}		}

	.gla-header p {		.gla-conquistas-header p {
	margin: 4px 0 16px;		margin: 4px 0 16px;
	color: #64748b;		color: #64748b;
Linha 46:		Linha 22:
	}		}

	.gla-tabs {		.gla-conquistas-tabs {
	display: flex;		display: flex;
	flex-wrap: wrap;		flex-wrap: wrap;
	gap: 8px;		gap: 8px;
			margin-bottom: 20px;
	}		}

	.gla-tab {		.gla-conquistas-tab {
	padding: 8px 14px;		padding: 8px 14px;
	border-radius: 999px;		border-radius: 999px;
Linha 61:		Linha 38:
	font-weight: 600;		font-weight: 600;
	color: #0f172a;		color: #0f172a;
	~~transition: all 0.2s ease;~~
	}		}

	.gla-tab:hover {		.gla-conquistas-tab:hover {
	background: #e2e8f0;		background: #e2e8f0;
	}		}

	.gla-tab.active {		.gla-conquistas-tab.is-active {
	background: #0f172a;		background: #0f172a;
	color: #ffffff;		color: #ffffff;
Linha 74:		Linha 50:
	}		}

	.gla-~~tab~~-panel {		.gla-conquistas-panel {
	~~max-width: 1100px;~~		display: none;
	~~margin~~: ~~20px auto 0~~;
	}		}

	.gla-~~tab~~-panel~~[hidden]~~ {		.gla-conquistas-panel.is-active {
	display: ~~none !important~~;		display: block;
	}		}

Linha 111:		Linha 86:
	<script>		<script>
	document.addEventListener("DOMContentLoaded", function () {		document.addEventListener("DOMContentLoaded", function () {
	var tabs = ~~document~~.querySelectorAll(".gla-tab");		var widgets = document.querySelectorAll(".gla-conquistas");
	var panels = ~~document~~.querySelectorAll(".gla-~~tab~~-panel");
			widgets.forEach(function(widget) {
			var tabs = widget.querySelectorAll(".gla-conquistas-tab");
			var panels = widget.querySelectorAll(".gla-conquistas-panel");

	~~function openTab(tabName) {~~
	tabs.forEach(function(tab) {		tabs.forEach(function(tab) {
	tab.~~classList.remove~~("~~active~~");		tab.addEventListener("click", function() {
	});		var selected = tab.getAttribute("data-tab");

	~~panels~~.forEach(function(~~panel~~) {		tabs.forEach(function(item) {
	~~panel~~.~~hidden = true~~;		item.classList.remove("is-active");
	});		});

	~~var activeTab = document~~.~~querySelector~~('.~~gla~~-~~tab[data-tab="' + tabName + '~~"]');		panels.forEach(function(panel) {
	~~var activePanel = document.querySelector('.gla-tab-panel[data-tab-content="' + tabName + '"]'~~);		panel.classList.remove("is-active");
			});

	~~if (activeTab) {~~		tab.classList.add("is-active");
	~~activeTab~~.classList.add("active");
	}

	if (~~activePanel) {~~		var activePanel = widget.querySelector('.gla-conquistas-panel[data-tab-content="' + selected + '"]');
	~~activePanel~~.~~hidden~~ = ~~false~~;
	}
	}

	~~tabs.forEach~~(~~function(tab~~) {		if (activePanel) {
	~~tab~~.~~addEventListener("click", function() {~~		activePanel.classList.add("is-active");
	~~var selected = tab~~.~~getAttribute~~("~~data~~-~~tab~~");		}
	~~openTab(selected~~);		});
	});		});
	});		});

	~~openTab("geral");~~
	});		});
	</script>		</script>

Larifk em 13h33min de 29 de abril de 2026

2026-04-29T13:33:49Z

← Edição anterior		Edição das 13h33min de 29 de abril de 2026
Linha 7:		Linha 7:

	<div class="gla-tabs">		<div class="gla-tabs">
	<button class="gla-tab active" data-tab="geral">Geral</button>		<button type="button" class="gla-tab active" data-tab="geral">Geral</button>
	<button class="gla-tab" data-tab="personagens">Personagens</button>		<button type="button" class="gla-tab" data-tab="personagens">Personagens</button>
	<button class="gla-tab" data-tab="missao">Missão</button>		<button type="button" class="gla-tab" data-tab="missao">Missão</button>
	<button class="gla-tab" data-tab="bau">Baú</button>		<button type="button" class="gla-tab" data-tab="bau">Baú</button>
	<button class="gla-tab" data-tab="navegacao">Navegação</button>		<button type="button" class="gla-tab" data-tab="navegacao">Navegação</button>
	<button class="gla-tab" data-tab="pvp">PvP</button>		<button type="button" class="gla-tab" data-tab="pvp">PvP</button>
	<button class="gla-tab" data-tab="pve">PvE</button>		<button type="button" class="gla-tab" data-tab="pve">PvE</button>
	<button class="gla-tab" data-tab="coliseu">Coliseu</button>		<button type="button" class="gla-tab" data-tab="coliseu">Coliseu</button>
	<button class="gla-tab" data-tab="poneglyph">Poneglyph</button>		<button type="button" class="gla-tab" data-tab="poneglyph">Poneglyph</button>
	<button class="gla-tab" data-tab="indicacao">Indicação</button>		<button type="button" class="gla-tab" data-tab="indicacao">Indicação</button>
	<button class="gla-tab" data-tab="celular">Celular</button>		<button type="button" class="gla-tab" data-tab="celular">Celular</button>
	<button class="gla-tab" data-tab="bossrush">Boss Rush</button>		<button type="button" class="gla-tab" data-tab="bossrush">Boss Rush</button>
	</div>		</div>

Linha 37:		Linha 37:
	font-size: 26px;		font-size: 26px;
	font-weight: 700;		font-weight: 700;
	color: #~~111827~~;		color: #020617;
	}		}

	.gla-header p {		.gla-header p {
	margin: 4px 0 16px;		margin: 4px 0 16px;
	color: #~~6b7280~~;		color: #64748b;
	font-size: 14px;		font-size: 14px;
	}		}
Linha 55:		Linha 55:
	padding: 8px 14px;		padding: 8px 14px;
	border-radius: 999px;		border-radius: 999px;
	border: 1px solid #~~d1d5db~~;		border: 1px solid #cbd5e1;
	background: #~~f9fafb~~;		background: #f8fafc;
	cursor: pointer;		cursor: pointer;
	font-size: 13px;		font-size: 13px;
	font-weight: 600;		font-weight: 600;
	color: #~~374151~~;		color: #0f172a;
	transition: all 0.2s ease;		transition: all 0.2s ease;
	}		}

	.gla-tab:hover {		.gla-tab:hover {
	background: #~~f3f4f6~~;		background: #e2e8f0;
	}		}

	.gla-tab.active {		.gla-tab.active {
	background: #~~111827~~;		background: #0f172a;
	color: #ffffff;		color: #ffffff;
	border-color: #~~111827~~;		border-color: #0f172a;
	}		}

	.gla-tab-panel {		.gla-tab-panel {
	~~display: none;~~
	max-width: 1100px;		max-width: 1100px;
	margin: 20px auto 0;		margin: 20px auto 0;
	}		}

	.gla-tab-panel~~.active~~ {		.gla-tab-panel[hidden] {
	display: ~~block~~;		display: none !important;
	}		}

Linha 94:		Linha 93:
	border-radius: 10px;		border-radius: 10px;
	border: 1px solid #e5e7eb;		border: 1px solid #e5e7eb;
	background: #~~f9fafb~~;		background: #f8fafc;
	}		}

Linha 100:		Linha 99:
	font-weight: 700;		font-weight: 700;
	font-size: 15px;		font-size: 15px;
	color: #~~111827~~;		color: #0f172a;
	}		}

	.gla-item-desc {		.gla-item-desc {
	font-size: 13px;		font-size: 13px;
	color: #~~6b7280~~;		color: #64748b;
	margin-top: 2px;		margin-top: 2px;
	}		}
Linha 112:		Linha 111:
	<script>		<script>
	document.addEventListener("DOMContentLoaded", function () {		document.addEventListener("DOMContentLoaded", function () {
	~~const~~ tabs = document.querySelectorAll(".gla-tab");		var tabs = document.querySelectorAll(".gla-tab");
	~~const~~ panels = document.querySelectorAll(".gla-tab-panel");		var panels = document.querySelectorAll(".gla-tab-panel");

	~~tabs.forEach(~~function(~~tab~~) {		function openTab(tabName) {
	~~tab~~.~~addEventListener~~(~~"click",~~ function() {		tabs.forEach(function(tab) {
	~~const selected =~~ tab.~~getAttribute~~("~~data-tab~~");		tab.classList.remove("active");
			});

	~~tabs~~.forEach(function(t) {		panels.forEach(function(panel) {
	~~t.classList~~.~~remove("active")~~;		panel.hidden = true;
	});		});

	~~panels~~.~~forEach~~(~~function(p~~) {		var activeTab = document.querySelector('.gla-tab[data-tab="' + tabName + '"]');
	p.~~classList~~.~~remove(~~"~~active~~");		var activePanel = document.querySelector('.gla-tab-panel[data-tab-content="' + tabName + '"]');
	});

	~~tab~~.classList.add("active");		if (activeTab) {
			activeTab.classList.add("active");
			}

	~~const panel = document.querySelector~~(		if (activePanel) {
	'.~~gla-tab-panel[data-tab-content~~=~~"' + selected + '"]'~~		activePanel.hidden = false;
	);		}
			}

	if (~~panel~~) {		tabs.forEach(function(tab) {
	~~panel~~.~~classList~~.~~add~~("~~active~~");		tab.addEventListener("click", function() {
	}		var selected = tab.getAttribute("data-tab");
			openTab(selected);
	});		});
	});		});

			openTab("geral");
	});		});
	</script>		</script>

Larifk: Criou página com '

Conquistas

Acompanhe as conquistas disponíveis no Grand Line Adventures.

...'

2026-04-29T13:27:26Z

Criou página com '<div class="gla-achievements-widget"> <div class="gla-header"> <h2>Conquistas</h2> <p>Acompanhe as conquistas disponíveis no Grand Line Adventures.</p> </div>...'

Página nova

<div class="gla-achievements-widget">

<div class="gla-header">
<h2>Conquistas</h2>
<p>Acompanhe as conquistas disponíveis no Grand Line Adventures.</p>
</div>

<div class="gla-tabs">
<button class="gla-tab active" data-tab="geral">Geral</button>
<button class="gla-tab" data-tab="personagens">Personagens</button>
<button class="gla-tab" data-tab="missao">Missão</button>
<button class="gla-tab" data-tab="bau">Baú</button>
<button class="gla-tab" data-tab="navegacao">Navegação</button>
<button class="gla-tab" data-tab="pvp">PvP</button>
<button class="gla-tab" data-tab="pve">PvE</button>
<button class="gla-tab" data-tab="coliseu">Coliseu</button>
<button class="gla-tab" data-tab="poneglyph">Poneglyph</button>
<button class="gla-tab" data-tab="indicacao">Indicação</button>
<button class="gla-tab" data-tab="celular">Celular</button>
<button class="gla-tab" data-tab="bossrush">Boss Rush</button>
</div>

</div>

<style>
.gla-achievements-widget {
max-width: 1100px;
margin: 0 auto 20px;
padding: 20px;
border-radius: 16px;
background: #ffffff;
border: 1px solid #e5e7eb;
}

.gla-header h2 {
margin: 0;
font-size: 26px;
font-weight: 700;
color: #111827;
}

.gla-header p {
margin: 4px 0 16px;
color: #6b7280;
font-size: 14px;
}

.gla-tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
}

.gla-tab {
padding: 8px 14px;
border-radius: 999px;
border: 1px solid #d1d5db;
background: #f9fafb;
cursor: pointer;
font-size: 13px;
font-weight: 600;
color: #374151;
transition: all 0.2s ease;
}

.gla-tab:hover {
background: #f3f4f6;
}

.gla-tab.active {
background: #111827;
color: #ffffff;
border-color: #111827;
}

.gla-tab-panel {
display: none;
max-width: 1100px;
margin: 20px auto 0;
}

.gla-tab-panel.active {
display: block;
}

.gla-list {
display: flex;
flex-direction: column;
gap: 10px;
}

.gla-item {
padding: 12px 14px;
border-radius: 10px;
border: 1px solid #e5e7eb;
background: #f9fafb;
}

.gla-item-title {
font-weight: 700;
font-size: 15px;
color: #111827;
}

.gla-item-desc {
font-size: 13px;
color: #6b7280;
margin-top: 2px;
}
</style>

<script>
document.addEventListener("DOMContentLoaded", function () {
const tabs = document.querySelectorAll(".gla-tab");
const panels = document.querySelectorAll(".gla-tab-panel");

tabs.forEach(function(tab) {
tab.addEventListener("click", function() {
const selected = tab.getAttribute("data-tab");

tabs.forEach(function(t) {
t.classList.remove("active");
});

panels.forEach(function(p) {
p.classList.remove("active");
});

tab.classList.add("active");

const panel = document.querySelector(
'.gla-tab-panel[data-tab-content="' + selected + '"]'
);

if (panel) {
panel.classList.add("active");
}
});
});
});
</script>