132 lines
2.3 KiB
SCSS
132 lines
2.3 KiB
SCSS
.task-order-summary {
|
|
|
|
@include media($medium-screen) {
|
|
@include grid-row;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.panel {
|
|
padding: 0 $gap * 2;
|
|
width: 100%;
|
|
|
|
@include ie-only {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
.task-order-heading {
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.task-order-heading__name {
|
|
align-items: center;
|
|
padding: $gap;
|
|
|
|
label {
|
|
padding: $gap;
|
|
}
|
|
}
|
|
|
|
.task-order-heading__value {
|
|
margin: 0 ($gap * 2);
|
|
text-align: right;
|
|
|
|
dt {
|
|
font-weight: bold;
|
|
}
|
|
dd {
|
|
}
|
|
}
|
|
}
|
|
|
|
.task-order-details {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.task-order-next-steps {
|
|
flex-grow: 1;
|
|
padding-right: $gap;
|
|
|
|
.task-order-next-steps__step {
|
|
.task-order-next-steps__icon {
|
|
padding: $gap $gap 0 0;
|
|
justify-content: center;
|
|
.complete {
|
|
@include icon-color($color-green);
|
|
}
|
|
.incomplete {
|
|
@include icon-color($color-gray-light);
|
|
}
|
|
}
|
|
|
|
.task-order-next-steps__heading {
|
|
h4 {
|
|
margin: $gap $gap 0 0;
|
|
}
|
|
}
|
|
.task-order-next-steps__description {
|
|
font-style: italic;
|
|
}
|
|
}
|
|
}
|
|
|
|
.task-order-sidebar {
|
|
flex-basis: 25%;
|
|
min-width: 30rem;
|
|
|
|
hr {
|
|
margin: 2rem 0;
|
|
}
|
|
}
|
|
|
|
.task-order-document-link {
|
|
&.disabled {
|
|
color: $color-shadow;
|
|
.task-order-document-link__icon {
|
|
span {
|
|
@include icon-color($color-cool-blue-lighter);
|
|
}
|
|
}
|
|
}
|
|
|
|
.task-order-document-link__icon {
|
|
padding-top: 0.5rem;
|
|
span {
|
|
@include icon-color($color-blue);
|
|
}
|
|
}
|
|
|
|
.task-order-document-details {
|
|
.task-order-document-details__description {
|
|
font-style: italic;
|
|
}
|
|
|
|
.task-order-document-details__disabled_link {
|
|
@include icon-link;
|
|
cursor: unset;
|
|
&:hover {
|
|
background-color: unset;
|
|
color: $color-cool-blue-lighter;
|
|
}
|
|
color: $color-cool-blue-lighter;
|
|
}
|
|
}
|
|
}
|
|
|
|
.task-order-invitation-status {
|
|
.invited {
|
|
color: $color-green;
|
|
@include icon-color($color-green);
|
|
}
|
|
.uninvited {
|
|
color: $color-red;
|
|
@include icon-color($color-red);
|
|
}
|
|
|
|
.task-order-invitation-status__icon {
|
|
padding: 0 0.5rem;
|
|
}
|
|
}
|
|
|
|
}
|