vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2025-10-16 12:05:38 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Toolbar: Provide a CSS custom property for the admin bar height.

Browse Source 
This new custom property, `--wp-admin--admin-bar--height`, reflects the admin bar's height and adjusts responsively on smaller screens. It can be used to offset content to avoid overlapping the admin bar, without needing to copy the media query.

This also removes a workaround only needed for Internet Explorer 6 and below.

Props nico23, sabernhardt.
Fixes #52623.



git-svn-id: https://develop.svn.wordpress.org/trunk@51672 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Kelly Choyce-Dwan 2021-08-26 18:23:49 +00:00
parent 80b24ab3f3
commit ebe147cb13
2 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/wp-includes/admin-bar.php
View File

@ -1167,10 +1167,8 @@ function _admin_bar_bump_cb() {
?>
<style<?php echo $type_attr; ?> media="screen">
html { margin-top: 32px !important; }
* html body { margin-top: 32px !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 46px !important; }
* html body { margin-top: 46px !important; }
}
</style>
<?php

8
src/wp-includes/css/admin-bar.css
View File

@ -1,3 +1,7 @@
html {
--wp-admin--admin-bar--height: 32px;
}
#wpadminbar * {
height: auto;
width: auto;
@ -729,6 +733,10 @@ html:lang(he-il) .rtl #wpadminbar * {
}
@media screen and (max-width: 782px) {
html {
--wp-admin--admin-bar--height: 46px;
}
/* Toolbar Touchification*/
html #wpadminbar {
height: 46px;