MediaWiki:Common.js: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
$(function () { | $(function () { | ||
mw.loader.using('mediawiki.util').then(function () { | mw.loader.using('mediawiki.util').then(function () { | ||
console.log('[ReportAbuseLink] Inserting LARGE styled button...'); | console.log('[ReportAbuseLink] Inserting LARGE styled button with hover...'); | ||
const pageTitle = 'Report_Animal_Abuse'; | const pageTitle = 'Report_Animal_Abuse'; | ||
Line 7: | Line 7: | ||
const linkText = '🚨 Report Animal Abuse'; | const linkText = '🚨 Report Animal Abuse'; | ||
if (document.getElementById('report-abuse-button')) return; | if (document.getElementById('report-abuse-button')) return; | ||
// Create a <style> element for hover effect | |||
const style = document.createElement('style'); | |||
style.textContent = ` | |||
#report-abuse-button a:hover { | |||
background-color: #ff0000 !important; | |||
box-shadow: 0 0 12px rgba(255, 0, 0, 0.8); | |||
transform: scale(1.05); | |||
transition: all 0.2s ease-in-out; | |||
} | |||
`; | |||
document.head.appendChild(style); | |||
// Create the button | |||
const container = document.createElement('div'); | const container = document.createElement('div'); | ||
container.id = 'report-abuse-button'; | container.id = 'report-abuse-button'; | ||
Line 29: | Line 41: | ||
document.body.appendChild(container); | document.body.appendChild(container); | ||
console.log('[ReportAbuseLink] Button rendered.'); | console.log('[ReportAbuseLink] Button rendered with hover effect.'); | ||
}); | }); | ||
}); | }); |
Revision as of 06:03, 21 April 2025
$(function () { mw.loader.using('mediawiki.util').then(function () { console.log('[ReportAbuseLink] Inserting LARGE styled button with hover...'); const pageTitle = 'Report_Animal_Abuse'; const linkHref = mw.util.getUrl(pageTitle); const linkText = '🚨 Report Animal Abuse'; if (document.getElementById('report-abuse-button')) return; // Create a <style> element for hover effect const style = document.createElement('style'); style.textContent = ` #report-abuse-button a:hover { background-color: #ff0000 !important; box-shadow: 0 0 12px rgba(255, 0, 0, 0.8); transform: scale(1.05); transition: all 0.2s ease-in-out; } `; document.head.appendChild(style); // Create the button const container = document.createElement('div'); container.id = 'report-abuse-button'; container.innerHTML = `<a href="${linkHref}" style=" display: inline-block; background-color: #b10000; color: #fff; font-weight: bold; font-size: 18px; padding: 10px 18px; border-radius: 8px; text-decoration: none; position: fixed; top: 12px; right: 12px; z-index: 9999; box-shadow: 0 4px 8px rgba(0,0,0,0.25); ">${linkText}</a>`; document.body.appendChild(container); console.log('[ReportAbuseLink] Button rendered with hover effect.'); }); });