ROU-12349: removing fixed height set in the html

[rugoncalves]

This PR is for changing a behavior of OutSystems UI forces a pixel size that breaks the app on iOS.

What was happening

• On native mobile, JS computed window.innerHeight on orientation-change and forced that static pixel value into the --viewport-height CSS custom property on document.body.
• Because an inline style always wins over a SCSS fallback, this static snapshot overrode any CSS-level vh fallback, so the layout never tracked the real visible viewport.
• As a result, iOS layouts using --viewport-height (.ios-bounce .main, and the dropdown ServerSide balloon's max-height) clipped or overflowed whenever the visible viewport changed (URL bar show/hide, keyboard open, safe-area settling, split view).
• A second, undocumented consumer of --viewport-height was also found in _dropdown-serverside.scss with no fallback at all, meaning it would break on every phone (Android and iOS) once the JS stopped setting the variable.

What was done

• Removed _isPhoneOrTablet() and its call site from LayoutPrivateBodyCssVars.ts - no JS code path forces a static pixel value into --viewport-height anymore.
• _ios-bounce.scss: layered max-height: var(--viewport-height, 100vh) on .main.
• _dropdown-serverside.scss: added the same layered 100vh fallback to the balloon's max-height calc (previously had no fallback at all).
• _layout.scss: split html out of the shared height: 100% reset and gave it its own layered height: 100vh;, so the rest of the chain (body, #reactContainer, #transitionContainer, .screen-container) inherits from the real visible viewport instead of a percentage-of-percentage chain.
• --viewport-height (and GlobalEnum.CSSVariables.ViewportHeight) is kept as a documented override hook for any future/consuming CSS, even though nothing sets it from JS anymore.
• Dark mode, high-contrast, and non-web-app header/footer sizing logic in LayoutPrivateBodyCssVars.ts are unchanged.

Test Steps

1. On an iOS device/simulator running the native mobile ios-bounce layout, trigger a visible-viewport change (show/hide the Safari URL bar, open the keyboard, or rotate and let the safe area settle).
2. Confirm .main no longer clips or overflows content, and scrolling/content areas resize smoothly with the real viewport.
3. Open a ServerSide Dropdown on a phone (Android and iOS) with no search in put and confirm the balloon's max-height still constrains it correctly.
4. Toggle dark mode and high-contrast mode, and confirm header/footer sizing for non-web-app scenarios is unaffected.
5. Run npm run build and npm run lint for both --target O11 and --target ODC - both succeed with no errors/warnings.

Checklist

• tested locally
• documented the code
• clean all warnings and errors of eslint
• requires changes in OutSystems (if so, provide a module with changes)
• requires new sample page in OutSystems (if so, provide a module with changes)

[Copilot]

Pull request overview

This PR removes the native-mobile JavaScript behavior that was forcing a static pixel --viewport-height onto document.body and replaces it with CSS-first dynamic viewport handling (layered vh → dvh fallbacks), preventing iOS visible-viewport changes (URL bar/keyboard/safe-area settling) from causing layout clipping/overflow. It also documents the architectural rationale via internal ADRs.

Changes:

• Removed the JS path that set --viewport-height to window.innerHeight + 'px' for phone/tablet.
• Updated iOS bounce layout and ServerSide Dropdown balloon to use layered var(--viewport-height, 100vh) then var(--viewport-height, 100dvh) to track dynamic viewport where supported.
• Adjusted the global layout reset so html is viewport-sized via layered 100vh/100dvh, and added internal ADR documentation files.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
src/scss/02-layout/_layout.scss	Split html out of the height reset and set layered 100vh/100dvh to align the height inheritance chain with the visible viewport.
src/scss/02-layout/_ios-bounce.scss	Layered max-height fallbacks so .main tracks dynamic viewport units when available.
src/scripts/OutSystems/OSUI/Utils/LayoutPrivateBodyCssVars.ts	Removed the phone/tablet code path that was forcing --viewport-height inline with a static px value.
src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/scss/_dropdown-serverside.scss	Added layered fallbacks for --viewport-height in balloon max-height calc to prevent regressions once JS no longer sets it.
docs-internal/Readme.md	Added internal documentation describing ADR purpose/process and an ADR log.
docs-internal/ADR-0001-ios-dynamic-viewport-height.md	Added ADR documenting the decision to replace JS-forced viewport height with CSS dynamic viewport units and related scope choices.
docs-internal/ADR-0000-Title-of-ADR.md	Added ADR template for future architectural decision records.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud