So we could try adding a class to the body when the top bar is hidden, as you already have cookied close top bar script try updating it to this:
jQuery(document).ready( function( $ ) {
// Get our cookie
var cookie = getCookie('closetopbar');
// Check if the cookie is set
if(cookie){
// If yes, hide the top bar
$('.top-bar').hide();
// Add this code below
$("body").addClass("top-bar-hidden");
}else{
// If no, fire a function when the close button is clicked
$('.top-close-button').on('click', function(e) {
e.preventDefault();
setCookie('closetopbar',true,0);
$('.top-bar').css('transform', 'translate(0%, -100%)');
// Add this code below
$("body").addClass("top-bar-hidden");
if ($('div#wpadminbar')[0]){
$('body').css('transform', 'translate(0, -112px)');
} else {
$('body').css('transform', 'translate(0, -76px)');
}
});
}
});
There are two instances of:
// Add this code below
$("body").addClass("top-bar-hidden");
Which need to be added – you can change the comment.
If it works we should see the top-bar-hidden
class in body
tag.
We can then do some CSS that uses body:not(.top-bar-hidden) .element { styles }