fix(ui): right-anchor license icons and delete button as one group in model modal

This commit is contained in:
Will Miao
2026-08-24 11:39:17 +08:00
parent a7214b6cff
commit 40f922b0e8
2 changed files with 23 additions and 13 deletions
@@ -68,9 +68,9 @@
font-size: 14px;
}
/* Destructive modal action: ghost icon button pushed to the far right of the
header actions row, revealing the danger color only on hover/focus. Shared
by the model modal and the recipe modal. */
/* Destructive modal action: ghost icon button right-anchored by its own auto
margin, revealing the danger color only on hover/focus. Shared by the model
modal and the recipe modal. */
.modal-delete-btn {
display: inline-flex;
align-items: center;
@@ -98,9 +98,21 @@
font-size: 14px;
}
/* License icons no longer carry their own auto margin: the delete button's
margin-left: auto right-anchors the [delete][license] cluster, keeping the
icons flush against the right edge as before the delete button existed. */
/* When license icons directly precede the delete button, they carry the auto
margin instead, so the [license][delete] cluster stays right-anchored as
one group with the delete button flush at the right edge and no split gap. */
.modal-header-actions .license-restrictions {
margin-left: auto;
}
.modal-header-actions .license-permissions {
margin-left: auto;
}
.modal-header-actions .license-restrictions + .modal-delete-btn,
.modal-header-actions .license-permissions + .modal-delete-btn {
margin-left: 0;
}
.license-restrictions {
display: flex;