fix(orders): stop no-thumbnail order items being squeezed
Order items without a product thumbnail render the title and price into the 3-column grid with the image slot missing, so the title gets crushed into the 64px image column and the price floats far right. Tag such items with a --no-image modifier that drops the image column (desktop: title fills the row with price right-aligned; mobile: title full-width, price wraps below).
This commit is contained in:
@@ -315,6 +315,12 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Item without a thumbnail: drop the fixed 64px image column so the title
|
||||
* and price fill the row instead of being crushed into the missing image cell. */
|
||||
.aksrt-orders-page__card-item--no-image {
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
}
|
||||
|
||||
.aksrt-orders-page__card-img {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
@@ -1520,6 +1526,14 @@ html.dark .aksrt-order-detail-dialog .aksrt-modal__footer {
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.aksrt-orders-page__card-item--no-image {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.aksrt-orders-page__card-item--no-image .aksrt-orders-page__card-item-price {
|
||||
grid-column: auto;
|
||||
}
|
||||
|
||||
.aksrt-orders-page__card-time {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
|
||||
Reference in New Issue
Block a user