Fix new hashtag page's items not being full-width on mobile (#9852)
Fix #9845
This commit is contained in:
		
					parent
					
						
							
								32daecffef
							
						
					
				
			
			
				commit
				
					
						b506ce1197
					
				
			
		
					 3 changed files with 11 additions and 3 deletions
				
			
		|  | @ -54,7 +54,7 @@ export default class DetailedStatus extends ImmutablePureComponent { | |||
| 
 | ||||
|   _measureHeight (heightJustChanged) { | ||||
|     if (this.props.measureHeight && this.node) { | ||||
|       scheduleIdleTask(() => this.node && this.setState({ height: this.node.scrollHeight })); | ||||
|       scheduleIdleTask(() => this.node && this.setState({ height: Math.ceil(this.node.scrollHeight) + 1 })); | ||||
| 
 | ||||
|       if (this.props.onHeightChange && heightJustChanged) { | ||||
|         this.props.onHeightChange(); | ||||
|  |  | |||
|  | @ -295,7 +295,7 @@ | |||
|         color: $primary-text-color; | ||||
|       } | ||||
| 
 | ||||
|       @media screen and (max-width: $no-gap-breakpoint) { | ||||
|       @media screen and (max-width: 550px) { | ||||
|         &.optional { | ||||
|           display: none; | ||||
|         } | ||||
|  |  | |||
|  | @ -432,6 +432,10 @@ $fluid-breakpoint: $maximum-width + 20px; | |||
| .statuses-grid { | ||||
|   min-height: 600px; | ||||
| 
 | ||||
|   @media screen and (max-width: 640px) { | ||||
|     width: 100% !important; // Masonry layout is unnecessary at this width | ||||
|   } | ||||
| 
 | ||||
|   &__item { | ||||
|     width: (960px - 20px) / 3; | ||||
| 
 | ||||
|  | @ -439,6 +443,10 @@ $fluid-breakpoint: $maximum-width + 20px; | |||
|       width: (940px - 20px) / 3; | ||||
|     } | ||||
| 
 | ||||
|     @media screen and (max-width: 640px) { | ||||
|       width: 100%; | ||||
|     } | ||||
| 
 | ||||
|     @media screen and (max-width: $no-gap-breakpoint) { | ||||
|       width: 100vw; | ||||
|     } | ||||
|  | @ -448,7 +456,7 @@ $fluid-breakpoint: $maximum-width + 20px; | |||
|     border-radius: 4px; | ||||
| 
 | ||||
|     @media screen and (max-width: $no-gap-breakpoint) { | ||||
|       border-bottom: 1px solid lighten($ui-base-color, 12%); | ||||
|       border-top: 1px solid lighten($ui-base-color, 16%); | ||||
|     } | ||||
| 
 | ||||
|     &.compact { | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue