Browse Source

fix(iot-hub): let active-filters row grow when chips wrap so card grid doesn't overlap

PROD-8420: .tb-iot-hub-sort-row was locked to height: 32px, so when many use-case filters were selected the chip-set wrapped to multiple lines but the row stayed one line tall and the card grid below rendered on top of the wrapped chips. Switch to min-height: 32px so the row keeps its baseline single-line height when empty but grows naturally with wrapped chips.
pull/15842/head
Igor Kulikov 3 months ago
parent
commit
0db943f442
  1. 7
      ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.scss

7
ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.scss

@ -359,14 +359,17 @@
}
}
// Filter chips row — Design: 32px tall, no padding, centered
.tb-iot-hub-sort-row {
height: 32px;
min-height: 32px;
align-items: center;
padding: 0;
margin-top: 16px;
margin-bottom: 12px;
::ng-deep .mat-mdc-chip-set .mdc-evolution-chip-set__chips {
row-gap: 8px;
}
.mat-mdc-chip {
margin-top: 0;
margin-bottom: 0;

Loading…
Cancel
Save