bug: Ion footer has no padding if app has ion tab bar hidden

[nadavhalfon]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.x

Current Behavior

  render() {
    const { translucent, collapse } = this;
    const mode = getIonMode(this);
    const tabs = this.el.closest('ion-tabs');
    const tabBar = tabs?.querySelector(':scope > ion-tab-bar');

    return (
      <Host
        role="contentinfo"
        class={{
          [mode]: true,

          // Used internally for styling
          [`footer-${mode}`]: true,

          [`footer-translucent`]: translucent,
          [`footer-translucent-${mode}`]: translucent,
          ['footer-toolbar-padding']: !this.keyboardVisible && (!tabBar || tabBar.slot !== 'bottom'),

          [`footer-collapse-${collapse}`]: collapse !== undefined,
        }}
      >
        {mode === 'ios' && translucent && <div class="footer-background"></div>}
        <slot></slot>
      </Host>
    );
  }

ion-footer doesn't have the "footer-toolbar-padding" if app contains a tab-bar

Expected Behavior

As there are some workaround online to hide the tab bar when navigating to child routes I think there should be a check of whether the tab-bar is displayed (by checking if display none is applied).
That way there is no harm to a case where the tab bar is always shown but benefit when a user wants to manually hide it in some pages
Btw there could be serval ways to hide or show the tab bar but that's not the main thing I wanted to show

Steps to Reproduce

https://stackblitz.com/edit/sb1-wnpdveiy?file=src%2Fpages%2FTabsPage.tsx

You won't be able to see the problem not on real device unless you inspect the classes in DOM

Code Reproduction URL

https://stackblitz.com/edit/sb1-wnpdveiy?file=src%2Fpages%2FTabsPage.tsx

Ionic Info

"@ionic/react": "^8.4.3",
"@ionic/react-router": "^8.4.3",
"ionicons": "^7.2.2",
"lucide-react": "^0.344.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router": "^5.3.4",
"react-router-dom": "^5.3.4"

Additional Information

No response