StackedRouter: fix content height is 0 on webkit
* for WebKit, fix the content height is 0 if the window width > 560px
This commit is contained in:
		
							parent
							
								
									9e9a831785
								
							
						
					
					
						commit
						a69a5c31e5
					
				
					 1 changed files with 11 additions and 2 deletions
				
			
		| 
						 | 
				
			
			@ -15,6 +15,16 @@ dialog.StackedPage {
 | 
			
		|||
  width: 560px;
 | 
			
		||||
  max-height: 100vh;
 | 
			
		||||
  max-height: 100dvh;
 | 
			
		||||
  /*
 | 
			
		||||
  * WebKit does not see contain-instric-size as the real element size.
 | 
			
		||||
  * If the container does not have height, the child element using 100%
 | 
			
		||||
  * height (usually Scafflod in our case) was have 0px computed height.
 | 
			
		||||
  *
 | 
			
		||||
  * This behaviour is different from Firefox. So we need to actually
 | 
			
		||||
  * define the box height here. (Rubicon)
 | 
			
		||||
  */
 | 
			
		||||
  height: 100vh;
 | 
			
		||||
  height: 100dvh;
 | 
			
		||||
  background: none;
 | 
			
		||||
  display: none;
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -31,10 +41,9 @@ dialog.StackedPage {
 | 
			
		|||
 | 
			
		||||
  @media (max-width: 560px) {
 | 
			
		||||
    & {
 | 
			
		||||
      margin: 0;
 | 
			
		||||
      width: 100vw;
 | 
			
		||||
      width: 100dvw;
 | 
			
		||||
      height: 100vh;
 | 
			
		||||
      height: 100dvh;
 | 
			
		||||
      contain-intrinsic-size: 100vw 100vh;
 | 
			
		||||
      contain-intrinsic-size: 100dvw 100dvh;
 | 
			
		||||
    }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue