7c7cf2b043
The problem of having actions next to the title is that, when there are titles of very different lenghts, at certain resolutions some actions will be next to their titles (because there'll be space for everything) but some actions will be below their titles. This makes it hard for people to follow where the actions are.
73 lines
1.0 KiB
SCSS
73 lines
1.0 KiB
SCSS
.admin .groups-and-headings {
|
|
$gap: rem-calc(map-get($grid-column-gutter, medium));
|
|
@include admin-action-icons;
|
|
|
|
> section + section {
|
|
margin-top: $line-height * 1.5;
|
|
}
|
|
|
|
dt,
|
|
dd {
|
|
display: inline;
|
|
}
|
|
|
|
dt {
|
|
font-weight: normal;
|
|
}
|
|
|
|
dd {
|
|
font-weight: bold;
|
|
}
|
|
|
|
th:last-child {
|
|
text-align: $global-right;
|
|
}
|
|
|
|
.table-actions {
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.groups-actions {
|
|
@include flex-with-gap($gap);
|
|
align-items: flex-start;
|
|
|
|
+ * {
|
|
margin-top: $line-height / 2;
|
|
}
|
|
|
|
.edit-link,
|
|
.destroy-link {
|
|
@include icon-on-top;
|
|
}
|
|
|
|
.new-link {
|
|
@include hollow-button;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
> :nth-last-child(2) {
|
|
margin-#{$global-right}: $gap;
|
|
}
|
|
|
|
> :last-child {
|
|
margin-#{$global-left}: auto;
|
|
}
|
|
|
|
button {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.new-link {
|
|
@include has-fa-icon(plus-square, solid);
|
|
|
|
&::before {
|
|
margin-#{$global-right}: $font-icon-margin;
|
|
}
|
|
}
|
|
|
|
> .new-link {
|
|
@include regular-button;
|
|
}
|
|
}
|