40 lines
764 B
SCSS
40 lines
764 B
SCSS
%composite-row {
|
|
display: grid;
|
|
grid-template-columns: auto 50px;
|
|
grid-template-rows: 50% 50%;
|
|
|
|
grid-template-areas:
|
|
'header actions'
|
|
'detail actions';
|
|
}
|
|
%with-one-action-row {
|
|
@extend %composite-row;
|
|
grid-template-columns: 1fr auto;
|
|
padding-right: 12px;
|
|
}
|
|
%composite-row-header {
|
|
grid-area: header;
|
|
align-self: start;
|
|
}
|
|
%composite-row-detail {
|
|
grid-area: detail;
|
|
align-self: end;
|
|
}
|
|
%composite-row-detail * {
|
|
flex-wrap: nowrap !important;
|
|
}
|
|
%composite-row-actions {
|
|
grid-area: actions;
|
|
justify-self: center;
|
|
align-self: center;
|
|
}
|
|
|
|
%composite-row-header:nth-last-child(2) {
|
|
grid-column-start: header;
|
|
grid-column-end: actions;
|
|
}
|
|
%composite-row-detail:last-child {
|
|
grid-column-start: detail;
|
|
grid-column-end: actions;
|
|
}
|