feat (skip-links): set top value with --wp-admin--admin-bar--height

firestar300 · firestar300 · commit 22eb28a459da · 2023-08-07T17:21:44.000+02:00
diff --git a/src/scss/03-base/_variables-css.scss b/src/scss/03-base/_variables-css.scss
@@ -41,10 +41,10 @@
     /*
      * Admin bar
      */
-    --wp-admin-bar-height: 0rem;
+    --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 0rem);
 
     .admin-bar {
-        --wp-admin-bar-height: 46px;
+        --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 46px);
     }
 
     /*
@@ -76,7 +76,7 @@
          */
         &:not(.scroll-top) {
             .admin-bar {
-                --wp-admin-bar-height: 0rem;
+                --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 0rem);
             }
         }
     }
@@ -86,7 +86,7 @@
          * Admin bar
          */
         .admin-bar {
-            --wp-admin-bar-height: 32px;
+            --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 32px);
         }
     }
 
diff --git a/src/scss/05-components/_skip-links.scss b/src/scss/05-components/_skip-links.scss
@@ -1,6 +1,6 @@
 .skip-links {
     position: absolute;
-    top: 0;
+    top: var(--wp-admin-bar-height);
     left: 0;
     z-index: 10;
     display: flex;

Original file line number	Diff line number	Diff line change
`@@ -41,10 +41,10 @@`
`41`	`41`	`/*`
`42`	`42`	`* Admin bar`
`43`	`43`	`*/`
`44`		`- --wp-admin-bar-height: 0rem;`
	`44`	`+ --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 0rem);`
`45`	`45`
`46`	`46`	`.admin-bar {`
`47`		`- --wp-admin-bar-height: 46px;`
	`47`	`+ --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 46px);`
`48`	`48`	`}`
`49`	`49`
`50`	`50`	`/*`
`@@ -76,7 +76,7 @@`
`76`	`76`	`*/`
`77`	`77`	`&:not(.scroll-top) {`
`78`	`78`	`.admin-bar {`
`79`		`- --wp-admin-bar-height: 0rem;`
	`79`	`+ --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 0rem);`
`80`	`80`	`}`
`81`	`81`	`}`
`82`	`82`	`}`
`@@ -86,7 +86,7 @@`
`86`	`86`	`* Admin bar`
`87`	`87`	`*/`
`88`	`88`	`.admin-bar {`
`89`		`- --wp-admin-bar-height: 32px;`
	`89`	`+ --wp-admin-bar-height: var(--wp-admin--admin-bar--height, 32px);`
`90`	`90`	`}`
`91`	`91`	`}`
`92`	`92`