Move status flow css to independent scope [SCI-9027]

This commit is contained in:
Anton 2023-08-23 15:37:18 +02:00
parent f964a7461d
commit d99ba04e39
2 changed files with 61 additions and 67 deletions

View file

@ -602,78 +602,11 @@
min-width: 115px;
}
}
.task-sharing-and-flows {
#dropdownTaskFlowList {
min-width: 230px;
}
.status-label {
@include font-button;
flex-basis: 50%;
margin-right: .5em;
text-align: right;
.status-title {
@include font-small;
color: var(--sn-grey);
margin-right: .2em;
}
.status-note {
font-weight: normal;
}
.pull-right {
font-weight: 400;
}
}
.status-flow-dropdown {
&:last-child {
margin-right: 0;
}
}
.status-buttons {
display: flex;
> :not(:first-child):not(.dropdown-menu) {
margin-left: .5em;
}
}
.status-transition-error {
@include font-small;
color: $brand-danger;
margin-top: .5em;
.fas {
margin-right: .5em;
}
}
}
}
@media (max-width: 810px) {
.task-information .task-section-header {
display: block;
.status-label,
.status-buttons {
display: block;
max-width: 230px;
}
.status-label {
margin: 0;
text-align: left;
}
.status-buttons > :not(:first-child):not(.dropdown-menu) {
margin-left: 0;
margin-top: .5em;
}
}
.task-information .expanded {

View file

@ -3,6 +3,67 @@
// scss-lint:disable SelectorFormat
// scss-lint:disable ImportantRule
.task-sharing-and-flows {
#dropdownTaskFlowList {
min-width: 230px;
}
.status-flow-dropdown {
&:last-child {
margin-right: 0;
}
}
.status-buttons {
display: flex;
> :not(:first-child):not(.dropdown-menu) {
margin-left: .5em;
}
.status-flow-dropdown[data-status-changing=true] {
.caret.pull-right {
display: none;
}
}
> div > .btn {
min-width: 115px;
}
}
.status-transition-error {
@include font-small;
color: $brand-danger;
margin-top: .5em;
.fas {
margin-right: .5em;
}
}
.status-label {
@include font-button;
flex-basis: 50%;
margin-right: .5em;
text-align: right;
.status-title {
@include font-small;
color: var(--sn-grey);
margin-right: .2em;
}
.status-note {
font-weight: normal;
}
.pull-right {
font-weight: 400;
}
}
}
.status-flow-dropdown {
.dropdown-toggle {
color: $color-white;