Fix long domain block descriptions breaking table layout (#12029)
This commit is contained in:
		
							parent
							
								
									6faa98aee2
								
							
						
					
					
						commit
						c35376132b
					
				
					 2 changed files with 20 additions and 7 deletions
				
			
		|  | @ -145,8 +145,6 @@ $small-breakpoint: 960px; | |||
| 
 | ||||
|     thead tr, | ||||
|     tbody tr { | ||||
|       break-after: auto; | ||||
|       break-inside: avoid; | ||||
|       border-bottom: 1px solid lighten($ui-base-color, 4%); | ||||
|       font-size: 1em; | ||||
|       line-height: 1.625; | ||||
|  | @ -167,12 +165,25 @@ $small-breakpoint: 960px; | |||
|       padding: 8px; | ||||
|       align-self: start; | ||||
|       align-items: start; | ||||
|       word-break: break-all; | ||||
| 
 | ||||
|       &.nowrap { | ||||
|         white-space: nowrap; | ||||
|         overflow: hidden; | ||||
|         text-overflow: ellipsis; | ||||
|         width: 25%; | ||||
|         position: relative; | ||||
| 
 | ||||
|         &::before { | ||||
|           content: ' '; | ||||
|           visibility: hidden; | ||||
|         } | ||||
| 
 | ||||
|         span { | ||||
|           position: absolute; | ||||
|           left: 8px; | ||||
|           right: 8px; | ||||
|           white-space: nowrap; | ||||
|           overflow: hidden; | ||||
|           text-overflow: ellipsis; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  |  | |||
|  | @ -6,5 +6,7 @@ | |||
|   %tbody | ||||
|     - domain_blocks.each do |domain_block| | ||||
|       %tr | ||||
|         %td.nowrap= domain_block.domain | ||||
|         %td= domain_block.public_comment if display_blocks_rationale? | ||||
|         %td.nowrap | ||||
|           %span{ title: domain_block.domain }= domain_block.domain | ||||
|         %td | ||||
|           = domain_block.public_comment if display_blocks_rationale? | ||||
|  |  | |||
		Reference in a new issue