From 5d52d91a615431a83c0bcfb7b8e3a68383fc762e Mon Sep 17 00:00:00 2001
From: Isarra <zhorishna@gmail.com>
Date: Wed, 28 Nov 2018 20:48:57 +0000
Subject: [PATCH] Add offset for # links to work around fixed header on desktop

Prevent anchors from putting headers, cite notes, etc behind fixed
header when jumping around. Use js to avoid previous issue of mucked
up highlighting... (T162649)

bug: T181484, T162649
Change-Id: I6bdb450b24df50f39e14bc2b254c6adb6cc7f7d7
---
 resources/main.js | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/resources/main.js b/resources/main.js
index ce8cbf1..2ba74c2 100644
--- a/resources/main.js
+++ b/resources/main.js
@@ -8,4 +8,24 @@ $( function () {
 	 */
 	$( '#searchInput' ).attr( 'tabindex', $( document ).lastTabIndex() + 1 );
 
+	/**
+	 * Add offset for # links to work around fixed header on desktop
+	 * Apparently can't use CSS solutions due to highlighting of Cite links and similar. (T162649)
+	 *
+	 * Based on https://stackoverflow.com/questions/10732690/#answer-29853395
+	 */
+	function adjustAnchor() {
+		var mobileCutoffWidth = 850,
+			$anchor = $( ':target' ),
+			fixedElementHeight = $( '#mw-header-container' ).outerHeight() + 15;
+
+		if ( $( window ).width() > mobileCutoffWidth && $anchor.length > 0 ) {
+			$( 'html, body' ).stop();
+			window.scrollTo( 0, $anchor.offset().top - fixedElementHeight );
+		}
+	}
+
+	$( window ).on( 'hashchange load', function () {
+		adjustAnchor();
+	} );
 } );