From: Alexander Ebert <ebert@woltlab.com>
Date: Fri, 9 Sep 2016 11:38:50 +0000 (+0200)
Subject: Fixed code box anchors
X-Git-Tag: 3.0.0_Beta_1~243
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=2d561c326c549d5015cd998e0acd213b3d5c413f;p=GitHub%2FWoltLab%2FWCF.git

Fixed code box anchors
---

diff --git a/com.woltlab.wcf/templates/codeMetaCode.tpl b/com.woltlab.wcf/templates/codeMetaCode.tpl
index 659cb0d27f..8310015ef7 100644
--- a/com.woltlab.wcf/templates/codeMetaCode.tpl
+++ b/com.woltlab.wcf/templates/codeMetaCode.tpl
@@ -8,7 +8,7 @@
 			{assign var='lineNumber' value=$startLineNumber}
 			{foreach from=$content item=line}
 				{if $lineNumbers[$lineNumber]|isset}
-					<li id="{@$lineNumbers[$lineNumber]}"><a href="{@$__wcf->getAnchor($lineNumbers[$lineNumber])}" class="lineAnchor"></a>{@$line}</li>
+					<li><span id="{@$lineNumbers[$lineNumber]}" class="codeBoxJumpAnchor"></span><a href="{@$__wcf->getAnchor($lineNumbers[$lineNumber])}" class="lineAnchor"></a>{@$line}</li>
 				{else}
 					<li>{@$line}</li>
 				{/if}
diff --git a/wcfsetup/install/files/style/bbcode/code.scss b/wcfsetup/install/files/style/bbcode/code.scss
index 1ffb1ceff5..294117660b 100644
--- a/wcfsetup/install/files/style/bbcode/code.scss
+++ b/wcfsetup/install/files/style/bbcode/code.scss
@@ -83,6 +83,7 @@
 				white-space: pre-wrap;
 				word-break: break-all;
 				word-wrap: break-word;
+				z-index: 1;
 				
 				.lineAnchor {
 					bottom: 0;
@@ -91,10 +92,42 @@
 					top: 0;
 					width: 3.4em;
 				}
-				
-				&:target {
-					background-color: rgba(255, 255, 102, 1);
-				}
+			}
+		}
+	}
+	
+	.codeBoxJumpAnchor:target {
+		height: 100%;
+		pointer-events: none;
+		position: absolute;
+		width: 100%;
+		z-index: -1;
+		
+		&::after {
+			background-color: rgba(255, 255, 102, 1);
+			bottom: 0;
+			content: "";
+			display: block;
+			height: 100%;
+			left: 0;
+			position: absolute;
+			right: 0;
+			top: 0;
+		}
+		
+		@include screen-md-down {
+			top: -52px;
+			
+			&::after {
+				top: 52px;
+			}
+		}
+		
+		@include screen-lg {
+			top: -50px;
+			
+			&::after {
+				top: 50px;
 			}
 		}
 	}