Changeset 52198

Timestamp:

11/17/2021 05:18:09 PM (3 years ago)

Author:

joedolson

Message:

Toolbar: Prevent adminbar from hiding in-page anchors.

Use scroll-padding-top to offset scroll position on in-page anchors when adminbar is active. Also adjusts existing scroll padding for core themes that implement it.

Props afercia, kingkero, audrasjb, dufresnesteven, thimalw, sabernhardt, costdev.
Fixes #46371.

Location:

trunk/src

Files:

• wp-content/themes/twentyfourteen/rtl.css (modified) (1 diff)
• wp-content/themes/twentyfourteen/style.css (modified) (3 diffs)
• wp-content/themes/twentyseventeen/style.css (modified) (1 diff)
• wp-content/themes/twentysixteen/style.css (modified) (1 diff)
• wp-includes/css/admin-bar.css (modified) (1 diff)

trunk/src/wp-content/themes/twentyfourteen/rtl.css

@@ -167 +167 @@
 }
 
-.entry-content p span[id^="more-"] {
-    float: right;
-}
-
 
 /**

trunk/src/wp-content/themes/twentyfourteen/style.css

@@ -96 +96 @@
     -webkit-text-size-adjust: 100%;
     -ms-text-size-adjust:     100%;
+    scroll-padding-top: calc( var(--wp-admin--admin-bar--height, 0px) + 48px );
 }
 
@@ -1305 +1306 @@
 }
 
-.site-content .entry-content {
-    padding-top: 22px;
-}
-
 .page .entry-content {
     padding-top: 0;
@@ -1393 +1390 @@
 }
 
-.entry-content span[id^="more-"] {
-    display: block;
-    padding-top: 52px;
-    margin-top: -76px;
-}
-
-.admin-bar .entry-content span[id^="more-"] {
-    padding-top: 84px;
-    margin-top: -108px;
-}
-
-.entry-content span[id^="more-"] + blockquote,
-.entry-content span[id^="more-"] + div,
-.entry-content span[id^="more-"] + figure,
-.entry-content span[id^="more-"] + hr,
-.entry-content span[id^="more-"] + ol,
-.entry-content span[id^="more-"] + ul,
-.entry-content span[id^="more-"] + p,
-.entry-content span[id^="more-"] + pre {
-    margin-top: 24px;
-}
-
-.entry-content p span[id^="more-"] {
-    width: 1px;
-    height: 24px;
-    float: left;
-}
-
 /* Mediaelements */
 

trunk/src/wp-content/themes/twentyseventeen/style.css

@@ -3383 +3383 @@
 
 @media screen and (min-width: 48em) {
+    html {
+        scroll-padding-top: calc( var(--wp-admin--admin-bar--height, 0px) + 72px );
+    }
 
     /* Typography */

trunk/src/wp-content/themes/twentysixteen/style.css

@@ -2775 +2775 @@
 
 @media screen and (min-width: 44.375em) {
+    html {
+        scroll-padding-top: calc( var(--wp-admin--admin-bar--height, 0px) + 21px );
+    }
+
     body:not(.custom-background-image):before,
     body:not(.custom-background-image):after {

trunk/src/wp-includes/css/admin-bar.css

@@ -1 +1 @@
 html {
     --wp-admin--admin-bar--height: 32px;
+    scroll-padding-top: var(--wp-admin--admin-bar--height);
 }