Fix long domain block descriptions breaking table layout (#12029)
This commit is contained in:
		@@ -145,8 +145,6 @@ $small-breakpoint: 960px;
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
    thead tr,
 | 
					    thead tr,
 | 
				
			||||||
    tbody tr {
 | 
					    tbody tr {
 | 
				
			||||||
      break-after: auto;
 | 
					 | 
				
			||||||
      break-inside: avoid;
 | 
					 | 
				
			||||||
      border-bottom: 1px solid lighten($ui-base-color, 4%);
 | 
					      border-bottom: 1px solid lighten($ui-base-color, 4%);
 | 
				
			||||||
      font-size: 1em;
 | 
					      font-size: 1em;
 | 
				
			||||||
      line-height: 1.625;
 | 
					      line-height: 1.625;
 | 
				
			||||||
@@ -167,12 +165,25 @@ $small-breakpoint: 960px;
 | 
				
			|||||||
      padding: 8px;
 | 
					      padding: 8px;
 | 
				
			||||||
      align-self: start;
 | 
					      align-self: start;
 | 
				
			||||||
      align-items: start;
 | 
					      align-items: start;
 | 
				
			||||||
 | 
					      word-break: break-all;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
      &.nowrap {
 | 
					      &.nowrap {
 | 
				
			||||||
        white-space: nowrap;
 | 
					 | 
				
			||||||
        overflow: hidden;
 | 
					 | 
				
			||||||
        text-overflow: ellipsis;
 | 
					 | 
				
			||||||
        width: 25%;
 | 
					        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
 | 
					  %tbody
 | 
				
			||||||
    - domain_blocks.each do |domain_block|
 | 
					    - domain_blocks.each do |domain_block|
 | 
				
			||||||
      %tr
 | 
					      %tr
 | 
				
			||||||
        %td.nowrap= domain_block.domain
 | 
					        %td.nowrap
 | 
				
			||||||
        %td= domain_block.public_comment if display_blocks_rationale?
 | 
					          %span{ title: domain_block.domain }= domain_block.domain
 | 
				
			||||||
 | 
					        %td
 | 
				
			||||||
 | 
					          = domain_block.public_comment if display_blocks_rationale?
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user