ionic-framework icon indicating copy to clipboard operation
ionic-framework copied to clipboard

bug: grid breakpoints based on window causing grid to be wrong in modal

Open conde2 opened this issue 4 years ago • 5 comments

Bug Report

Ionic version:

[ ] 4.x [x] 5.6.4

Current behavior: The grid sizing is relative to the screen size.

Expected behavior: The grid sizing be relative to the modal size.

Steps to reproduce: Use the code given to createa component, open a modal window with the given component, check in the console the calc is using 4 instead of 6.

Related code:

  <ion-grid fixed>
      <ion-row>
        <ion-col size-sm="6" size-md="6" size-lg="4">
        </ion-col>
        <ion-col size-sm="6" size-md="6" size-lg="4">
        </ion-col>
        <ion-col size-sm="6" size-md="6" size-lg="4">
        </ion-col>
    </ion-row>
  </ion-grid>

Other information:

Ionic info:

[WARN] Error loading @capacitor/core package.json: Error: Cannot find module '@capacitor/core/package'

       Require stack:
       - C:\Users\joao_\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
       - C:\Users\joao_\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
       - C:\Users\joao_\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
       - C:\Users\joao_\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic

Ionic:

   Ionic CLI                     : 6.12.4 (C:\Users\joao_\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework               : @ionic/angular 5.6.4
   @angular-devkit/build-angular : 0.1100.7
   @angular-devkit/schematics    : 11.2.4
   @angular/cli                  : 11.2.8
   @ionic/angular-toolkit        : 2.3.3

Capacitor:

   Capacitor CLI   : not installed
   @capacitor/core : not installed

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v14.15.4 (C:\Program Files\nodejs\node.exe)
   npm    : 6.14.10
   OS     : Windows 10

conde2 avatar Apr 17 '21 15:04 conde2

Thanks for the issue. I can reproduce this behavior. The issue looks like we are checking breakpoints on the window rather than on the modal: https://github.com/ionic-team/ionic-framework/blob/master/core/src/utils/media.ts#L13-L21

liamdebeasi avatar Apr 19 '21 14:04 liamdebeasi

@liamdebeasi is there any priority issues schema or roadmap that I can follow to see when this issue will be worked on?

conde2 avatar Apr 26 '21 14:04 conde2

The Ionic Core Project Board shows what we are working on right now (in progress, in review, merged, etc).

The milestones also give you an idea of which release a particular commit will be a part of: https://github.com/ionic-team/ionic-framework/milestones.

liamdebeasi avatar Apr 26 '21 15:04 liamdebeasi

Thanks! Will follow it.

conde2 avatar Apr 26 '21 16:04 conde2

+1

ralphcode avatar Jul 25 '24 00:07 ralphcode