Issue Description
I am trying to use the new liquid glass components. I see a rescaling issue on iPad. When window is resized the liquidGlass container behaves random, even so I have all dimensions fixed to static values. The attached video best shows the issue, Look for the menu bar top left "Main Menu" button. The issue also persists when using a LiquidGlassContainer around the LiquidGlass component
LiquidClassBrokenRescaling.mov
Reproduction
Here. a minimum code example
`
<GridLayout [rows]="_rows()" columns="*" class="mnd" iosOverflowSafeArea="true" class="side-bar-gradient mnd p-x-10" style="border-radius: 0 15 15 0; margin: 15 0 15 0;">
<LiquidGlass row="1" col="0" width="230" height="60" horizontalAlignment="left" class="zero" [isEnabled]="_homeBtnEnabled()" (tap)="onGoHome()">
<Label text="" width="50" height="60" class="fsap icon-font-button zero" [isEnabled]="_homeBtnEnabled()" textAlignment="center"
horizontalAlignment="left"></Label>
<Label row="1" text="{{ 'general.strMainMenu' | L }}" width="180" height="60" translateX="50" class="h1 always-white-text" horizontalAlignment="left"
[isEnabled]="_homeBtnEnabled()"></Label>
</LiquidGlass>
`
Relevant log output (if applicable)
Environment
OS : macOS 26.3
CPU : (10) arm64 Apple M1 Pro
Shell : /bin/zsh
node : 24.12.0
npm : 11.6.2
nativescript : 9.0.3
# android
java : 17.0.14
ndk : Not Found
apis : Not Found
build_tools : Not Found
system_images : Not Found
# ios
xcode : 26.2/17C52
cocoapods : 1.16.2
python : 3.13.2
python3 : 3.13.2
ruby : 3.4.2
platforms :
- DriverKit 25.2
- iOS 26.2
- macOS 26.2
- tvOS 26.2
- visionOS 26.2
- watchOS 26.2
Dependencies
"dependencies" : {
"@angular/animations" : " 21.1.4" ,
"@angular/common" : " 21.1.4" ,
"@angular/compiler" : " 21.1.4" ,
"@angular/core" : " 21.1.4" ,
"@angular/forms" : " 21.1.4" ,
"@angular/platform-browser" : " 21.1.4" ,
"@angular/platform-browser-dynamic" : " 21.1.4" ,
"@angular/router" : " 21.1.4" ,
"@apollo/client" : " 4.1.4" ,
"@mnd/sqlcipher" : " file:../app-plugins/dist/packages/sqlcipher/mnd-sqlcipher-1.0.0.tgz" ,
"@nativescript/angular" : " 21.0.0" ,
"@nativescript/core" : " 9.0.13" ,
"@nativescript/iqkeyboardmanager" : " 2.1.2" ,
"@nativescript/localize" : " 5.2.0" ,
"@nativescript/secure-storage" : " 4.0.1" ,
"@nativescript/theme" : " 3.1.0" ,
"apollo-angular" : " 13.0.0" ,
"apollo3-cache-persist" : " 0.15.0" ,
"d3-ease" : " 3.0.1" ,
"graphql" : " 16.12.0" ,
"graphql-tag" : " 2.12.6" ,
"intl" : " 1.2.5" ,
"moment" : " 2.30.1" ,
"nativescript-oauth2-ext" : " file:../app-plugins-customized/nativescript-oauth2-ext/publish/package/nativescript-oauth2-ext-3.0.5.tgz" ,
"nativescript-ui-calendar" : " 15.2.3" ,
"nativescript-ui-gauge" : " 15.2.3" ,
"rxjs" : " 7.8.2" ,
"util" : " 0.12.5" ,
"url" : " 0.11.4" ,
"uuidjs" : " 5.1.0"
},
"devDependencies" : {
"@angular-devkit/build-angular" : " 21.1.4" ,
"@angular/compiler-cli" : " 21.1.4" ,
"@graphql-codegen/cli" : " 6.1.1" ,
"@graphql-codegen/fragment-matcher" : " 6.0.0" ,
"@graphql-codegen/introspection" : " 5.0.0" ,
"@graphql-codegen/typescript" : " 5.0.7" ,
"@graphql-codegen/typescript-apollo-angular" : " 4.0.1" ,
"@graphql-codegen/typescript-operations" : " 5.0.7" ,
"@nativescript/android" : " 9.0.2" ,
"@nativescript/ios" : " 9.0.3" ,
"@nativescript/types" : " 9.0.0" ,
"@nativescript/webpack" : " 5.0.31" ,
"@ngtools/webpack" : " 21.1.4" ,
"@types/d3-ease" : " 3.0.2" ,
"@types/intl" : " 1.2.2" ,
"@types/lodash" : " 4.17.23" ,
"@types/node" : " 25.2.3" ,
"keycloak-request-token" : " 0.1.0" ,
"patch-package" : " ^8.0.1" ,
"rimraf" : " 6.1.3" ,
"sass" : " 1.97.2" ,
"ts-node" : " 10.9.2" ,
"typescript" : " 5.9.3"
}
Please accept these terms
Issue Description
I am trying to use the new liquid glass components. I see a rescaling issue on iPad. When window is resized the liquidGlass container behaves random, even so I have all dimensions fixed to static values. The attached video best shows the issue, Look for the menu bar top left "Main Menu" button. The issue also persists when using a LiquidGlassContainer around the LiquidGlass component
LiquidClassBrokenRescaling.mov
Reproduction
Here. a minimum code example
`
<GridLayout [rows]="_rows()" columns="*" class="mnd" iosOverflowSafeArea="true" class="side-bar-gradient mnd p-x-10" style="border-radius: 0 15 15 0; margin: 15 0 15 0;">
`
Relevant log output (if applicable)
Environment
Dependencies
Please accept these terms