From 8a05fb146363b9d8337923cdf1c80fd7e5061d50 Mon Sep 17 00:00:00 2001
From: Isarra <zhorishna@gmail.com>
Date: Fri, 9 Aug 2019 19:04:26 +0000
Subject: [PATCH] Fix fixed header scroll offset in supported browsers

Kill js solution even for other browsers because it doesn't even really
work to begin with. And I have no clue how to make it work, because I
can't find any examples that do, either.

Fixes current firefox and chrome. Users of old browsers/other
proprietary or whatever things can, uh, suffer, I guess.

Bug: T181484
Change-Id: Ic3415702eaa33cf56ed0b1fabf9ca607c88d1863
---
 resources/main.js             | 21 ---------------------
 resources/screen-desktop.less |  6 ++++++
 2 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/resources/main.js b/resources/main.js
index 2ba74c2..7f882b8 100644
--- a/resources/main.js
+++ b/resources/main.js
@@ -7,25 +7,4 @@ $( function () {
 	 * Focus on search box when 'Tab' key is pressed once
 	 */
 	$( '#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();
-	} );
 } );
diff --git a/resources/screen-desktop.less b/resources/screen-desktop.less
index 659171c..6ecaff5 100644
--- a/resources/screen-desktop.less
+++ b/resources/screen-desktop.less
@@ -1,5 +1,11 @@
 @import 'variables.less';
 
+// T181484 (firefox and chrome; doesn't fix anything else as yet)
+body,
+html {
+	scroll-padding-top: @fixed-header-height + 0.5em;
+}
+
 // Override menu display from mobile
 // This also requires !importants where they hover and stuff
 .dropdown,