MediaWiki:Citizen.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* All JavaScript here will be loaded for users of the Citizen skin */

mw.loader.using( 'mediawiki.util' ).then( function () {
  $( function () {
    var $start = $( '.citizen-header__start' );
    if ( !$start.length ) return;

    var $btn = $( '<a>', {
      id: 'discord-header-btn',
      class: 'citizen-header__button',
      href: 'https://discord.com/',
      title: 'Join our Discord',
      'aria-label': 'Join our Discord',
      target: '_blank',
      rel: 'noopener noreferrer'
    });

	var svg =
	  '<svg viewBox="0 0 24 24" aria-hidden="true" focusable="false" class="discord-icon" xmlns="http://www.w3.org/2000/svg">' +
	  '  <path d="M20.317 4.37a19.79 19.79 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.211.375-.445.865-.608 1.249c-1.845-.276-3.68-.276-5.487 0c-.163-.393-.406-.874-.618-1.249a.077.077 0 0 0-.078-.037A19.736 19.736 0 0 0 2.66 4.34a.07.07 0 0 0-.032.028C1.533 9.046.944 13.58 1.105 18.058a.082.082 0 0 0 .031.056c2.053 1.508 4.041 2.423 5.993 3.03a.078.078 0 0 0 .084-.028c.462-.63.873-1.295 1.226-1.994a.076.076 0 0 0-.042-.106c-.653-.247-1.274-.55-1.872-.892a.077.077 0 0 1-.008-.128c.126-.094.252-.192.372-.291a.074.074 0 0 1 .078-.01c3.928 1.793 8.18 1.793 12.061 0a.074.074 0 0 1 .079.009c.12.099.246.198.372.292a.077.077 0 0 1-.007.128c-.598.352-1.22.645-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.363 1.225 1.993a.076.076 0 0 0 .085.029c1.961-.607 3.95-1.522 6.002-3.03a.077.077 0 0 0 .032-.055c.123-3.257-.206-7.745-.868-13.66a.061.061 0 0 0-.031-.029zM8.02 15.331c-1.184 0-2.157-1.086-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.211 0 2.176 1.094 2.157 2.419c0 1.333-.956 2.419-2.157 2.419zm7.975 0c-1.184 0-2.157-1.086-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.211 0 2.176 1.094 2.157 2.419c0 1.333-.946 2.419-2.157 2.419z"/>' +
	  '</svg>';

    $btn.append( svg );

    var $hamburger = $start.find( 'button, a' ).first();
    ( $hamburger.length ? $btn.insertAfter( $hamburger ) : $start.prepend( $btn ) );
  } );
} );